@fundamental-ngx/core 0.35.5-rc.6 → 0.35.6

package/fesm2020/fundamental-ngx-core-menu.mjs

@@ -20,6 +20,7 @@ import * as i4 from '@fundamental-ngx/core/button';
 import { ButtonModule } from '@fundamental-ngx/core/button';
 import * as i5 from '@fundamental-ngx/core/title';
 import * as i6 from '@fundamental-ngx/core/bar';
+import { coerceBooleanProperty } from '@angular/cdk/coercion';
 
 /**
  * The directive that represents the menu title.
@@ -132,8 +133,8 @@ class MenuService {
         return this._rtlService?.rtl.value;
     }
     /** Reference to menu component */
-    get menu() {
-        return this._menu;
+    get menuComponent() {
+        return this._menuComponent;
     }
     /** Returns menu mode observable */
     get isMobileMode() {
@@ -174,9 +175,9 @@ class MenuService {
         this._emitActivePath();
     }
     /** Initializes menu service based on given Menu Component */
-    setMenuRoot(menu) {
-        this._menu = menu;
-        this.menuMap = this._buildMenuMap(this._menu);
+    setMenuComponent(menu) {
+        this._menuComponent = menu;
+        this.menuMap = this._buildMenuMap(this._menuComponent);
     }
     /** Clears Active Node Path and resets Focused Node */
     resetMenuState() {
@@ -188,7 +189,7 @@ class MenuService {
      *  - Validates Active Node Path
      *  - Validates Focused Node */
     rebuildMenu() {
-        this.menuMap = this._buildMenuMap(this._menu);
+        this.menuMap = this._buildMenuMap(this._menuComponent);
         const deadNode = this.activeNodePath.find((node) => !this.menuMap.has(node.item));
         if (deadNode?.item) {
             this.setActive(false, deadNode.item);
@@ -253,7 +254,7 @@ class MenuService {
                 item: menuItem,
                 parent: null,
                 children: menuItem.submenu
-                    ? menuItem.submenu.menuItems.toArray().map((subMenuItem) => buildNode(subMenuItem))
+                    ? menuItem.submenu.menuItems.map((subMenuItem) => buildNode(subMenuItem))
                     : []
             };
         }
@@ -266,11 +267,12 @@ class MenuService {
             node.children.forEach((childNode) => toMap(childNode, map));
             return map;
         }
+        const rootItems = menu._menuItems.filter((rootItem) => !rootItem.parentSubmenu);
         /** root item */
         const menuTree = {
             item: null,
             parent: null,
-            children: menu.menuItems.toArray().map((item) => buildNode(item))
+            children: rootItems.map((item) => buildNode(item))
         };
         setParents(menuTree, null);
         return toMap(menuTree);
@@ -280,8 +282,8 @@ class MenuService {
         const menuNode = this.menuMap.get(menuItem);
         const children = menuNode?.parent?.children.map((i) => i.item);
         const activeSibling = this.activeNodePath.find((i) => children?.includes(i.item));
-        const activeParentIndex = this.activeNodePath.indexOf(menuNode?.parent);
         if (activeSibling) {
+            const activeParentIndex = this.activeNodePath.indexOf(menuNode?.parent);
             this._removeFromActivePath(activeParentIndex !== -1 ? activeSibling.item : this.activeNodePath[0].item);
         }
     }
@@ -331,8 +333,8 @@ class MenuService {
                 focusRight(focusedNode);
             }
         }
-        else if (KeyUtil.isKeyCode(event, ESCAPE) && this.menu.closeOnEscapeKey) {
-            this.menu.close();
+        else if (KeyUtil.isKeyCode(event, ESCAPE) && this.menuComponent.closeOnEscapeKey) {
+            this.menuComponent.close();
         }
         else {
             matched = false;
@@ -343,7 +345,7 @@ class MenuService {
     }
     /** @hidden Emits an array of active menu items */
     _emitActivePath() {
-        this.menu.activePath.emit(this.activeNodePath.map((node) => node.item));
+        this.menuComponent.activePath.emit(this.activeNodePath.map((node) => node.item));
     }
     /** @hidden Depending on direction returns closest enabled sibling of given node */
     _closestEnabled(node, direction) {
@@ -391,6 +393,13 @@ class MenuItemComponent {
         this._hoverSubscriptions = new Subscription();
     }
     /** @hidden */
+    ngOnInit() {
+        if (this.parentSubmenu) {
+            this._submenu = this.parentSubmenu;
+            this._submenu._registerItem(this);
+        }
+    }
+    /** @hidden */
     ngAfterContentInit() {
         this._setMenuService();
         this._initialiseItemState();
@@ -409,12 +418,15 @@ class MenuItemComponent {
     }
     /** @hidden */
     ngOnDestroy() {
+        if (this.parentSubmenu) {
+            this._submenu?._unregisterItem(this);
+        }
         this._subscriptions.unsubscribe();
         this._hoverSubscriptions.unsubscribe();
     }
     /** Whether menu item has popup (desktop mode)  */
     get hasPopup() {
-        return !!this.submenu && (!this.menuService?.menu || !this.menuService?.menu.mobile);
+        return !!this.submenu && (!this.menuService?.menuComponent || !this.menuService?.menuComponent.mobile);
     }
     /** Focuses Menu Item interactive element */
     focus() {
@@ -447,7 +459,7 @@ class MenuItemComponent {
         const hoverSubscriptions = new Subscription();
         const mouseEnter$ = fromEvent(this.menuInteractive.elementRef.nativeElement, 'mouseenter');
         const mouseLeave$ = fromEvent(this.menuInteractive.elementRef.nativeElement, 'mouseleave');
-        const timerFactory$ = defer(() => timer(this.menuService ? this.menuService.menu.openOnHoverTime : 0).pipe(takeUntil(mouseLeave$)));
+        const timerFactory$ = defer(() => timer(this.menuService ? this.menuService.menuComponent.openOnHoverTime : 0).pipe(takeUntil(mouseLeave$)));
         // Set active on hover
         hoverSubscriptions.add(mouseEnter$
             .pipe(filter(() => !!this.menuService), switchMap(() => timerFactory$))
@@ -494,7 +506,7 @@ class MenuItemComponent {
     }
 }
 MenuItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: MenuItemComponent, deps: [{ token: i0.ElementRef }, { token: MenuService, optional: true }, { token: i0.ChangeDetectorRef }, { token: SUBMENU, optional: true }], target: i0.ɵɵFactoryTarget.Component });
-MenuItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: MenuItemComponent, selector: "li[fd-menu-item]", inputs: { disabled: "disabled", itemId: "itemId", submenu: "submenu" }, outputs: { onSelect: "onSelect" }, host: { attributes: { "attr.role": "menuitem" }, properties: { "class.fd-menu__item": "true" } }, queries: [{ propertyName: "menuItemTitle", first: true, predicate: MenuTitleDirective, descendants: true }, { propertyName: "menuInteractive", first: true, predicate: MenuInteractiveDirective, descendants: true }], exportAs: ["fd-menu-item"], usesOnChanges: true, ngImport: i0, template: "<ng-content></ng-content>\n\n<ng-container *ngIf=\"hasPopup && submenu\">\n    <ul\n        class=\"fd-menu__sublist\"\n        role=\"menu\"\n        [attr.id]=\"itemId\"\n        [attr.aria-hidden]=\"!submenuVisible\"\n        [attr.aria-label]=\"submenu.ariaLabel\"\n        [attr.aria-labelledby]=\"submenu.ariaLabelledby\"\n    >\n        <ng-container *ngTemplateOutlet=\"submenu.templateRef\"></ng-container>\n    </ul>\n</ng-container>\n", directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+MenuItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: MenuItemComponent, selector: "li[fd-menu-item]", inputs: { disabled: "disabled", itemId: "itemId", submenu: "submenu", parentSubmenu: "parentSubmenu" }, outputs: { onSelect: "onSelect" }, host: { attributes: { "attr.role": "menuitem" }, properties: { "class.fd-menu__item": "true" } }, queries: [{ propertyName: "menuItemTitle", first: true, predicate: MenuTitleDirective, descendants: true }, { propertyName: "menuInteractive", first: true, predicate: MenuInteractiveDirective, descendants: true }], exportAs: ["fd-menu-item"], usesOnChanges: true, ngImport: i0, template: "<ng-content></ng-content>\n\n<ng-container *ngIf=\"hasPopup && submenu\">\n    <ul\n        class=\"fd-menu__sublist\"\n        role=\"menu\"\n        [attr.id]=\"itemId\"\n        [attr.aria-hidden]=\"!submenuVisible\"\n        [attr.aria-label]=\"submenu.ariaLabel\"\n        [attr.aria-labelledby]=\"submenu.ariaLabelledby\"\n    >\n        <ng-container *ngTemplateOutlet=\"submenu.templateRef\"></ng-container>\n    </ul>\n</ng-container>\n", directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: MenuItemComponent, decorators: [{
             type: Component,
             args: [{ selector: 'li[fd-menu-item]', exportAs: 'fd-menu-item', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
@@ -514,6 +526,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImpor
                 type: Input
             }], submenu: [{
                 type: Input
+            }], parentSubmenu: [{
+                type: Input
             }], 
         // eslint-disable-next-line @angular-eslint/no-output-on-prefix
         onSelect: [{
@@ -526,9 +540,33 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImpor
                 args: [MenuInteractiveDirective]
             }] } });
 class SubmenuComponent {
+    constructor() {
+        /** @hidden */
+        this._registeredItems = [];
+        /** @hidden */
+        this._menuItemsChange$ = new Subject();
+    }
+    /** @hidden */
+    get menuItems() {
+        return this._projectedItems.length ? this._projectedItems.toArray() : this._registeredItems;
+    }
+    /** @hidden */
+    ngAfterContentInit() {
+        this._projectedItems.changes.subscribe(() => this._menuItemsChange$.next());
+    }
+    /** @hidden method for manually registering item when it's not visible for @ContentChildren */
+    _registerItem(item) {
+        this._registeredItems.push(item);
+        this._menuItemsChange$.next();
+    }
+    /** @hidden method for manually unregistering item when it's not visible for @ContentChildren */
+    _unregisterItem(item) {
+        this._registeredItems = this._registeredItems.filter((i) => i !== item);
+        this._menuItemsChange$.next();
+    }
 }
 SubmenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: SubmenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-SubmenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: SubmenuComponent, selector: "fd-submenu", inputs: { ariaLabel: "ariaLabel", ariaLabelledby: "ariaLabelledby" }, providers: [{ provide: SUBMENU, useExisting: SubmenuComponent }], queries: [{ propertyName: "menuItems", predicate: MenuItemComponent }], viewQueries: [{ propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true }], exportAs: ["fdSubmenu"], ngImport: i0, template: `
+SubmenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: SubmenuComponent, selector: "fd-submenu", inputs: { ariaLabel: "ariaLabel", ariaLabelledby: "ariaLabelledby" }, providers: [{ provide: SUBMENU, useExisting: SubmenuComponent }], queries: [{ propertyName: "_projectedItems", predicate: MenuItemComponent }], viewQueries: [{ propertyName: "templateRef", first: true, predicate: TemplateRef, descendants: true }], exportAs: ["fdSubmenu"], ngImport: i0, template: `
         <ng-template>
             <ng-content></ng-content>
         </ng-template>
@@ -554,7 +592,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImpor
             }], templateRef: [{
                 type: ViewChild,
                 args: [TemplateRef]
-            }], menuItems: [{
+            }], _projectedItems: [{
                 type: ContentChildren,
                 args: [MenuItemComponent]
             }] } });
@@ -919,27 +957,34 @@ class MenuComponent extends BasePopoverClass {
         this.id = `fd-menu-${menuUniqueId++}`;
         /** Emits array of active menu items */
         this.activePath = new EventEmitter();
-        /** Whether use menu in mobile mode */
-        this.mobile = false;
-        /** @hidden Whether Popover with the menu is opened */
-        this.isOpen = false;
+        /** @hidden Whether use a menu in mobile mode */
+        this._mobile = false;
         /** @hidden */
         this._subscriptions = new Subscription();
     }
     /** Set menu in mobile mode */
-    // eslint-disable-next-line @angular-eslint/no-input-rename
-    set setMobileMode(value) {
-        this.mobile = value;
+    set mobile(value) {
+        this._mobile = coerceBooleanProperty(value);
         this._menuService.setMenuMode(this.mobile);
     }
+    get mobile() {
+        return this._mobile;
+    }
+    /** @hidden */
+    get _popoverConfig() {
+        return {
+            ...this,
+            additionalBodyClass: (this.additionalBodyClass ?? '') + ' fd-popover--menu'
+        };
+    }
     /** @hidden */
     ngOnInit() {
         /** keep isOpen up to date */
         this.isOpenChange.subscribe((isOpen) => {
             this.isOpen = isOpen;
+            // when popover got closed by its own mechanism (e.x. click outside)
+            // we need to clean up a menu as well
             if (!isOpen) {
-                // when popover got closed by its own mechanism (e.x. click outside)
-                // we need to clean up menu as well
                 this._cleanUpMenuAfterClose();
             }
             this._changeDetectorRef.markForCheck();
@@ -947,15 +992,15 @@ class MenuComponent extends BasePopoverClass {
     }
     /** @hidden */
     ngAfterContentInit() {
-        this._menuService.setMenuRoot(this);
+        this._menuService.setMenuComponent(this);
         this._listenOnMenuItemsChange();
     }
     /** @hidden */
     ngAfterViewInit() {
         this._menuService.isMobileMode.subscribe((isMobile) => {
             this._setupView();
+            // Since it is mobile, it's needed to disable popoverService
             if (isMobile) {
-                // Since it is mobile it's needed to disable popoverService
                 this._popoverService.deactivate();
             }
         });
@@ -984,7 +1029,7 @@ class MenuComponent extends BasePopoverClass {
             this.isOpen = true;
             this.isOpenChange.emit(this.isOpen);
         }
-        if (!this.mobile) {
+        else {
             this._popoverService.open();
         }
         this._changeDetectorRef.markForCheck();
@@ -995,7 +1040,7 @@ class MenuComponent extends BasePopoverClass {
             this.isOpen = false;
             this.isOpenChange.emit(this.isOpen);
         }
-        if (!this.mobile) {
+        else {
             this._popoverService.close();
         }
         this._cleanUpMenuAfterClose();
@@ -1026,13 +1071,9 @@ class MenuComponent extends BasePopoverClass {
     }
     /** @hidden */
     _setupPopoverService() {
-        this._subscriptions.add(this._popoverService._onLoad.subscribe((elementRef) => this._manageKeyboardSupport(elementRef)));
-        this._popoverService.templateContent = this.menuRootTemplate;
-        this._popoverService.initialise(this._externalTrigger, this);
-    }
-    /** @hidden */
-    _manageKeyboardSupport(elementRef) {
-        this._menuService.addKeyboardSupport(elementRef);
+        this._subscriptions.add(this._popoverService._onLoad.subscribe((elementRef) => this._menuService.addKeyboardSupport(elementRef)));
+        this._popoverService.templateContent = this._menuRootTemplate;
+        this._popoverService.initialise(this._externalTrigger, this._popoverConfig);
     }
     /** @hidden Open Menu in mobile mode */
     async _setupMobileMode() {
@@ -1040,15 +1081,15 @@ class MenuComponent extends BasePopoverClass {
             providers: [{ provide: MENU_COMPONENT, useValue: this }],
             parent: this._injector
         });
-        this._mobileModeComponentRef = await this._dynamicComponentService.createDynamicModule(this.menuRootTemplate, MenuMobileModule, MenuMobileComponent, this._viewContainerRef, injector);
+        this._mobileModeComponentRef = await this._dynamicComponentService.createDynamicModule(this._menuRootTemplate, MenuMobileModule, MenuMobileComponent, this._viewContainerRef, injector);
         this._listenOnTriggerRefClicks();
     }
     /** @hidden Listen on menu items change and rebuild menu */
     _listenOnMenuItemsChange() {
-        this._subscriptions.add(this.menuItems.changes.subscribe(() => this._menuService.rebuildMenu()));
-        this.menuItems.forEach((m) => {
-            if (m.submenu && m.submenu.menuItems) {
-                this._subscriptions.add(m.submenu.menuItems.changes.subscribe(() => this._menuService.rebuildMenu()));
+        this._subscriptions.add(this._menuItems.changes.subscribe(() => this._menuService.rebuildMenu()));
+        this._menuItems.forEach((menuItem) => {
+            if (menuItem.submenu?.menuItems) {
+                this._subscriptions.add(menuItem.submenu._menuItemsChange$.subscribe(() => this._menuService.rebuildMenu()));
             }
         });
     }
@@ -1086,17 +1127,16 @@ class MenuComponent extends BasePopoverClass {
     }
 }
 MenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: MenuComponent, deps: [{ token: i0.ElementRef }, { token: i1$1.DialogConfig, optional: true }, { token: i0.Renderer2 }, { token: MenuService }, { token: i0.ChangeDetectorRef }, { token: i3$1.PopoverService }, { token: i0.Injector }, { token: i0.ViewContainerRef }, { token: i3.DynamicComponentService, optional: true }, { token: i5$1.ContentDensityObserver }], target: i0.ɵɵFactoryTarget.Component });
-MenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: MenuComponent, selector: "fd-menu", inputs: { setMobileMode: ["mobile", "setMobileMode"], disabled: "disabled", focusTrapped: "focusTrapped", openOnHoverTime: "openOnHoverTime", mobileConfig: "mobileConfig", ariaLabel: "ariaLabel", ariaLabelledby: "ariaLabelledby", id: "id" }, outputs: { activePath: "activePath" }, providers: [MenuService, PopoverService, contentDensityObserverProviders()], queries: [{ propertyName: "menuItems", predicate: MenuItemComponent, descendants: true }], viewQueries: [{ propertyName: "menuRootTemplate", first: true, predicate: ["menuRootTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container #viewContainer></ng-container>\n\n<ng-template #menuRootTemplate>\n    <nav\n        class=\"fd-menu\"\n        fdInitialFocus\n        [enabled]=\"focusTrapped\"\n        [id]=\"id\"\n        [attr.aria-labelledby]=\"ariaLabelledby\"\n        [attr.aria-label]=\"ariaLabel\"\n        role=\"menu\"\n        [class.fd-menu--compact]=\"_contentDensityObserver.isCompact$ | async\"\n        [class.fd-menu--mobile]=\"mobile\"\n    >\n        <ul role=\"none\" class=\"fd-menu__list fd-menu__list--no-shadow\">\n            <ng-content></ng-content>\n        </ul>\n    </nav>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.24.4\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-dialog__body{--fdButton_Menu_Border_Radius:0}.fd-menu{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;max-width:20rem;padding:0;width:-moz-fit-content;width:fit-content}.fd-menu:after,.fd-menu:before{box-sizing:inherit;font-size:inherit}.fd-menu__list,.fd-menu__sublist{-webkit-box-sizing:border-box;-ms-flex-wrap:wrap;-webkit-box-shadow:var(--sapContent_Shadow1);border:0;border-radius:var(--fdButton_Menu_Border_Radius);box-shadow:var(--sapContent_Shadow1);box-sizing:border-box;color:var(--sapTextColor);display:flex;flex-direction:column;flex-wrap:wrap;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);list-style:none;margin:0;padding:0}.fd-menu__list:after,.fd-menu__list:before,.fd-menu__sublist:after,.fd-menu__sublist:before{box-sizing:inherit;font-size:inherit}.fd-menu__list--no-shadow,.fd-menu__sublist--no-shadow{box-shadow:none}.fd-menu__sublist{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;left:100%;line-height:var(--sapContent_LineHeight);margin:.25rem 0 0 -.25rem;min-width:100%;padding:0;position:absolute;top:0;z-index:2}.fd-menu__sublist:after,.fd-menu__sublist:before{box-sizing:inherit;font-size:inherit}.fd-menu__sublist[dir=rtl],[dir=rtl] .fd-menu__sublist{left:auto;margin:.25rem -.25rem 0 0;right:100%}.fd-menu__sublist[aria-hidden=true]{display:none}.fd-menu__list>.fd-menu__item{position:relative;width:100%}.fd-menu__list--overflow{flex-wrap:nowrap;overflow-y:scroll}.fd-menu__separator{-webkit-box-sizing:border-box;background-color:var(--sapGroup_ContentBorderColor);border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:.0625rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0;width:100%}.fd-menu__separator:after,.fd-menu__separator:before{box-sizing:inherit;font-size:inherit}.fd-menu__item{-webkit-box-sizing:border-box;background-color:var(--sapList_Background);border:0;border-radius:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;padding:0;position:relative}.fd-menu__item:after,.fd-menu__item:before{box-sizing:inherit;font-size:inherit}.fd-menu__item:first-child,.fd-menu__item:first-child .fd-menu__link:after{border-top-left-radius:var(--fdButton_Menu_Border_Radius);border-top-right-radius:var(--fdButton_Menu_Border_Radius)}.fd-menu__item:last-child,.fd-menu__item:last-child .fd-menu__link:after{border-bottom-left-radius:var(--fdButton_Menu_Border_Radius);border-bottom-right-radius:var(--fdButton_Menu_Border_Radius)}.fd-menu__link{-webkit-box-sizing:border-box;align-items:center;border:0;border-radius:inherit;box-sizing:border-box;color:var(--sapTextColor);cursor:pointer;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:2.75rem;line-height:var(--sapContent_LineHeight);margin:0;outline:none;padding:.75rem 1rem .75rem .75rem;text-decoration:none;width:100%}.fd-menu__link:after,.fd-menu__link:before{box-sizing:inherit;font-size:inherit}.fd-menu__link.is-focus:after,.fd-menu__link:focus:after{border-color:var(--sapContent_FocusColor);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);bottom:.0625rem;content:\"\";left:.0625rem;pointer-events:none;position:absolute;right:.0625rem;top:.0625rem}.fd-menu__link.is-hover,.fd-menu__link:hover{background-color:var(--sapList_Hover_Background)}.fd-menu__link.is-selected,.fd-menu__link[aria-selected=true]{background-color:var(--sapList_SelectionBackgroundColor);border-bottom:.0625rem solid var(--sapList_SelectionBorderColor)}.fd-menu__link.is-selected .fd-menu__addon-after,.fd-menu__link.is-selected .fd-menu__addon-before,.fd-menu__link.is-selected .fd-menu__shortcut,.fd-menu__link[aria-selected=true] .fd-menu__addon-after,.fd-menu__link[aria-selected=true] .fd-menu__addon-before,.fd-menu__link[aria-selected=true] .fd-menu__shortcut{color:var(--sapContent_NonInteractiveIconColor)}.fd-menu__link.is-selected.is-hover:not(:active):not(.is-active),.fd-menu__link.is-selected:hover:not(:active):not(.is-active),.fd-menu__link[aria-selected=true].is-hover:not(:active):not(.is-active),.fd-menu__link[aria-selected=true]:hover:not(:active):not(.is-active){background-color:var(--sapList_Hover_SelectionBackground)}.fd-menu__link.is-selected.is-focus,.fd-menu__link.is-selected:focus,.fd-menu__link[aria-selected=true].is-focus,.fd-menu__link[aria-selected=true]:focus{z-index:5}.fd-menu__link.is-selected.is-focus:after,.fd-menu__link.is-selected:focus:after,.fd-menu__link[aria-selected=true].is-focus:after,.fd-menu__link[aria-selected=true]:focus:after{bottom:.125rem}.fd-menu__link.is-active,.fd-menu__link:active{background-color:var(--sapList_Active_Background);color:var(--sapList_Active_TextColor)}.fd-menu__link.is-active:after,.fd-menu__link:active:after{display:none}.fd-menu__link.is-active .fd-menu__addon-after,.fd-menu__link.is-active .fd-menu__addon-before,.fd-menu__link.is-active .fd-menu__shortcut,.fd-menu__link.is-active .fd-menu__title,.fd-menu__link:active .fd-menu__addon-after,.fd-menu__link:active .fd-menu__addon-before,.fd-menu__link:active .fd-menu__shortcut,.fd-menu__link:active .fd-menu__title{color:var(--sapList_Active_TextColor)}.fd-menu__link.is-active.is-focus,.fd-menu__link.is-active:focus,.fd-menu__link:active.is-focus,.fd-menu__link:active:focus{outline-color:var(--fdMenu_Active_State_Focus);z-index:5}.fd-menu__link.is-disabled,.fd-menu__link:disabled,.fd-menu__link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-menu__link.is-disabled.is-focus,.fd-menu__link.is-disabled:focus,.fd-menu__link:disabled.is-focus,.fd-menu__link:disabled:focus,.fd-menu__link[aria-disabled=true].is-focus,.fd-menu__link[aria-disabled=true]:focus{z-index:5}.fd-menu__link.is-disabled.is-focus:after,.fd-menu__link.is-disabled:focus:after,.fd-menu__link:disabled.is-focus:after,.fd-menu__link:disabled:focus:after,.fd-menu__link[aria-disabled=true].is-focus:after,.fd-menu__link[aria-disabled=true]:focus:after{display:none}.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active),.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active){background-color:var(--sapList_SelectionBackgroundColor);border-bottom:.0625rem solid var(--sapList_SelectionBorderColor)}.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active) .fd-menu__addon-after,.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active) .fd-menu__addon-before,.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active) .fd-menu__shortcut,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active) .fd-menu__addon-after,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active) .fd-menu__addon-before,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active) .fd-menu__shortcut{color:var(--sapContent_NonInteractiveIconColor)}.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active).is-hover:not(:active):not(.is-active),.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active):hover:not(:active):not(.is-active),.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active).is-hover:not(:active):not(.is-active),.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active):hover:not(:active):not(.is-active){background-color:var(--sapList_Hover_SelectionBackground)}.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active).is-focus,.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active):focus,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active).is-focus,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active):focus{z-index:5}.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active).is-focus:after,.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active):focus:after,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active).is-focus:after,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active):focus:after{bottom:.125rem}.fd-menu__title{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapList_TextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;text-shadow:var(--fdMenu_Text_Shadow);white-space:nowrap;width:100%}.fd-menu__title:after,.fd-menu__title:before{box-sizing:inherit;font-size:inherit}.fd-menu__addon-after,.fd-menu__addon-before{-webkit-box-sizing:border-box;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;background-color:transparent;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapContent_NonInteractiveIconColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontLargeSize);font-weight:400;height:1.25rem;justify-content:center;line-height:var(--sapContent_LineHeight);margin:0;min-width:2.25rem;padding:0;text-shadow:var(--fdMenu_Text_Shadow);width:2.25rem}.fd-menu__addon-after:after,.fd-menu__addon-after:before,.fd-menu__addon-before:after,.fd-menu__addon-before:before{box-sizing:inherit;font-size:inherit}.fd-menu__addon-after [class*=sap-icon],.fd-menu__addon-after[class*=sap-icon],.fd-menu__addon-before [class*=sap-icon],.fd-menu__addon-before[class*=sap-icon]{background:inherit;border-radius:inherit;color:inherit;font-size:inherit;line-height:1}.fd-menu__addon-before{margin:0 0 0 -.75rem}.fd-menu__addon-after,.fd-menu__addon-before[dir=rtl],[dir=rtl] .fd-menu__addon-before{margin:0 -1rem 0 0}.fd-menu__addon-after[dir=rtl],[dir=rtl] .fd-menu__addon-after{margin:0 0 0 -.75rem}.fd-menu__addon-after--submenu{font-size:var(--sapFontSmallSize)}.fd-menu__addon-after--submenu:before{content:\"\\e066\"}.fd-menu__addon-after--submenu:before,.fd-menu__addon-after--submenu[dir=rtl]:before,[dir=rtl] .fd-menu__addon-after--submenu:before{text-rendering:optimizeLegibility;font-family:SAP-icons;text-align:center;text-decoration:inherit;text-transform:none}.fd-menu__addon-after--submenu[dir=rtl]:before,[dir=rtl] .fd-menu__addon-after--submenu:before{content:\"\\e067\"}.fd-menu__shortcut{-webkit-box-sizing:border-box;-ms-flex-negative:0;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapContent_NonInteractiveIconColor);display:flex;flex-shrink:0;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0 0 0 1rem;text-overflow:ellipsis;white-space:nowrap}.fd-menu__shortcut:after,.fd-menu__shortcut:before{box-sizing:inherit;font-size:inherit}.fd-menu__shortcut[dir=rtl],[dir=rtl] .fd-menu__shortcut{padding-left:0;padding-right:1rem}.fd-menu--overflow{-webkit-box-shadow:var(--sapContent_Shadow1);border-radius:var(--fdButton_Menu_Border_Radius);box-shadow:var(--sapContent_Shadow1);overflow-y:scroll}.fd-menu--overflow .fd-menu__list{box-shadow:none}.fd-menu--overflow .fd-menu__item:first-child{border-top-right-radius:0}.fd-menu--overflow .fd-menu__item:first-child[dir=rtl],[dir=rtl] .fd-menu--overflow .fd-menu__item:first-child{border-top-left-radius:0;border-top-right-radius:var(--fdButton_Menu_Border_Radius)}.fd-menu--overflow .fd-menu__item:last-child{border-bottom-right-radius:0}.fd-menu--overflow .fd-menu__item:last-child[dir=rtl],[dir=rtl] .fd-menu--overflow .fd-menu__item:last-child{border-bottom-left-radius:0;border-bottom-right-radius:var(--fdButton_Menu_Border_Radius)}.fd-menu--full-width{max-width:100%}.fd-menu--compact .fd-menu__link{height:2rem;padding:.375rem .75rem}.fd-menu--compact .fd-menu__link .fd-menu__addon-after,.fd-menu--compact .fd-menu__link .fd-menu__addon-before{min-width:2rem;width:2rem}.fd-menu--compact .fd-menu__link .fd-menu__addon-before{margin:0 0 0 -.5rem}.fd-menu--compact .fd-menu__link .fd-menu__addon-after,.fd-menu--compact .fd-menu__link[dir=rtl] .fd-menu__addon-before,[dir=rtl] .fd-menu--compact .fd-menu__link .fd-menu__addon-before{margin:0 -.75rem 0 0}.fd-menu--compact .fd-menu__link[dir=rtl] .fd-menu__addon-after,[dir=rtl] .fd-menu--compact .fd-menu__link .fd-menu__addon-after{margin:0 0 0 -.5rem}.fd-menu--mobile{max-width:100%;width:100%}.fd-menu--mobile .fd-menu__list,.fd-menu--mobile .fd-menu__sublist{-webkit-box-shadow:none;border-radius:0;box-shadow:none;margin:0;position:static}.fd-menu--mobile .fd-menu__list .fd-menu__item,.fd-menu--mobile .fd-menu__sublist .fd-menu__item{border-radius:0}.fd-menu--mobile .fd-menu__list .fd-menu__link,.fd-menu--mobile .fd-menu__sublist .fd-menu__link{padding:.75rem 1rem}.fd-menu--mobile .fd-menu__list .fd-menu__addon-after,.fd-menu--mobile .fd-menu__list .fd-menu__addon-before,.fd-menu--mobile .fd-menu__sublist .fd-menu__addon-after,.fd-menu--mobile .fd-menu__sublist .fd-menu__addon-before{min-width:2.75rem;width:2.75rem}.fd-menu--mobile .fd-menu__list .fd-menu__addon-before,.fd-menu--mobile .fd-menu__sublist .fd-menu__addon-before{margin:0 0 0 -1rem}.fd-menu--mobile .fd-menu__list .fd-menu__addon-after,.fd-menu--mobile .fd-menu__list[dir=rtl] .fd-menu__addon-before,.fd-menu--mobile .fd-menu__sublist .fd-menu__addon-after,.fd-menu--mobile .fd-menu__sublist[dir=rtl] .fd-menu__addon-before,[dir=rtl] .fd-menu--mobile .fd-menu__list .fd-menu__addon-before,[dir=rtl] .fd-menu--mobile .fd-menu__sublist .fd-menu__addon-before{margin:0 -1rem 0 0}.fd-menu--mobile .fd-menu__list[dir=rtl] .fd-menu__addon-after,.fd-menu--mobile .fd-menu__sublist[dir=rtl] .fd-menu__addon-after,[dir=rtl] .fd-menu--mobile .fd-menu__list .fd-menu__addon-after,[dir=rtl] .fd-menu--mobile .fd-menu__sublist .fd-menu__addon-after{margin:0 0 0 -1rem}:host{display:inline}fd-menu .fd-menu__list,fd-menu .fd-menu__sublist{flex-wrap:nowrap}\n"], directives: [{ type: i3.InitialFocusDirective, selector: "[fdInitialFocus], [fd-initial-focus]", inputs: ["fd-initial-focus", "enabled", "focusLastElement"] }], pipes: { "async": i2.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+MenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: MenuComponent, selector: "fd-menu", inputs: { mobile: "mobile", disabled: "disabled", focusTrapped: "focusTrapped", openOnHoverTime: "openOnHoverTime", mobileConfig: "mobileConfig", ariaLabel: "ariaLabel", ariaLabelledby: "ariaLabelledby", id: "id" }, outputs: { activePath: "activePath" }, providers: [MenuService, PopoverService, contentDensityObserverProviders()], queries: [{ propertyName: "_menuItems", predicate: MenuItemComponent }], viewQueries: [{ propertyName: "_menuRootTemplate", first: true, predicate: ["menuRootTemplate"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container #viewContainer></ng-container>\n\n<ng-template #menuRootTemplate>\n    <nav\n        class=\"fd-menu\"\n        fdInitialFocus\n        [enabled]=\"focusTrapped\"\n        [id]=\"id\"\n        [attr.aria-labelledby]=\"ariaLabelledby\"\n        [attr.aria-label]=\"ariaLabel\"\n        role=\"menu\"\n        [class.fd-menu--compact]=\"_contentDensityObserver.isCompact$ | async\"\n        [class.fd-menu--mobile]=\"mobile\"\n    >\n        <ul role=\"none\" class=\"fd-menu__list fd-menu__list--no-shadow\">\n            <ng-content></ng-content>\n        </ul>\n    </nav>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.24.4\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-dialog__body{--fdButton_Menu_Border_Radius:0}.fd-menu{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;max-width:20rem;padding:0;width:-moz-fit-content;width:fit-content}.fd-menu:after,.fd-menu:before{box-sizing:inherit;font-size:inherit}.fd-menu__list,.fd-menu__sublist{-webkit-box-sizing:border-box;-ms-flex-wrap:wrap;-webkit-box-shadow:var(--sapContent_Shadow1);border:0;border-radius:var(--fdButton_Menu_Border_Radius);box-shadow:var(--sapContent_Shadow1);box-sizing:border-box;color:var(--sapTextColor);display:flex;flex-direction:column;flex-wrap:wrap;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);list-style:none;margin:0;padding:0}.fd-menu__list:after,.fd-menu__list:before,.fd-menu__sublist:after,.fd-menu__sublist:before{box-sizing:inherit;font-size:inherit}.fd-menu__list--no-shadow,.fd-menu__sublist--no-shadow{box-shadow:none}.fd-menu__sublist{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;left:100%;line-height:var(--sapContent_LineHeight);margin:.25rem 0 0 -.25rem;min-width:100%;padding:0;position:absolute;top:0;z-index:2}.fd-menu__sublist:after,.fd-menu__sublist:before{box-sizing:inherit;font-size:inherit}.fd-menu__sublist[dir=rtl],[dir=rtl] .fd-menu__sublist{left:auto;margin:.25rem -.25rem 0 0;right:100%}.fd-menu__sublist[aria-hidden=true]{display:none}.fd-menu__list>.fd-menu__item{position:relative;width:100%}.fd-menu__list--overflow{flex-wrap:nowrap;overflow-y:scroll}.fd-menu__separator{-webkit-box-sizing:border-box;background-color:var(--sapGroup_ContentBorderColor);border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:.0625rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0;width:100%}.fd-menu__separator:after,.fd-menu__separator:before{box-sizing:inherit;font-size:inherit}.fd-menu__item{-webkit-box-sizing:border-box;background-color:var(--sapList_Background);border:0;border-radius:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;padding:0;position:relative}.fd-menu__item:after,.fd-menu__item:before{box-sizing:inherit;font-size:inherit}.fd-menu__item:first-child,.fd-menu__item:first-child .fd-menu__link:after{border-top-left-radius:var(--fdButton_Menu_Border_Radius);border-top-right-radius:var(--fdButton_Menu_Border_Radius)}.fd-menu__item:last-child,.fd-menu__item:last-child .fd-menu__link:after{border-bottom-left-radius:var(--fdButton_Menu_Border_Radius);border-bottom-right-radius:var(--fdButton_Menu_Border_Radius)}.fd-menu__link{-webkit-box-sizing:border-box;align-items:center;border:0;border-radius:inherit;box-sizing:border-box;color:var(--sapTextColor);cursor:pointer;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:2.75rem;line-height:var(--sapContent_LineHeight);margin:0;outline:none;padding:.75rem 1rem .75rem .75rem;text-decoration:none;width:100%}.fd-menu__link:after,.fd-menu__link:before{box-sizing:inherit;font-size:inherit}.fd-menu__link.is-focus:after,.fd-menu__link:focus:after{border-color:var(--sapContent_FocusColor);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);bottom:.0625rem;content:\"\";left:.0625rem;pointer-events:none;position:absolute;right:.0625rem;top:.0625rem}.fd-menu__link.is-hover,.fd-menu__link:hover{background-color:var(--sapList_Hover_Background)}.fd-menu__link.is-selected,.fd-menu__link[aria-selected=true]{background-color:var(--sapList_SelectionBackgroundColor);border-bottom:.0625rem solid var(--sapList_SelectionBorderColor)}.fd-menu__link.is-selected .fd-menu__addon-after,.fd-menu__link.is-selected .fd-menu__addon-before,.fd-menu__link.is-selected .fd-menu__shortcut,.fd-menu__link[aria-selected=true] .fd-menu__addon-after,.fd-menu__link[aria-selected=true] .fd-menu__addon-before,.fd-menu__link[aria-selected=true] .fd-menu__shortcut{color:var(--sapContent_NonInteractiveIconColor)}.fd-menu__link.is-selected.is-hover:not(:active):not(.is-active),.fd-menu__link.is-selected:hover:not(:active):not(.is-active),.fd-menu__link[aria-selected=true].is-hover:not(:active):not(.is-active),.fd-menu__link[aria-selected=true]:hover:not(:active):not(.is-active){background-color:var(--sapList_Hover_SelectionBackground)}.fd-menu__link.is-selected.is-focus,.fd-menu__link.is-selected:focus,.fd-menu__link[aria-selected=true].is-focus,.fd-menu__link[aria-selected=true]:focus{z-index:5}.fd-menu__link.is-selected.is-focus:after,.fd-menu__link.is-selected:focus:after,.fd-menu__link[aria-selected=true].is-focus:after,.fd-menu__link[aria-selected=true]:focus:after{bottom:.125rem}.fd-menu__link.is-active,.fd-menu__link:active{background-color:var(--sapList_Active_Background);color:var(--sapList_Active_TextColor)}.fd-menu__link.is-active:after,.fd-menu__link:active:after{display:none}.fd-menu__link.is-active .fd-menu__addon-after,.fd-menu__link.is-active .fd-menu__addon-before,.fd-menu__link.is-active .fd-menu__shortcut,.fd-menu__link.is-active .fd-menu__title,.fd-menu__link:active .fd-menu__addon-after,.fd-menu__link:active .fd-menu__addon-before,.fd-menu__link:active .fd-menu__shortcut,.fd-menu__link:active .fd-menu__title{color:var(--sapList_Active_TextColor)}.fd-menu__link.is-active.is-focus,.fd-menu__link.is-active:focus,.fd-menu__link:active.is-focus,.fd-menu__link:active:focus{outline-color:var(--fdMenu_Active_State_Focus);z-index:5}.fd-menu__link.is-disabled,.fd-menu__link:disabled,.fd-menu__link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-menu__link.is-disabled.is-focus,.fd-menu__link.is-disabled:focus,.fd-menu__link:disabled.is-focus,.fd-menu__link:disabled:focus,.fd-menu__link[aria-disabled=true].is-focus,.fd-menu__link[aria-disabled=true]:focus{z-index:5}.fd-menu__link.is-disabled.is-focus:after,.fd-menu__link.is-disabled:focus:after,.fd-menu__link:disabled.is-focus:after,.fd-menu__link:disabled:focus:after,.fd-menu__link[aria-disabled=true].is-focus:after,.fd-menu__link[aria-disabled=true]:focus:after{display:none}.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active),.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active){background-color:var(--sapList_SelectionBackgroundColor);border-bottom:.0625rem solid var(--sapList_SelectionBorderColor)}.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active) .fd-menu__addon-after,.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active) .fd-menu__addon-before,.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active) .fd-menu__shortcut,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active) .fd-menu__addon-after,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active) .fd-menu__addon-before,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active) .fd-menu__shortcut{color:var(--sapContent_NonInteractiveIconColor)}.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active).is-hover:not(:active):not(.is-active),.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active):hover:not(:active):not(.is-active),.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active).is-hover:not(:active):not(.is-active),.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active):hover:not(:active):not(.is-active){background-color:var(--sapList_Hover_SelectionBackground)}.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active).is-focus,.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active):focus,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active).is-focus,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active):focus{z-index:5}.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active).is-focus:after,.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active):focus:after,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active).is-focus:after,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active):focus:after{bottom:.125rem}.fd-menu__title{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapList_TextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;text-shadow:var(--fdMenu_Text_Shadow);white-space:nowrap;width:100%}.fd-menu__title:after,.fd-menu__title:before{box-sizing:inherit;font-size:inherit}.fd-menu__addon-after,.fd-menu__addon-before{-webkit-box-sizing:border-box;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;background-color:transparent;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapContent_NonInteractiveIconColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontLargeSize);font-weight:400;height:1.25rem;justify-content:center;line-height:var(--sapContent_LineHeight);margin:0;min-width:2.25rem;padding:0;text-shadow:var(--fdMenu_Text_Shadow);width:2.25rem}.fd-menu__addon-after:after,.fd-menu__addon-after:before,.fd-menu__addon-before:after,.fd-menu__addon-before:before{box-sizing:inherit;font-size:inherit}.fd-menu__addon-after [class*=sap-icon],.fd-menu__addon-after[class*=sap-icon],.fd-menu__addon-before [class*=sap-icon],.fd-menu__addon-before[class*=sap-icon]{background:inherit;border-radius:inherit;color:inherit;font-size:inherit;line-height:1}.fd-menu__addon-before{margin:0 0 0 -.75rem}.fd-menu__addon-after,.fd-menu__addon-before[dir=rtl],[dir=rtl] .fd-menu__addon-before{margin:0 -1rem 0 0}.fd-menu__addon-after[dir=rtl],[dir=rtl] .fd-menu__addon-after{margin:0 0 0 -.75rem}.fd-menu__addon-after--submenu{font-size:var(--sapFontSmallSize)}.fd-menu__addon-after--submenu:before{content:\"\\e066\"}.fd-menu__addon-after--submenu:before,.fd-menu__addon-after--submenu[dir=rtl]:before,[dir=rtl] .fd-menu__addon-after--submenu:before{text-rendering:optimizeLegibility;font-family:SAP-icons;text-align:center;text-decoration:inherit;text-transform:none}.fd-menu__addon-after--submenu[dir=rtl]:before,[dir=rtl] .fd-menu__addon-after--submenu:before{content:\"\\e067\"}.fd-menu__shortcut{-webkit-box-sizing:border-box;-ms-flex-negative:0;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapContent_NonInteractiveIconColor);display:flex;flex-shrink:0;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0 0 0 1rem;text-overflow:ellipsis;white-space:nowrap}.fd-menu__shortcut:after,.fd-menu__shortcut:before{box-sizing:inherit;font-size:inherit}.fd-menu__shortcut[dir=rtl],[dir=rtl] .fd-menu__shortcut{padding-left:0;padding-right:1rem}.fd-menu--overflow{-webkit-box-shadow:var(--sapContent_Shadow1);border-radius:var(--fdButton_Menu_Border_Radius);box-shadow:var(--sapContent_Shadow1);overflow-y:scroll}.fd-menu--overflow .fd-menu__list{box-shadow:none}.fd-menu--overflow .fd-menu__item:first-child{border-top-right-radius:0}.fd-menu--overflow .fd-menu__item:first-child[dir=rtl],[dir=rtl] .fd-menu--overflow .fd-menu__item:first-child{border-top-left-radius:0;border-top-right-radius:var(--fdButton_Menu_Border_Radius)}.fd-menu--overflow .fd-menu__item:last-child{border-bottom-right-radius:0}.fd-menu--overflow .fd-menu__item:last-child[dir=rtl],[dir=rtl] .fd-menu--overflow .fd-menu__item:last-child{border-bottom-left-radius:0;border-bottom-right-radius:var(--fdButton_Menu_Border_Radius)}.fd-menu--full-width{max-width:100%}.fd-menu--compact .fd-menu__link{height:2rem;padding:.375rem .75rem}.fd-menu--compact .fd-menu__link .fd-menu__addon-after,.fd-menu--compact .fd-menu__link .fd-menu__addon-before{min-width:2rem;width:2rem}.fd-menu--compact .fd-menu__link .fd-menu__addon-before{margin:0 0 0 -.5rem}.fd-menu--compact .fd-menu__link .fd-menu__addon-after,.fd-menu--compact .fd-menu__link[dir=rtl] .fd-menu__addon-before,[dir=rtl] .fd-menu--compact .fd-menu__link .fd-menu__addon-before{margin:0 -.75rem 0 0}.fd-menu--compact .fd-menu__link[dir=rtl] .fd-menu__addon-after,[dir=rtl] .fd-menu--compact .fd-menu__link .fd-menu__addon-after{margin:0 0 0 -.5rem}.fd-menu--mobile{max-width:100%;width:100%}.fd-menu--mobile .fd-menu__list,.fd-menu--mobile .fd-menu__sublist{-webkit-box-shadow:none;border-radius:0;box-shadow:none;margin:0;position:static}.fd-menu--mobile .fd-menu__list .fd-menu__item,.fd-menu--mobile .fd-menu__sublist .fd-menu__item{border-radius:0}.fd-menu--mobile .fd-menu__list .fd-menu__link,.fd-menu--mobile .fd-menu__sublist .fd-menu__link{padding:.75rem 1rem}.fd-menu--mobile .fd-menu__list .fd-menu__addon-after,.fd-menu--mobile .fd-menu__list .fd-menu__addon-before,.fd-menu--mobile .fd-menu__sublist .fd-menu__addon-after,.fd-menu--mobile .fd-menu__sublist .fd-menu__addon-before{min-width:2.75rem;width:2.75rem}.fd-menu--mobile .fd-menu__list .fd-menu__addon-before,.fd-menu--mobile .fd-menu__sublist .fd-menu__addon-before{margin:0 0 0 -1rem}.fd-menu--mobile .fd-menu__list .fd-menu__addon-after,.fd-menu--mobile .fd-menu__list[dir=rtl] .fd-menu__addon-before,.fd-menu--mobile .fd-menu__sublist .fd-menu__addon-after,.fd-menu--mobile .fd-menu__sublist[dir=rtl] .fd-menu__addon-before,[dir=rtl] .fd-menu--mobile .fd-menu__list .fd-menu__addon-before,[dir=rtl] .fd-menu--mobile .fd-menu__sublist .fd-menu__addon-before{margin:0 -1rem 0 0}.fd-menu--mobile .fd-menu__list[dir=rtl] .fd-menu__addon-after,.fd-menu--mobile .fd-menu__sublist[dir=rtl] .fd-menu__addon-after,[dir=rtl] .fd-menu--mobile .fd-menu__list .fd-menu__addon-after,[dir=rtl] .fd-menu--mobile .fd-menu__sublist .fd-menu__addon-after{margin:0 0 0 -1rem}:host{display:inline}fd-menu .fd-menu__list,fd-menu .fd-menu__sublist{flex-wrap:nowrap}.fd-popover--menu.fd-popover__popper{overflow:visible!important}\n"], directives: [{ type: i3.InitialFocusDirective, selector: "[fdInitialFocus], [fd-initial-focus]", inputs: ["fd-initial-focus", "enabled", "focusLastElement"] }], pipes: { "async": i2.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: MenuComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'fd-menu', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [MenuService, PopoverService, contentDensityObserverProviders()], template: "<ng-container #viewContainer></ng-container>\n\n<ng-template #menuRootTemplate>\n    <nav\n        class=\"fd-menu\"\n        fdInitialFocus\n        [enabled]=\"focusTrapped\"\n        [id]=\"id\"\n        [attr.aria-labelledby]=\"ariaLabelledby\"\n        [attr.aria-label]=\"ariaLabel\"\n        role=\"menu\"\n        [class.fd-menu--compact]=\"_contentDensityObserver.isCompact$ | async\"\n        [class.fd-menu--mobile]=\"mobile\"\n    >\n        <ul role=\"none\" class=\"fd-menu__list fd-menu__list--no-shadow\">\n            <ng-content></ng-content>\n        </ul>\n    </nav>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.24.4\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-dialog__body{--fdButton_Menu_Border_Radius:0}.fd-menu{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;max-width:20rem;padding:0;width:-moz-fit-content;width:fit-content}.fd-menu:after,.fd-menu:before{box-sizing:inherit;font-size:inherit}.fd-menu__list,.fd-menu__sublist{-webkit-box-sizing:border-box;-ms-flex-wrap:wrap;-webkit-box-shadow:var(--sapContent_Shadow1);border:0;border-radius:var(--fdButton_Menu_Border_Radius);box-shadow:var(--sapContent_Shadow1);box-sizing:border-box;color:var(--sapTextColor);display:flex;flex-direction:column;flex-wrap:wrap;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);list-style:none;margin:0;padding:0}.fd-menu__list:after,.fd-menu__list:before,.fd-menu__sublist:after,.fd-menu__sublist:before{box-sizing:inherit;font-size:inherit}.fd-menu__list--no-shadow,.fd-menu__sublist--no-shadow{box-shadow:none}.fd-menu__sublist{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;left:100%;line-height:var(--sapContent_LineHeight);margin:.25rem 0 0 -.25rem;min-width:100%;padding:0;position:absolute;top:0;z-index:2}.fd-menu__sublist:after,.fd-menu__sublist:before{box-sizing:inherit;font-size:inherit}.fd-menu__sublist[dir=rtl],[dir=rtl] .fd-menu__sublist{left:auto;margin:.25rem -.25rem 0 0;right:100%}.fd-menu__sublist[aria-hidden=true]{display:none}.fd-menu__list>.fd-menu__item{position:relative;width:100%}.fd-menu__list--overflow{flex-wrap:nowrap;overflow-y:scroll}.fd-menu__separator{-webkit-box-sizing:border-box;background-color:var(--sapGroup_ContentBorderColor);border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:.0625rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0;width:100%}.fd-menu__separator:after,.fd-menu__separator:before{box-sizing:inherit;font-size:inherit}.fd-menu__item{-webkit-box-sizing:border-box;background-color:var(--sapList_Background);border:0;border-radius:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;padding:0;position:relative}.fd-menu__item:after,.fd-menu__item:before{box-sizing:inherit;font-size:inherit}.fd-menu__item:first-child,.fd-menu__item:first-child .fd-menu__link:after{border-top-left-radius:var(--fdButton_Menu_Border_Radius);border-top-right-radius:var(--fdButton_Menu_Border_Radius)}.fd-menu__item:last-child,.fd-menu__item:last-child .fd-menu__link:after{border-bottom-left-radius:var(--fdButton_Menu_Border_Radius);border-bottom-right-radius:var(--fdButton_Menu_Border_Radius)}.fd-menu__link{-webkit-box-sizing:border-box;align-items:center;border:0;border-radius:inherit;box-sizing:border-box;color:var(--sapTextColor);cursor:pointer;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:2.75rem;line-height:var(--sapContent_LineHeight);margin:0;outline:none;padding:.75rem 1rem .75rem .75rem;text-decoration:none;width:100%}.fd-menu__link:after,.fd-menu__link:before{box-sizing:inherit;font-size:inherit}.fd-menu__link.is-focus:after,.fd-menu__link:focus:after{border-color:var(--sapContent_FocusColor);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);bottom:.0625rem;content:\"\";left:.0625rem;pointer-events:none;position:absolute;right:.0625rem;top:.0625rem}.fd-menu__link.is-hover,.fd-menu__link:hover{background-color:var(--sapList_Hover_Background)}.fd-menu__link.is-selected,.fd-menu__link[aria-selected=true]{background-color:var(--sapList_SelectionBackgroundColor);border-bottom:.0625rem solid var(--sapList_SelectionBorderColor)}.fd-menu__link.is-selected .fd-menu__addon-after,.fd-menu__link.is-selected .fd-menu__addon-before,.fd-menu__link.is-selected .fd-menu__shortcut,.fd-menu__link[aria-selected=true] .fd-menu__addon-after,.fd-menu__link[aria-selected=true] .fd-menu__addon-before,.fd-menu__link[aria-selected=true] .fd-menu__shortcut{color:var(--sapContent_NonInteractiveIconColor)}.fd-menu__link.is-selected.is-hover:not(:active):not(.is-active),.fd-menu__link.is-selected:hover:not(:active):not(.is-active),.fd-menu__link[aria-selected=true].is-hover:not(:active):not(.is-active),.fd-menu__link[aria-selected=true]:hover:not(:active):not(.is-active){background-color:var(--sapList_Hover_SelectionBackground)}.fd-menu__link.is-selected.is-focus,.fd-menu__link.is-selected:focus,.fd-menu__link[aria-selected=true].is-focus,.fd-menu__link[aria-selected=true]:focus{z-index:5}.fd-menu__link.is-selected.is-focus:after,.fd-menu__link.is-selected:focus:after,.fd-menu__link[aria-selected=true].is-focus:after,.fd-menu__link[aria-selected=true]:focus:after{bottom:.125rem}.fd-menu__link.is-active,.fd-menu__link:active{background-color:var(--sapList_Active_Background);color:var(--sapList_Active_TextColor)}.fd-menu__link.is-active:after,.fd-menu__link:active:after{display:none}.fd-menu__link.is-active .fd-menu__addon-after,.fd-menu__link.is-active .fd-menu__addon-before,.fd-menu__link.is-active .fd-menu__shortcut,.fd-menu__link.is-active .fd-menu__title,.fd-menu__link:active .fd-menu__addon-after,.fd-menu__link:active .fd-menu__addon-before,.fd-menu__link:active .fd-menu__shortcut,.fd-menu__link:active .fd-menu__title{color:var(--sapList_Active_TextColor)}.fd-menu__link.is-active.is-focus,.fd-menu__link.is-active:focus,.fd-menu__link:active.is-focus,.fd-menu__link:active:focus{outline-color:var(--fdMenu_Active_State_Focus);z-index:5}.fd-menu__link.is-disabled,.fd-menu__link:disabled,.fd-menu__link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-menu__link.is-disabled.is-focus,.fd-menu__link.is-disabled:focus,.fd-menu__link:disabled.is-focus,.fd-menu__link:disabled:focus,.fd-menu__link[aria-disabled=true].is-focus,.fd-menu__link[aria-disabled=true]:focus{z-index:5}.fd-menu__link.is-disabled.is-focus:after,.fd-menu__link.is-disabled:focus:after,.fd-menu__link:disabled.is-focus:after,.fd-menu__link:disabled:focus:after,.fd-menu__link[aria-disabled=true].is-focus:after,.fd-menu__link[aria-disabled=true]:focus:after{display:none}.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active),.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active){background-color:var(--sapList_SelectionBackgroundColor);border-bottom:.0625rem solid var(--sapList_SelectionBorderColor)}.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active) .fd-menu__addon-after,.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active) .fd-menu__addon-before,.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active) .fd-menu__shortcut,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active) .fd-menu__addon-after,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active) .fd-menu__addon-before,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active) .fd-menu__shortcut{color:var(--sapContent_NonInteractiveIconColor)}.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active).is-hover:not(:active):not(.is-active),.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active):hover:not(:active):not(.is-active),.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active).is-hover:not(:active):not(.is-active),.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active):hover:not(:active):not(.is-active){background-color:var(--sapList_Hover_SelectionBackground)}.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active).is-focus,.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active):focus,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active).is-focus,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active):focus{z-index:5}.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active).is-focus:after,.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active):focus:after,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active).is-focus:after,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active):focus:after{bottom:.125rem}.fd-menu__title{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapList_TextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;text-shadow:var(--fdMenu_Text_Shadow);white-space:nowrap;width:100%}.fd-menu__title:after,.fd-menu__title:before{box-sizing:inherit;font-size:inherit}.fd-menu__addon-after,.fd-menu__addon-before{-webkit-box-sizing:border-box;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;background-color:transparent;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapContent_NonInteractiveIconColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontLargeSize);font-weight:400;height:1.25rem;justify-content:center;line-height:var(--sapContent_LineHeight);margin:0;min-width:2.25rem;padding:0;text-shadow:var(--fdMenu_Text_Shadow);width:2.25rem}.fd-menu__addon-after:after,.fd-menu__addon-after:before,.fd-menu__addon-before:after,.fd-menu__addon-before:before{box-sizing:inherit;font-size:inherit}.fd-menu__addon-after [class*=sap-icon],.fd-menu__addon-after[class*=sap-icon],.fd-menu__addon-before [class*=sap-icon],.fd-menu__addon-before[class*=sap-icon]{background:inherit;border-radius:inherit;color:inherit;font-size:inherit;line-height:1}.fd-menu__addon-before{margin:0 0 0 -.75rem}.fd-menu__addon-after,.fd-menu__addon-before[dir=rtl],[dir=rtl] .fd-menu__addon-before{margin:0 -1rem 0 0}.fd-menu__addon-after[dir=rtl],[dir=rtl] .fd-menu__addon-after{margin:0 0 0 -.75rem}.fd-menu__addon-after--submenu{font-size:var(--sapFontSmallSize)}.fd-menu__addon-after--submenu:before{content:\"\\e066\"}.fd-menu__addon-after--submenu:before,.fd-menu__addon-after--submenu[dir=rtl]:before,[dir=rtl] .fd-menu__addon-after--submenu:before{text-rendering:optimizeLegibility;font-family:SAP-icons;text-align:center;text-decoration:inherit;text-transform:none}.fd-menu__addon-after--submenu[dir=rtl]:before,[dir=rtl] .fd-menu__addon-after--submenu:before{content:\"\\e067\"}.fd-menu__shortcut{-webkit-box-sizing:border-box;-ms-flex-negative:0;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapContent_NonInteractiveIconColor);display:flex;flex-shrink:0;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0 0 0 1rem;text-overflow:ellipsis;white-space:nowrap}.fd-menu__shortcut:after,.fd-menu__shortcut:before{box-sizing:inherit;font-size:inherit}.fd-menu__shortcut[dir=rtl],[dir=rtl] .fd-menu__shortcut{padding-left:0;padding-right:1rem}.fd-menu--overflow{-webkit-box-shadow:var(--sapContent_Shadow1);border-radius:var(--fdButton_Menu_Border_Radius);box-shadow:var(--sapContent_Shadow1);overflow-y:scroll}.fd-menu--overflow .fd-menu__list{box-shadow:none}.fd-menu--overflow .fd-menu__item:first-child{border-top-right-radius:0}.fd-menu--overflow .fd-menu__item:first-child[dir=rtl],[dir=rtl] .fd-menu--overflow .fd-menu__item:first-child{border-top-left-radius:0;border-top-right-radius:var(--fdButton_Menu_Border_Radius)}.fd-menu--overflow .fd-menu__item:last-child{border-bottom-right-radius:0}.fd-menu--overflow .fd-menu__item:last-child[dir=rtl],[dir=rtl] .fd-menu--overflow .fd-menu__item:last-child{border-bottom-left-radius:0;border-bottom-right-radius:var(--fdButton_Menu_Border_Radius)}.fd-menu--full-width{max-width:100%}.fd-menu--compact .fd-menu__link{height:2rem;padding:.375rem .75rem}.fd-menu--compact .fd-menu__link .fd-menu__addon-after,.fd-menu--compact .fd-menu__link .fd-menu__addon-before{min-width:2rem;width:2rem}.fd-menu--compact .fd-menu__link .fd-menu__addon-before{margin:0 0 0 -.5rem}.fd-menu--compact .fd-menu__link .fd-menu__addon-after,.fd-menu--compact .fd-menu__link[dir=rtl] .fd-menu__addon-before,[dir=rtl] .fd-menu--compact .fd-menu__link .fd-menu__addon-before{margin:0 -.75rem 0 0}.fd-menu--compact .fd-menu__link[dir=rtl] .fd-menu__addon-after,[dir=rtl] .fd-menu--compact .fd-menu__link .fd-menu__addon-after{margin:0 0 0 -.5rem}.fd-menu--mobile{max-width:100%;width:100%}.fd-menu--mobile .fd-menu__list,.fd-menu--mobile .fd-menu__sublist{-webkit-box-shadow:none;border-radius:0;box-shadow:none;margin:0;position:static}.fd-menu--mobile .fd-menu__list .fd-menu__item,.fd-menu--mobile .fd-menu__sublist .fd-menu__item{border-radius:0}.fd-menu--mobile .fd-menu__list .fd-menu__link,.fd-menu--mobile .fd-menu__sublist .fd-menu__link{padding:.75rem 1rem}.fd-menu--mobile .fd-menu__list .fd-menu__addon-after,.fd-menu--mobile .fd-menu__list .fd-menu__addon-before,.fd-menu--mobile .fd-menu__sublist .fd-menu__addon-after,.fd-menu--mobile .fd-menu__sublist .fd-menu__addon-before{min-width:2.75rem;width:2.75rem}.fd-menu--mobile .fd-menu__list .fd-menu__addon-before,.fd-menu--mobile .fd-menu__sublist .fd-menu__addon-before{margin:0 0 0 -1rem}.fd-menu--mobile .fd-menu__list .fd-menu__addon-after,.fd-menu--mobile .fd-menu__list[dir=rtl] .fd-menu__addon-before,.fd-menu--mobile .fd-menu__sublist .fd-menu__addon-after,.fd-menu--mobile .fd-menu__sublist[dir=rtl] .fd-menu__addon-before,[dir=rtl] .fd-menu--mobile .fd-menu__list .fd-menu__addon-before,[dir=rtl] .fd-menu--mobile .fd-menu__sublist .fd-menu__addon-before{margin:0 -1rem 0 0}.fd-menu--mobile .fd-menu__list[dir=rtl] .fd-menu__addon-after,.fd-menu--mobile .fd-menu__sublist[dir=rtl] .fd-menu__addon-after,[dir=rtl] .fd-menu--mobile .fd-menu__list .fd-menu__addon-after,[dir=rtl] .fd-menu--mobile .fd-menu__sublist .fd-menu__addon-after{margin:0 0 0 -1rem}:host{display:inline}fd-menu .fd-menu__list,fd-menu .fd-menu__sublist{flex-wrap:nowrap}\n"] }]
+            args: [{ selector: 'fd-menu', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [MenuService, PopoverService, contentDensityObserverProviders()], template: "<ng-container #viewContainer></ng-container>\n\n<ng-template #menuRootTemplate>\n    <nav\n        class=\"fd-menu\"\n        fdInitialFocus\n        [enabled]=\"focusTrapped\"\n        [id]=\"id\"\n        [attr.aria-labelledby]=\"ariaLabelledby\"\n        [attr.aria-label]=\"ariaLabel\"\n        role=\"menu\"\n        [class.fd-menu--compact]=\"_contentDensityObserver.isCompact$ | async\"\n        [class.fd-menu--mobile]=\"mobile\"\n    >\n        <ul role=\"none\" class=\"fd-menu__list fd-menu__list--no-shadow\">\n            <ng-content></ng-content>\n        </ul>\n    </nav>\n</ng-template>\n", styles: ["/*!\n * Fundamental Library Styles v0.24.4\n * Copyright (c) 2022 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */.fd-dialog__body{--fdButton_Menu_Border_Radius:0}.fd-menu{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;max-width:20rem;padding:0;width:-moz-fit-content;width:fit-content}.fd-menu:after,.fd-menu:before{box-sizing:inherit;font-size:inherit}.fd-menu__list,.fd-menu__sublist{-webkit-box-sizing:border-box;-ms-flex-wrap:wrap;-webkit-box-shadow:var(--sapContent_Shadow1);border:0;border-radius:var(--fdButton_Menu_Border_Radius);box-shadow:var(--sapContent_Shadow1);box-sizing:border-box;color:var(--sapTextColor);display:flex;flex-direction:column;flex-wrap:wrap;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);list-style:none;margin:0;padding:0}.fd-menu__list:after,.fd-menu__list:before,.fd-menu__sublist:after,.fd-menu__sublist:before{box-sizing:inherit;font-size:inherit}.fd-menu__list--no-shadow,.fd-menu__sublist--no-shadow{box-shadow:none}.fd-menu__sublist{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;left:100%;line-height:var(--sapContent_LineHeight);margin:.25rem 0 0 -.25rem;min-width:100%;padding:0;position:absolute;top:0;z-index:2}.fd-menu__sublist:after,.fd-menu__sublist:before{box-sizing:inherit;font-size:inherit}.fd-menu__sublist[dir=rtl],[dir=rtl] .fd-menu__sublist{left:auto;margin:.25rem -.25rem 0 0;right:100%}.fd-menu__sublist[aria-hidden=true]{display:none}.fd-menu__list>.fd-menu__item{position:relative;width:100%}.fd-menu__list--overflow{flex-wrap:nowrap;overflow-y:scroll}.fd-menu__separator{-webkit-box-sizing:border-box;background-color:var(--sapGroup_ContentBorderColor);border:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:.0625rem;line-height:var(--sapContent_LineHeight);margin:0;padding:0;width:100%}.fd-menu__separator:after,.fd-menu__separator:before{box-sizing:inherit;font-size:inherit}.fd-menu__item{-webkit-box-sizing:border-box;background-color:var(--sapList_Background);border:0;border-radius:0;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;padding:0;position:relative}.fd-menu__item:after,.fd-menu__item:before{box-sizing:inherit;font-size:inherit}.fd-menu__item:first-child,.fd-menu__item:first-child .fd-menu__link:after{border-top-left-radius:var(--fdButton_Menu_Border_Radius);border-top-right-radius:var(--fdButton_Menu_Border_Radius)}.fd-menu__item:last-child,.fd-menu__item:last-child .fd-menu__link:after{border-bottom-left-radius:var(--fdButton_Menu_Border_Radius);border-bottom-right-radius:var(--fdButton_Menu_Border_Radius)}.fd-menu__link{-webkit-box-sizing:border-box;align-items:center;border:0;border-radius:inherit;box-sizing:border-box;color:var(--sapTextColor);cursor:pointer;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;height:2.75rem;line-height:var(--sapContent_LineHeight);margin:0;outline:none;padding:.75rem 1rem .75rem .75rem;text-decoration:none;width:100%}.fd-menu__link:after,.fd-menu__link:before{box-sizing:inherit;font-size:inherit}.fd-menu__link.is-focus:after,.fd-menu__link:focus:after{border-color:var(--sapContent_FocusColor);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);bottom:.0625rem;content:\"\";left:.0625rem;pointer-events:none;position:absolute;right:.0625rem;top:.0625rem}.fd-menu__link.is-hover,.fd-menu__link:hover{background-color:var(--sapList_Hover_Background)}.fd-menu__link.is-selected,.fd-menu__link[aria-selected=true]{background-color:var(--sapList_SelectionBackgroundColor);border-bottom:.0625rem solid var(--sapList_SelectionBorderColor)}.fd-menu__link.is-selected .fd-menu__addon-after,.fd-menu__link.is-selected .fd-menu__addon-before,.fd-menu__link.is-selected .fd-menu__shortcut,.fd-menu__link[aria-selected=true] .fd-menu__addon-after,.fd-menu__link[aria-selected=true] .fd-menu__addon-before,.fd-menu__link[aria-selected=true] .fd-menu__shortcut{color:var(--sapContent_NonInteractiveIconColor)}.fd-menu__link.is-selected.is-hover:not(:active):not(.is-active),.fd-menu__link.is-selected:hover:not(:active):not(.is-active),.fd-menu__link[aria-selected=true].is-hover:not(:active):not(.is-active),.fd-menu__link[aria-selected=true]:hover:not(:active):not(.is-active){background-color:var(--sapList_Hover_SelectionBackground)}.fd-menu__link.is-selected.is-focus,.fd-menu__link.is-selected:focus,.fd-menu__link[aria-selected=true].is-focus,.fd-menu__link[aria-selected=true]:focus{z-index:5}.fd-menu__link.is-selected.is-focus:after,.fd-menu__link.is-selected:focus:after,.fd-menu__link[aria-selected=true].is-focus:after,.fd-menu__link[aria-selected=true]:focus:after{bottom:.125rem}.fd-menu__link.is-active,.fd-menu__link:active{background-color:var(--sapList_Active_Background);color:var(--sapList_Active_TextColor)}.fd-menu__link.is-active:after,.fd-menu__link:active:after{display:none}.fd-menu__link.is-active .fd-menu__addon-after,.fd-menu__link.is-active .fd-menu__addon-before,.fd-menu__link.is-active .fd-menu__shortcut,.fd-menu__link.is-active .fd-menu__title,.fd-menu__link:active .fd-menu__addon-after,.fd-menu__link:active .fd-menu__addon-before,.fd-menu__link:active .fd-menu__shortcut,.fd-menu__link:active .fd-menu__title{color:var(--sapList_Active_TextColor)}.fd-menu__link.is-active.is-focus,.fd-menu__link.is-active:focus,.fd-menu__link:active.is-focus,.fd-menu__link:active:focus{outline-color:var(--fdMenu_Active_State_Focus);z-index:5}.fd-menu__link.is-disabled,.fd-menu__link:disabled,.fd-menu__link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-menu__link.is-disabled.is-focus,.fd-menu__link.is-disabled:focus,.fd-menu__link:disabled.is-focus,.fd-menu__link:disabled:focus,.fd-menu__link[aria-disabled=true].is-focus,.fd-menu__link[aria-disabled=true]:focus{z-index:5}.fd-menu__link.is-disabled.is-focus:after,.fd-menu__link.is-disabled:focus:after,.fd-menu__link:disabled.is-focus:after,.fd-menu__link:disabled:focus:after,.fd-menu__link[aria-disabled=true].is-focus:after,.fd-menu__link[aria-disabled=true]:focus:after{display:none}.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active),.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active){background-color:var(--sapList_SelectionBackgroundColor);border-bottom:.0625rem solid var(--sapList_SelectionBorderColor)}.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active) .fd-menu__addon-after,.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active) .fd-menu__addon-before,.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active) .fd-menu__shortcut,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active) .fd-menu__addon-after,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active) .fd-menu__addon-before,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active) .fd-menu__shortcut{color:var(--sapContent_NonInteractiveIconColor)}.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active).is-hover:not(:active):not(.is-active),.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active):hover:not(:active):not(.is-active),.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active).is-hover:not(:active):not(.is-active),.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active):hover:not(:active):not(.is-active){background-color:var(--sapList_Hover_SelectionBackground)}.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active).is-focus,.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active):focus,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active).is-focus,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active):focus{z-index:5}.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active).is-focus:after,.fd-menu__link.has-child.is-expanded:not(:active):not(.is-active):focus:after,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active).is-focus:after,.fd-menu__link.has-child[aria-expanded=true]:not(:active):not(.is-active):focus:after{bottom:.125rem}.fd-menu__title{-webkit-box-sizing:border-box;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapList_TextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0;text-overflow:ellipsis;text-shadow:var(--fdMenu_Text_Shadow);white-space:nowrap;width:100%}.fd-menu__title:after,.fd-menu__title:before{box-sizing:inherit;font-size:inherit}.fd-menu__addon-after,.fd-menu__addon-before{-webkit-box-sizing:border-box;-webkit-box-pack:center;-ms-flex-pack:center;align-items:center;background-color:transparent;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapContent_NonInteractiveIconColor);display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--sapFontLargeSize);font-weight:400;height:1.25rem;justify-content:center;line-height:var(--sapContent_LineHeight);margin:0;min-width:2.25rem;padding:0;text-shadow:var(--fdMenu_Text_Shadow);width:2.25rem}.fd-menu__addon-after:after,.fd-menu__addon-after:before,.fd-menu__addon-before:after,.fd-menu__addon-before:before{box-sizing:inherit;font-size:inherit}.fd-menu__addon-after [class*=sap-icon],.fd-menu__addon-after[class*=sap-icon],.fd-menu__addon-before [class*=sap-icon],.fd-menu__addon-before[class*=sap-icon]{background:inherit;border-radius:inherit;color:inherit;font-size:inherit;line-height:1}.fd-menu__addon-before{margin:0 0 0 -.75rem}.fd-menu__addon-after,.fd-menu__addon-before[dir=rtl],[dir=rtl] .fd-menu__addon-before{margin:0 -1rem 0 0}.fd-menu__addon-after[dir=rtl],[dir=rtl] .fd-menu__addon-after{margin:0 0 0 -.75rem}.fd-menu__addon-after--submenu{font-size:var(--sapFontSmallSize)}.fd-menu__addon-after--submenu:before{content:\"\\e066\"}.fd-menu__addon-after--submenu:before,.fd-menu__addon-after--submenu[dir=rtl]:before,[dir=rtl] .fd-menu__addon-after--submenu:before{text-rendering:optimizeLegibility;font-family:SAP-icons;text-align:center;text-decoration:inherit;text-transform:none}.fd-menu__addon-after--submenu[dir=rtl]:before,[dir=rtl] .fd-menu__addon-after--submenu:before{content:\"\\e067\"}.fd-menu__shortcut{-webkit-box-sizing:border-box;-ms-flex-negative:0;border:0;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapContent_NonInteractiveIconColor);display:flex;flex-shrink:0;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;line-height:var(--sapContent_LineHeight);margin:0;overflow:hidden;padding:0 0 0 1rem;text-overflow:ellipsis;white-space:nowrap}.fd-menu__shortcut:after,.fd-menu__shortcut:before{box-sizing:inherit;font-size:inherit}.fd-menu__shortcut[dir=rtl],[dir=rtl] .fd-menu__shortcut{padding-left:0;padding-right:1rem}.fd-menu--overflow{-webkit-box-shadow:var(--sapContent_Shadow1);border-radius:var(--fdButton_Menu_Border_Radius);box-shadow:var(--sapContent_Shadow1);overflow-y:scroll}.fd-menu--overflow .fd-menu__list{box-shadow:none}.fd-menu--overflow .fd-menu__item:first-child{border-top-right-radius:0}.fd-menu--overflow .fd-menu__item:first-child[dir=rtl],[dir=rtl] .fd-menu--overflow .fd-menu__item:first-child{border-top-left-radius:0;border-top-right-radius:var(--fdButton_Menu_Border_Radius)}.fd-menu--overflow .fd-menu__item:last-child{border-bottom-right-radius:0}.fd-menu--overflow .fd-menu__item:last-child[dir=rtl],[dir=rtl] .fd-menu--overflow .fd-menu__item:last-child{border-bottom-left-radius:0;border-bottom-right-radius:var(--fdButton_Menu_Border_Radius)}.fd-menu--full-width{max-width:100%}.fd-menu--compact .fd-menu__link{height:2rem;padding:.375rem .75rem}.fd-menu--compact .fd-menu__link .fd-menu__addon-after,.fd-menu--compact .fd-menu__link .fd-menu__addon-before{min-width:2rem;width:2rem}.fd-menu--compact .fd-menu__link .fd-menu__addon-before{margin:0 0 0 -.5rem}.fd-menu--compact .fd-menu__link .fd-menu__addon-after,.fd-menu--compact .fd-menu__link[dir=rtl] .fd-menu__addon-before,[dir=rtl] .fd-menu--compact .fd-menu__link .fd-menu__addon-before{margin:0 -.75rem 0 0}.fd-menu--compact .fd-menu__link[dir=rtl] .fd-menu__addon-after,[dir=rtl] .fd-menu--compact .fd-menu__link .fd-menu__addon-after{margin:0 0 0 -.5rem}.fd-menu--mobile{max-width:100%;width:100%}.fd-menu--mobile .fd-menu__list,.fd-menu--mobile .fd-menu__sublist{-webkit-box-shadow:none;border-radius:0;box-shadow:none;margin:0;position:static}.fd-menu--mobile .fd-menu__list .fd-menu__item,.fd-menu--mobile .fd-menu__sublist .fd-menu__item{border-radius:0}.fd-menu--mobile .fd-menu__list .fd-menu__link,.fd-menu--mobile .fd-menu__sublist .fd-menu__link{padding:.75rem 1rem}.fd-menu--mobile .fd-menu__list .fd-menu__addon-after,.fd-menu--mobile .fd-menu__list .fd-menu__addon-before,.fd-menu--mobile .fd-menu__sublist .fd-menu__addon-after,.fd-menu--mobile .fd-menu__sublist .fd-menu__addon-before{min-width:2.75rem;width:2.75rem}.fd-menu--mobile .fd-menu__list .fd-menu__addon-before,.fd-menu--mobile .fd-menu__sublist .fd-menu__addon-before{margin:0 0 0 -1rem}.fd-menu--mobile .fd-menu__list .fd-menu__addon-after,.fd-menu--mobile .fd-menu__list[dir=rtl] .fd-menu__addon-before,.fd-menu--mobile .fd-menu__sublist .fd-menu__addon-after,.fd-menu--mobile .fd-menu__sublist[dir=rtl] .fd-menu__addon-before,[dir=rtl] .fd-menu--mobile .fd-menu__list .fd-menu__addon-before,[dir=rtl] .fd-menu--mobile .fd-menu__sublist .fd-menu__addon-before{margin:0 -1rem 0 0}.fd-menu--mobile .fd-menu__list[dir=rtl] .fd-menu__addon-after,.fd-menu--mobile .fd-menu__sublist[dir=rtl] .fd-menu__addon-after,[dir=rtl] .fd-menu--mobile .fd-menu__list .fd-menu__addon-after,[dir=rtl] .fd-menu--mobile .fd-menu__sublist .fd-menu__addon-after{margin:0 0 0 -1rem}:host{display:inline}fd-menu .fd-menu__list,fd-menu .fd-menu__sublist{flex-wrap:nowrap}.fd-popover--menu.fd-popover__popper{overflow:visible!important}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1$1.DialogConfig, decorators: [{
                     type: Optional
                 }] }, { type: i0.Renderer2 }, { type: MenuService }, { type: i0.ChangeDetectorRef }, { type: i3$1.PopoverService }, { type: i0.Injector }, { type: i0.ViewContainerRef }, { type: i3.DynamicComponentService, decorators: [{
                     type: Optional
-                }] }, { type: i5$1.ContentDensityObserver }]; }, propDecorators: { setMobileMode: [{
-                type: Input,
-                args: ['mobile']
+                }] }, { type: i5$1.ContentDensityObserver }]; }, propDecorators: { mobile: [{
+                type: Input
             }], disabled: [{
                 type: Input
             }], focusTrapped: [{
@@ -1113,12 +1153,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImpor
                 type: Input
             }], activePath: [{
                 type: Output
-            }], menuRootTemplate: [{
+            }], _menuRootTemplate: [{
                 type: ViewChild,
                 args: ['menuRootTemplate']
-            }], menuItems: [{
+            }], _menuItems: [{
                 type: ContentChildren,
-                args: [MenuItemComponent, { descendants: true }]
+                args: [MenuItemComponent]
             }] } });
 
 class MenuModule {