@tilde-nlp/ngx-menu 6.1.37 → 6.1.39

package/fesm2022/tilde-nlp-ngx-menu.mjs

@@ -412,10 +412,10 @@ class MenuItemLinkComponent {
         }] }); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MenuItemLinkComponent, { className: "MenuItemLinkComponent", filePath: "lib\\components\\menu-item-link\\menu-item-link.component.ts", lineNumber: 10 }); })();
 
-function MenuItemBtnComponent_ng_container_4_button_6_Template(rf, ctx) { if (rf & 1) {
+function MenuItemBtnComponent_ng_container_4_button_8_Template(rf, ctx) { if (rf & 1) {
     const _r2 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 6);
-    i0.ɵɵlistener("click", function MenuItemBtnComponent_ng_container_4_button_6_Template_button_click_0_listener() { const item_r3 = i0.ɵɵrestoreView(_r2).$implicit; return i0.ɵɵresetView(item_r3.onOptionClick()); });
+    i0.ɵɵelementStart(0, "button", 7);
+    i0.ɵɵlistener("click", function MenuItemBtnComponent_ng_container_4_button_8_Template_button_click_0_listener() { const item_r3 = i0.ɵɵrestoreView(_r2).$implicit; return i0.ɵɵresetView(item_r3.onOptionClick()); });
     i0.ɵɵtext(1);
     i0.ɵɵpipe(2, "translate");
     i0.ɵɵelementEnd();
@@ -427,33 +427,36 @@ function MenuItemBtnComponent_ng_container_4_button_6_Template(rf, ctx) { if (rf
 function MenuItemBtnComponent_ng_container_4_Template(rf, ctx) { if (rf & 1) {
     const _r1 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵelementStart(1, "button", 4);
-    i0.ɵɵlistener("click", function MenuItemBtnComponent_ng_container_4_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r1); $event.preventDefault(); return i0.ɵɵresetView($event.stopImmediatePropagation()); });
-    i0.ɵɵelementStart(2, "mat-icon");
-    i0.ɵɵtext(3, "more_vert");
+    i0.ɵɵelementStart(1, "div")(2, "button", 5, 0);
+    i0.ɵɵlistener("click", function MenuItemBtnComponent_ng_container_4_Template_button_click_2_listener($event) { i0.ɵɵrestoreView(_r1); $event.preventDefault(); return i0.ɵɵresetView($event.stopImmediatePropagation()); });
+    i0.ɵɵelementStart(4, "mat-icon");
+    i0.ɵɵtext(5, "more_vert");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(6, "mat-menu", null, 1);
+    i0.ɵɵtemplate(8, MenuItemBtnComponent_ng_container_4_button_8_Template, 3, 3, "button", 6);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(4, "mat-menu", null, 0);
-    i0.ɵɵtemplate(6, MenuItemBtnComponent_ng_container_4_button_6_Template, 3, 3, "button", 5);
-    i0.ɵɵelementEnd();
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const menu_r4 = i0.ɵɵreference(5);
-    const ctx_r4 = i0.ɵɵnextContext();
+    const menuTrigger_r4 = i0.ɵɵreference(3);
+    const menu_r5 = i0.ɵɵreference(7);
+    const ctx_r5 = i0.ɵɵnextContext();
     i0.ɵɵadvance();
-    i0.ɵɵproperty("matMenuTriggerFor", menu_r4);
-    i0.ɵɵadvance(5);
-    i0.ɵɵproperty("ngForOf", ctx_r4.menuItem.subMenu);
+    i0.ɵɵclassProp("open", menuTrigger_r4 == null ? null : menuTrigger_r4.menuOpen);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("matMenuTriggerFor", menu_r5);
+    i0.ɵɵadvance(6);
+    i0.ɵɵproperty("ngForOf", ctx_r5.menuItem.subMenu);
 } }
 class MenuItemBtnComponent {
     static { this.ɵfac = function MenuItemBtnComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || MenuItemBtnComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MenuItemBtnComponent, selectors: [["lib-menu-item-btn"]], inputs: { direction: "direction", activeItem: "activeItem", menuItem: "menuItem" }, decls: 5, vars: 8, consts: [["menu", "matMenu"], ["fxLayoutAlign", "space-between start", 1, "menu-item", "w-full", "flex", "justify-center", "items-center", 3, "click", "ngClass.lt-md"], [1, "btn-label"], [4, "ngIf"], ["mat-icon-button", "", 3, "click", "matMenuTriggerFor"], ["mat-menu-item", "", 3, "click", 4, "ngFor", "ngForOf"], ["mat-menu-item", "", 3, "click"]], template: function MenuItemBtnComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵelementStart(0, "button", 1);
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MenuItemBtnComponent, selectors: [["lib-menu-item-btn"]], inputs: { direction: "direction", activeItem: "activeItem", menuItem: "menuItem" }, decls: 5, vars: 8, consts: [["menuTrigger", "matMenuTrigger"], ["menu", "matMenu"], ["fxLayoutAlign", "space-between start", 1, "menu-item", "w-full", "flex", "justify-center", "items-center", 3, "click", "ngClass.lt-md"], [1, "btn-label"], [4, "ngIf"], ["mat-icon-button", "", 1, "sub-menu-btn", 3, "click", "matMenuTriggerFor"], ["mat-menu-item", "", 3, "click", 4, "ngFor", "ngForOf"], ["mat-menu-item", "", 3, "click"]], template: function MenuItemBtnComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "button", 2);
             i0.ɵɵlistener("click", function MenuItemBtnComponent_Template_button_click_0_listener() { return ctx.menuItem.clickAction && ctx.menuItem.clickAction(); });
-            i0.ɵɵelementStart(1, "span", 2);
+            i0.ɵɵelementStart(1, "span", 3);
             i0.ɵɵtext(2);
             i0.ɵɵpipe(3, "translate");
             i0.ɵɵelementEnd();
-            i0.ɵɵtemplate(4, MenuItemBtnComponent_ng_container_4_Template, 7, 2, "ng-container", 3);
+            i0.ɵɵtemplate(4, MenuItemBtnComponent_ng_container_4_Template, 9, 4, "ng-container", 4);
             i0.ɵɵelementEnd();
         } if (rf & 2) {
             i0.ɵɵclassProp("active-menu-item", ctx.menuItem.isItemActive ? ctx.menuItem.isItemActive(ctx.menuItem.customId) : ctx.menuItem === ctx.activeItem);
@@ -463,11 +466,11 @@ class MenuItemBtnComponent {
             i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(3, 6, ctx.menuItem.title), " ");
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("ngIf", ctx.menuItem.subMenu == null ? null : ctx.menuItem.subMenu.length);
-        } }, dependencies: [i1$2.DefaultLayoutAlignDirective, i2$2.DefaultClassDirective, i4.NgForOf, i4.NgIf, i2$1.MatIcon, i7.MatIconButton, i6.MatMenu, i6.MatMenuItem, i6.MatMenuTrigger, i8.TranslatePipe], styles: ["[_nghost-%COMP%]{width:100%}.mobile[_ngcontent-%COMP%]   .btn-label[_ngcontent-%COMP%]{margin-left:5px}.btn-label[_ngcontent-%COMP%]{font-size:14px;font-weight:500;line-height:20px;letter-spacing:.1px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}"] }); }
+        } }, dependencies: [i1$2.DefaultLayoutAlignDirective, i2$2.DefaultClassDirective, i4.NgForOf, i4.NgIf, i2$1.MatIcon, i7.MatIconButton, i6.MatMenu, i6.MatMenuItem, i6.MatMenuTrigger, i8.TranslatePipe], styles: ["[_nghost-%COMP%]{width:100%}.menu-item[_ngcontent-%COMP%]:not(:hover)   .sub-menu-btn[_ngcontent-%COMP%]{display:none}.menu-item[_ngcontent-%COMP%]:has(.open){background-color:var(--base-95)!important}.open[_ngcontent-%COMP%]   .sub-menu-btn[_ngcontent-%COMP%]{display:block!important}.mobile[_ngcontent-%COMP%]   .btn-label[_ngcontent-%COMP%]{margin-left:5px}.btn-label[_ngcontent-%COMP%]{font-size:14px;font-weight:500;line-height:20px;letter-spacing:.1px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MenuItemBtnComponent, [{
         type: Component,
-        args: [{ selector: 'lib-menu-item-btn', standalone: false, template: "<button\r\n  [ngClass.lt-md]=\"'mobile'\"\r\n  [attr.id]=\"menuItem.customId\"\r\n  class=\"menu-item w-full flex justify-center items-center\"\r\n  fxLayoutAlign=\"space-between start\"\r\n  [class.active-menu-item]=\"menuItem.isItemActive ? menuItem.isItemActive(menuItem.customId) : menuItem === activeItem\"\r\n  (click)=\"menuItem.clickAction && menuItem.clickAction()\"\r\n>\r\n  <span class=\"btn-label\">\r\n    {{ menuItem.title | translate }}\r\n  </span>\r\n  <ng-container *ngIf=\"menuItem.subMenu?.length\">\r\n    <button\r\n      mat-icon-button\r\n      [matMenuTriggerFor]=\"menu\"\r\n      (click)=\"$event.preventDefault(); $event.stopImmediatePropagation()\"\r\n    >\r\n      <mat-icon>more_vert</mat-icon>\r\n    </button>\r\n    <mat-menu #menu=\"matMenu\">\r\n      <button\r\n        *ngFor=\"let item of menuItem.subMenu\"\r\n        mat-menu-item\r\n        (click)=\"item.onOptionClick()\"\r\n      >\r\n        {{ item.title | translate }}\r\n      </button>\r\n    </mat-menu>\r\n  </ng-container>\r\n</button>\r\n", styles: [":host{width:100%}.mobile .btn-label{margin-left:5px}.btn-label{font-size:14px;font-weight:500;line-height:20px;letter-spacing:.1px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n"] }]
+        args: [{ selector: 'lib-menu-item-btn', standalone: false, template: "<button\r\n  [ngClass.lt-md]=\"'mobile'\"\r\n  [attr.id]=\"menuItem.customId\"\r\n  class=\"menu-item w-full flex justify-center items-center\"\r\n  fxLayoutAlign=\"space-between start\"\r\n  [class.active-menu-item]=\"menuItem.isItemActive ? menuItem.isItemActive(menuItem.customId) : menuItem === activeItem\"\r\n  (click)=\"menuItem.clickAction && menuItem.clickAction()\"\r\n>\r\n  <span class=\"btn-label\">\r\n    {{ menuItem.title | translate }}\r\n  </span>\r\n  <ng-container *ngIf=\"menuItem.subMenu?.length\">\r\n    <div [class.open]=\"menuTrigger?.menuOpen\">\r\n      <button\r\n        class=\"sub-menu-btn\"\r\n        mat-icon-button\r\n        [matMenuTriggerFor]=\"menu\"\r\n        #menuTrigger=\"matMenuTrigger\"\r\n        (click)=\"$event.preventDefault(); $event.stopImmediatePropagation()\"\r\n      >\r\n        <mat-icon>more_vert</mat-icon>\r\n      </button>\r\n    <mat-menu #menu=\"matMenu\">\r\n      <button\r\n        *ngFor=\"let item of menuItem.subMenu\"\r\n        mat-menu-item\r\n        (click)=\"item.onOptionClick()\"\r\n      >\r\n        {{ item.title | translate }}\r\n      </button>\r\n    </mat-menu>\r\n    </div>\r\n  </ng-container>\r\n</button>\r\n", styles: [":host{width:100%}.menu-item:not(:hover) .sub-menu-btn{display:none}.menu-item:has(.open){background-color:var(--base-95)!important}.open .sub-menu-btn{display:block!important}.mobile .btn-label{margin-left:5px}.btn-label{font-size:14px;font-weight:500;line-height:20px;letter-spacing:.1px;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n"] }]
     }], null, { direction: [{
             type: Input
         }], activeItem: [{
@@ -854,8 +857,9 @@ function SideNavMenuComponent_a_14_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵclassProp("no-click", ctx_r2.menuSettings == null ? null : ctx_r2.menuSettings.disableLogoNavigation);
     i0.ɵɵproperty("libPlausibleEvent", ctx_r2.LOGOCLICK_PLAUSIBLE_EVENT)("href", ctx_r2.baseUrl, i0.ɵɵsanitizeUrl);
-    i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(1, 5, "MENU.ARIA_LABELS.LOGO"));
+    i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(1, 7, "MENU.ARIA_LABELS.LOGO"));
     i0.ɵɵadvance(2);
     i0.ɵɵproperty("src", ctx_r2.menuLogoImage, i0.ɵɵsanitizeUrl);
     i0.ɵɵadvance(2);
@@ -1027,7 +1031,8 @@ class SideNavMenuComponent extends NavBaseComponent {
             collapsedWidth: '56px',
             menuLogo: '',
             menuLogoCollapsed: '',
-            disableStrapi: false
+            disableStrapi: false,
+            disableLogoNavigation: false
         };
         this.collapsed = false;
         this.COLLAPSED_LOCAL_STORAGE_KEY = "TLD_MENU_SIDE_NAV_COLLAPSED";
@@ -1093,7 +1098,7 @@ class SideNavMenuComponent extends NavBaseComponent {
         this.userInitials = splittedUsername[0][0] + splittedUsername[1][0];
     }
     static { this.ɵfac = function SideNavMenuComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SideNavMenuComponent)(i0.ɵɵdirectiveInject(i1.StrapiLinkService), i0.ɵɵdirectiveInject(i2.DOMService), i0.ɵɵdirectiveInject(MenuItemsService)); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SideNavMenuComponent, selectors: [["lib-side-nav-menu"]], inputs: { username: "username", menuSettings: "menuSettings", productName: "productName" }, features: [i0.ɵɵInheritDefinitionFeature], decls: 37, vars: 33, consts: [["state", "matMenuTrigger"], ["menu", "matMenu"], ["profileMenuItem", ""], ["iconDown", ""], ["fxHide.gt-xs", ""], [1, "mobile-header", 3, "fxHide"], ["fxFlex", "3.125em", "fxLayoutAlign", "start center", 3, "click", "libPlausibleEvent", "href"], ["height", "40", "width", "40", "alt", "logo", 1, "menu-logo", 3, "src"], [1, "menu-product-name"], ["mat-icon-button", "", 1, "toggler", 3, "click", "libPlausibleEvent"], ["fxLayout", "column", 1, "menu-container", 3, "ngClass.lt-sm"], ["fxLayout", "column", "fxFlexFill", "", 1, "content"], ["fxLayout", "row", 1, "menu-container-header", 3, "fxLayoutAlign"], ["fxFlex", "3.125em", "fxLayoutAlign", "start center", 3, "libPlausibleEvent", "href", "click", 4, "ngIf"], ["mat-icon-button", "", 1, "toggler", 3, "click", "libPlausibleEvent", "matTooltip"], ["fxHide.lt-sm", ""], ["fxLayout", "column", 1, "menu-wrapper"], ["role", "navigation", 3, "toggleCollapseEvent", "direction", "isOpen", "active"], [1, "profile"], [1, "profile-wrapper", 3, "matMenuTriggerFor"], [1, "profile-icon"], [4, "ngIf"], [1, "profile-menu"], [1, "profile-name"], ["class", "profile-arrow spin", 4, "ngIf", "ngIfElse"], [1, "profile-arrow", "spin"], ["mat-menu-item", "", 1, "profile-option"], ["target", "_blank", 1, "mat-mdc-menu-item", 3, "href"], [1, "mat-mdc-menu-item", 3, "routerLink"], ["target", "_blank", 1, "mat-mdc-menu-item", 3, "click", "href"], [4, "ngTemplateOutlet", "ngTemplateOutletContext"], [1, "mat-mdc-menu-item", 3, "click", "routerLink"], ["mat-menu-item", "", 1, "profile-option", 3, "click"], [1, "material-icons", "profile-option-icon", 3, "material-icons-outlined"], [1, "profile-option-icon", 3, "svgIcon"], [1, "material-icons", "profile-option-icon"]], template: function SideNavMenuComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SideNavMenuComponent, selectors: [["lib-side-nav-menu"]], inputs: { username: "username", menuSettings: "menuSettings", productName: "productName" }, features: [i0.ɵɵInheritDefinitionFeature], decls: 37, vars: 35, consts: [["state", "matMenuTrigger"], ["menu", "matMenu"], ["profileMenuItem", ""], ["iconDown", ""], ["fxHide.gt-xs", ""], [1, "mobile-header", 3, "fxHide"], ["fxFlex", "3.125em", "fxLayoutAlign", "start center", 3, "click", "libPlausibleEvent", "href"], ["height", "40", "width", "40", "alt", "logo", 1, "menu-logo", 3, "src"], [1, "menu-product-name"], ["mat-icon-button", "", 1, "toggler", 3, "click", "libPlausibleEvent"], ["fxLayout", "column", 1, "menu-container", 3, "ngClass.lt-sm"], ["fxLayout", "column", "fxFlexFill", "", 1, "content"], ["fxLayout", "row", 1, "menu-container-header", 3, "fxLayoutAlign"], ["fxFlex", "3.125em", "fxLayoutAlign", "start center", 3, "libPlausibleEvent", "no-click", "href", "click", 4, "ngIf"], ["mat-icon-button", "", 1, "toggler", 3, "click", "libPlausibleEvent", "matTooltip"], ["fxHide.lt-sm", ""], ["fxLayout", "column", 1, "menu-wrapper"], ["role", "navigation", 3, "toggleCollapseEvent", "direction", "isOpen", "active"], [1, "profile"], [1, "profile-wrapper", 3, "matMenuTriggerFor"], [1, "profile-icon"], [4, "ngIf"], [1, "profile-menu"], [1, "profile-name"], ["class", "profile-arrow spin", 4, "ngIf", "ngIfElse"], [1, "profile-arrow", "spin"], ["mat-menu-item", "", 1, "profile-option"], ["target", "_blank", 1, "mat-mdc-menu-item", 3, "href"], [1, "mat-mdc-menu-item", 3, "routerLink"], ["target", "_blank", 1, "mat-mdc-menu-item", 3, "click", "href"], [4, "ngTemplateOutlet", "ngTemplateOutletContext"], [1, "mat-mdc-menu-item", 3, "click", "routerLink"], ["mat-menu-item", "", 1, "profile-option", 3, "click"], [1, "material-icons", "profile-option-icon", 3, "material-icons-outlined"], [1, "profile-option-icon", 3, "svgIcon"], [1, "material-icons", "profile-option-icon"]], template: function SideNavMenuComponent_Template(rf, ctx) { if (rf & 1) {
             const _r1 = i0.ɵɵgetCurrentView();
             i0.ɵɵelementStart(0, "div", 4)(1, "div", 5)(2, "a", 6);
             i0.ɵɵpipe(3, "translate");
@@ -1109,7 +1114,7 @@ class SideNavMenuComponent extends NavBaseComponent {
             i0.ɵɵtext(10, "menu");
             i0.ɵɵelementEnd()()()();
             i0.ɵɵelementStart(11, "div", 10)(12, "div", 11)(13, "div", 12);
-            i0.ɵɵtemplate(14, SideNavMenuComponent_a_14_Template, 5, 7, "a", 13);
+            i0.ɵɵtemplate(14, SideNavMenuComponent_a_14_Template, 5, 9, "a", 13);
             i0.ɵɵelementStart(15, "button", 14);
             i0.ɵɵpipe(16, "translate");
             i0.ɵɵpipe(17, "translate");
@@ -1138,15 +1143,16 @@ class SideNavMenuComponent extends NavBaseComponent {
             i0.ɵɵadvance();
             i0.ɵɵproperty("fxHide", !ctx.collapsed);
             i0.ɵɵadvance();
+            i0.ɵɵclassProp("no-click", ctx.menuSettings == null ? null : ctx.menuSettings.disableLogoNavigation);
             i0.ɵɵproperty("libPlausibleEvent", ctx.LOGOCLICK_PLAUSIBLE_EVENT)("href", ctx.baseUrl, i0.ɵɵsanitizeUrl);
-            i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(3, 25, "MENU.ARIA_LABELS.LOGO"));
+            i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(3, 27, "MENU.ARIA_LABELS.LOGO"));
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("src", ctx.menuLogoImage, i0.ɵɵsanitizeUrl);
             i0.ɵɵadvance(2);
             i0.ɵɵtextInterpolate1(" ", ctx.productName, " ");
             i0.ɵɵadvance();
             i0.ɵɵproperty("libPlausibleEvent", ctx.collapsed ? ctx.EXPAND_PLAUSIBLE_EVENT : ctx.COLLAPSE_PLAUSIBLE_EVENT);
-            i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(8, 27, "ARIA_LABELS.MENU_TOGGLER"));
+            i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(8, 29, "ARIA_LABELS.MENU_TOGGLER"));
             i0.ɵɵadvance(4);
             i0.ɵɵstyleProp("width", ctx.sideNavWidth);
             i0.ɵɵclassProp("collapsed", ctx.collapsed);
@@ -1156,8 +1162,8 @@ class SideNavMenuComponent extends NavBaseComponent {
             i0.ɵɵadvance();
             i0.ɵɵproperty("ngIf", !ctx.collapsed);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("libPlausibleEvent", ctx.collapsed ? ctx.EXPAND_PLAUSIBLE_EVENT : ctx.COLLAPSE_PLAUSIBLE_EVENT)("matTooltip", i0.ɵɵpipeBind1(16, 29, ctx.collapsed ? "MENU.EXPAND" : "MENU.COLLAPSE"));
-            i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(17, 31, "ARIA_LABELS.MENU_TOGGLER"));
+            i0.ɵɵproperty("libPlausibleEvent", ctx.collapsed ? ctx.EXPAND_PLAUSIBLE_EVENT : ctx.COLLAPSE_PLAUSIBLE_EVENT)("matTooltip", i0.ɵɵpipeBind1(16, 31, ctx.collapsed ? "MENU.EXPAND" : "MENU.COLLAPSE"));
+            i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(17, 33, "ARIA_LABELS.MENU_TOGGLER"));
             i0.ɵɵadvance(6);
             i0.ɵɵtextInterpolate(ctx.collapsed ? "keyboard_double_arrow_right" : "keyboard_double_arrow_left");
             i0.ɵɵadvance(2);
@@ -1170,11 +1176,11 @@ class SideNavMenuComponent extends NavBaseComponent {
             i0.ɵɵproperty("ngIf", !ctx.collapsed);
             i0.ɵɵadvance(3);
             i0.ɵɵrepeater(ctx.menuSettings.userOptions);
-        } }, dependencies: [i1$2.DefaultLayoutDirective, i1$2.DefaultLayoutAlignDirective, i1$2.FlexFillDirective, i1$2.DefaultFlexDirective, i2$2.DefaultShowHideDirective, i2$2.DefaultClassDirective, i1$1.RouterLink, i4.NgIf, i4.NgTemplateOutlet, i5.MatTooltip, i2$1.MatIcon, i7.MatIconButton, i6.MatMenu, i6.MatMenuItem, i6.MatMenuTrigger, i2.PlausibleEventDirective, MenuColumnsComponent, i8.TranslatePipe], styles: ["a[_ngcontent-%COMP%]{text-decoration:none}.mobile-header[_ngcontent-%COMP%]{display:flex;justify-content:space-between;padding:23px 27px;background-color:#fcfcfc;border:1px solid var(--base-70)}.mobile.menu-container.collapsed[_ngcontent-%COMP%]{display:none!important}.mobile.menu-container[_ngcontent-%COMP%]:not(.collapsed){display:block!important;position:fixed;min-width:100vw;min-height:100dvh;z-index:1000}.mobile[_ngcontent-%COMP%]   .profile-wrapper[_ngcontent-%COMP%]{position:relative}.mobile[_ngcontent-%COMP%]   .profile-wrapper[_ngcontent-%COMP%]   mat-icon[_ngcontent-%COMP%]{position:absolute!important;right:0}.menu-product-name[_ngcontent-%COMP%]{white-space:nowrap;margin-left:12px;font-weight:600;color:var(--base-10)}.menu-container[_ngcontent-%COMP%]{max-height:100dvh;white-space:nowrap;height:100%;transition:width .2s ease;min-height:100dvh;overflow:auto;background:var(--base-100);border-right:2px solid var(--base-95)}.menu-container[_ngcontent-%COMP%]   .menu-container-header[_ngcontent-%COMP%]{margin:24px 0;max-height:40px}.menu-container.collapsed[_ngcontent-%COMP%]   .menu-container-header[_ngcontent-%COMP%]{margin:24px 0 32px!important}.menu-container[_ngcontent-%COMP%]   .content[_ngcontent-%COMP%]:not(.collapsed){overflow-x:hidden;padding:0 12px}.menu-container[_ngcontent-%COMP%]   .content[_ngcontent-%COMP%]:not(.collapsed)   .menu-logo[_ngcontent-%COMP%]{margin-left:16px;max-width:100%}.menu-container[_ngcontent-%COMP%]   .divider[_ngcontent-%COMP%]{width:100%}.menu-container[_ngcontent-%COMP%]   .profile[_ngcontent-%COMP%]{position:relative;height:100%;margin-top:100px}.menu-container[_ngcontent-%COMP%]   .profile-wrapper[_ngcontent-%COMP%]{background:none;color:var(--base-30);display:flex;align-items:center;justify-content:start;width:100%;position:absolute;bottom:0;margin:32px 16px}.menu-container[_ngcontent-%COMP%]   .profile-icon[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center;min-width:40px;height:40px;border-radius:100%;color:var(--base-0);background-color:var(--base-70);font-size:16px;font-weight:600}.menu-container[_ngcontent-%COMP%]   .profile-name[_ngcontent-%COMP%]{max-width:145px;overflow:hidden;margin-left:12px;text-overflow:ellipsis}.collapsed[_ngcontent-%COMP%]   .profile-wrapper[_ngcontent-%COMP%]{margin:36px 0!important}.mobile[_ngcontent-%COMP%]   .profile-name[_ngcontent-%COMP%]{max-width:60vw}.profile-option-icon[_ngcontent-%COMP%]{vertical-align:middle;margin:0 5px 5px 0}[_nghost-%COMP%]     .menu-item{display:flex;padding:16px!important;border-radius:4px!important}[_nghost-%COMP%]     .child-list .menu-item{padding:8px 46px!important}[_nghost-%COMP%]     .collapsed .menu-item{padding:0!important;width:40px;height:40px;border-radius:50%!important}[_nghost-%COMP%]     .active-menu-item{background-color:var(--base-95)!important}[_nghost-%COMP%]     .menu-item-title{margin-left:12px}tld-menu-icon[_ngcontent-%COMP%]{margin-right:10px}.profile-arrow[_ngcontent-%COMP%]{position:absolute;right:3px;margin-right:20px}.spin[_ngcontent-%COMP%]{animation:_ngcontent-%COMP%_spinArrow .3s forwards}[_nghost-%COMP%]  button.collapse-btn .mat-mdc-button-persistent-ripple, [_nghost-%COMP%]  button.toggler .mat-mdc-button-persistent-ripple{display:none}[_nghost-%COMP%]     .mobile .child-list .menu-item{padding:8px 54px!important}  .cdk-overlay-container .profile-menu{margin:10px 0!important}  .mat-mdc-menu-item .mat-icon{margin-right:5px!important}  .collapsed .profile-wrapper{justify-content:center!important}  .profile-menu a{font-weight:400!important;display:flex;align-items:center;gap:5px}  .profile-menu a:hover{color:var(--mat-menu-item-label-text-color, var(--mat-app-on-surface))!important;text-decoration:inherit}@keyframes _ngcontent-%COMP%_spinArrow{to{transform:rotate(180deg)}}"] }); }
+        } }, dependencies: [i1$2.DefaultLayoutDirective, i1$2.DefaultLayoutAlignDirective, i1$2.FlexFillDirective, i1$2.DefaultFlexDirective, i2$2.DefaultShowHideDirective, i2$2.DefaultClassDirective, i1$1.RouterLink, i4.NgIf, i4.NgTemplateOutlet, i5.MatTooltip, i2$1.MatIcon, i7.MatIconButton, i6.MatMenu, i6.MatMenuItem, i6.MatMenuTrigger, i2.PlausibleEventDirective, MenuColumnsComponent, i8.TranslatePipe], styles: ["a[_ngcontent-%COMP%]{text-decoration:none}.no-click[_ngcontent-%COMP%]{pointer-events:none!important}.mobile-header[_ngcontent-%COMP%]{display:flex;justify-content:space-between;padding:23px 27px;background-color:#fcfcfc;border:1px solid var(--base-70)}.mobile.menu-container.collapsed[_ngcontent-%COMP%]{display:none!important}.mobile.menu-container[_ngcontent-%COMP%]:not(.collapsed){display:block!important;position:fixed;min-width:100vw;min-height:100dvh;z-index:1000}.mobile[_ngcontent-%COMP%]   .profile-wrapper[_ngcontent-%COMP%]{position:relative}.mobile[_ngcontent-%COMP%]   .profile-wrapper[_ngcontent-%COMP%]   mat-icon[_ngcontent-%COMP%]{position:absolute!important;right:0}.menu-product-name[_ngcontent-%COMP%]{white-space:nowrap;margin-left:12px;font-weight:600;color:var(--base-10)}.menu-container[_ngcontent-%COMP%]{max-height:100dvh;white-space:nowrap;height:100%;transition:width .2s ease;min-height:100dvh;overflow:auto;background:var(--base-100);border-right:2px solid var(--base-95)}.menu-container[_ngcontent-%COMP%]   .menu-container-header[_ngcontent-%COMP%]{margin:24px 0;max-height:40px}.menu-container.collapsed[_ngcontent-%COMP%]   .menu-container-header[_ngcontent-%COMP%]{margin:24px 0 32px!important}.menu-container[_ngcontent-%COMP%]   .content[_ngcontent-%COMP%]:not(.collapsed){overflow-x:hidden;padding:0 12px}.menu-container[_ngcontent-%COMP%]   .content[_ngcontent-%COMP%]:not(.collapsed)   .menu-logo[_ngcontent-%COMP%]{margin-left:16px;max-width:100%}.menu-container[_ngcontent-%COMP%]   .divider[_ngcontent-%COMP%]{width:100%}.menu-container[_ngcontent-%COMP%]   .profile[_ngcontent-%COMP%]{position:relative;height:100%;margin-top:100px}.menu-container[_ngcontent-%COMP%]   .profile-wrapper[_ngcontent-%COMP%]{background:none;color:var(--base-30);display:flex;align-items:center;justify-content:start;width:100%;position:absolute;bottom:0;margin:32px 16px}.menu-container[_ngcontent-%COMP%]   .profile-icon[_ngcontent-%COMP%]{display:flex;justify-content:center;align-items:center;min-width:40px;height:40px;border-radius:100%;color:var(--base-0);background-color:var(--base-70);font-size:16px;font-weight:600}.menu-container[_ngcontent-%COMP%]   .profile-name[_ngcontent-%COMP%]{max-width:145px;overflow:hidden;margin-left:12px;text-overflow:ellipsis}.collapsed[_ngcontent-%COMP%]   .profile-wrapper[_ngcontent-%COMP%]{margin:36px 0!important}.mobile[_ngcontent-%COMP%]   .profile-name[_ngcontent-%COMP%]{max-width:60vw}.profile-option-icon[_ngcontent-%COMP%]{vertical-align:middle;margin:0 5px 5px 0}[_nghost-%COMP%]     .menu-item{display:flex;padding:16px!important;border-radius:4px!important}[_nghost-%COMP%]     .child-list .menu-item{padding:8px 46px!important}[_nghost-%COMP%]     .collapsed .menu-item{padding:0!important;width:40px;height:40px;border-radius:50%!important}[_nghost-%COMP%]     .active-menu-item{background-color:var(--base-95)!important}[_nghost-%COMP%]     .menu-item-title{margin-left:12px}tld-menu-icon[_ngcontent-%COMP%]{margin-right:10px}.profile-arrow[_ngcontent-%COMP%]{position:absolute;right:3px;margin-right:20px}.spin[_ngcontent-%COMP%]{animation:_ngcontent-%COMP%_spinArrow .3s forwards}[_nghost-%COMP%]  button.collapse-btn .mat-mdc-button-persistent-ripple, [_nghost-%COMP%]  button.toggler .mat-mdc-button-persistent-ripple{display:none}[_nghost-%COMP%]     .mobile .child-list .menu-item{padding:8px 54px!important}  .cdk-overlay-container .profile-menu{margin:10px 0!important}  .mat-mdc-menu-item .mat-icon{margin-right:5px!important}  .collapsed .profile-wrapper{justify-content:center!important}  .profile-menu a{font-weight:400!important;display:flex;align-items:center;gap:5px}  .profile-menu a:hover{color:var(--mat-menu-item-label-text-color, var(--mat-app-on-surface))!important;text-decoration:inherit}@keyframes _ngcontent-%COMP%_spinArrow{to{transform:rotate(180deg)}}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SideNavMenuComponent, [{
         type: Component,
-        args: [{ selector: 'lib-side-nav-menu', template: "<div fxHide.gt-xs>\r\n  <div [fxHide]=\"!collapsed\" class=\"mobile-header\">\r\n    <a [libPlausibleEvent]=\"LOGOCLICK_PLAUSIBLE_EVENT\" fxFlex=\"3.125em\" [href]=\"baseUrl\"\r\n      [attr.aria-label]=\"'MENU.ARIA_LABELS.LOGO' | translate\" (click)=\"logoClick($event)\" fxLayoutAlign=\"start center\"\r\n    >\r\n      <img height=\"40\" width=\"40\" class=\"menu-logo\" [src]=\"menuLogoImage\" alt=\"logo\" />\r\n      <span class=\"menu-product-name\">\r\n        {{ productName }}\r\n      </span>\r\n    </a>\r\n\r\n    <button\r\n      mat-icon-button\r\n      class=\"toggler\"\r\n      [attr.aria-label]=\"'ARIA_LABELS.MENU_TOGGLER' | translate\"\r\n      [libPlausibleEvent]=\"collapsed ? EXPAND_PLAUSIBLE_EVENT : COLLAPSE_PLAUSIBLE_EVENT\"\r\n      (click)=\"toggleCollapse()\"\r\n    >\r\n      <mat-icon>menu</mat-icon>\r\n    </button>\r\n  </div>\r\n</div>\r\n\r\n<div [ngClass.lt-sm]=\"'mobile'\" class=\"menu-container\" [style.width]=\"sideNavWidth\" fxLayout=\"column\" [class.collapsed]=\"collapsed\">\r\n  <div class=\"content\" fxLayout=\"column\" fxFlexFill>\r\n    <div class=\"menu-container-header\" fxLayout=\"row\" [fxLayoutAlign]=\"collapsed ? 'center center' : 'space-between center'\">\r\n      <a *ngIf=\"!collapsed\" [libPlausibleEvent]=\"LOGOCLICK_PLAUSIBLE_EVENT\" fxFlex=\"3.125em\" [href]=\"baseUrl\"\r\n        [attr.aria-label]=\"'MENU.ARIA_LABELS.LOGO' | translate\" (click)=\"logoClick($event)\" fxLayoutAlign=\"start center\"\r\n      >\r\n        <img height=\"40\" width=\"40\" class=\"menu-logo\" [src]=\"menuLogoImage\" alt=\"logo\" />\r\n        <span class=\"menu-product-name\">\r\n          {{ productName }}\r\n        </span>\r\n      </a>\r\n\r\n      <button\r\n        mat-icon-button\r\n        class=\"toggler\"\r\n        [attr.aria-label]=\"'ARIA_LABELS.MENU_TOGGLER' | translate\"\r\n        [libPlausibleEvent]=\"collapsed ? EXPAND_PLAUSIBLE_EVENT : COLLAPSE_PLAUSIBLE_EVENT\"\r\n        [matTooltip]=\"(collapsed ? 'MENU.EXPAND' : 'MENU.COLLAPSE') | translate\"\r\n        (click)=\"toggleCollapse()\"\r\n      >\r\n        <mat-icon fxHide.gt-xs>close</mat-icon>\r\n        <mat-icon fxHide.lt-sm>{{ collapsed ? 'keyboard_double_arrow_right' : 'keyboard_double_arrow_left' }}</mat-icon>\r\n      </button>\r\n    </div>\r\n\r\n    <div class=\"menu-wrapper\" fxLayout=\"column\">\r\n      <menu-columns (toggleCollapseEvent)=\"toggleCollapse()\" [direction]=\"direction\" role=\"navigation\" [isOpen]=\"!collapsed\"\r\n        [active]=\"active\"></menu-columns>\r\n    </div>\r\n\r\n  <div class=\"profile\">\r\n    <button #state=\"matMenuTrigger\" [matMenuTriggerFor]=\"menu\" class=\"profile-wrapper\">\r\n      <div class=\"profile-icon\">\r\n        @if (userInitials) {\r\n          {{userInitials}}\r\n        } @else {\r\n          <mat-icon>person</mat-icon>\r\n        }\r\n    </div>\r\n\r\n      <ng-container *ngIf=\"!collapsed\">\r\n        <span class=\"profile-name\">\r\n          {{ username ?? 'MENU.ANONYMOUS' | translate }}\r\n        </span>\r\n\r\n        <mat-icon *ngIf=\"state.menuOpen; else iconDown\" class=\"profile-arrow spin\">{{\"keyboard_arrow_down\"}}</mat-icon>\r\n\r\n        <ng-template #iconDown>\r\n          <mat-icon class=\"profile-arrow spin\">{{\"keyboard_arrow_up\" }}</mat-icon>\r\n        </ng-template>\r\n      </ng-container>\r\n    </button>\r\n\r\n    <mat-menu #menu=\"matMenu\" class=\"profile-menu\">\r\n      @for (item of menuSettings.userOptions; track item.label) {\r\n        @if (item.link) {\r\n          @if (item.link.isExternal) {\r\n            <a class=\"mat-mdc-menu-item\" [href]=\"item.link.href\" target=\"_blank\" (click)=\"linkCallback(item.link)\">\r\n              <ng-container\r\n                *ngTemplateOutlet=\"profileMenuItem; context: { icon: item.icon, label: item.label }\">\r\n              </ng-container>\r\n            </a>\r\n          } @else {\r\n            <a class=\"mat-mdc-menu-item\" [routerLink]=\"item.link.href\" (click)=\"linkCallback(item.link)\">\r\n              <ng-container\r\n                *ngTemplateOutlet=\"profileMenuItem; context: { icon: item.icon, label: item.label }\">\r\n              </ng-container>\r\n            </a>\r\n          }\r\n        } @else {\r\n          <button\r\n            mat-menu-item\r\n            class=\"profile-option\"\r\n            (click)=\"item.button?.callback()\"\r\n        >\r\n          <ng-container\r\n            *ngTemplateOutlet=\"profileMenuItem; context: { icon: item.icon, label: item.label }\">\r\n          </ng-container>\r\n        </button>\r\n        }\r\n      }\r\n    </mat-menu>\r\n  </div>\r\n\r\n  <ng-template #profileMenuItem let-icon=\"icon\" let-label=\"label\">\r\n    @if (icon) {\r\n      @if (!icon?.isCustom) {\r\n        <span class=\"material-icons profile-option-icon\" [class.material-icons-outlined]=\"icon?.isOutlined\">\r\n          {{icon?.name}}\r\n        </span>\r\n      } @else {\r\n        <mat-icon class=\"profile-option-icon\" [svgIcon]=\"icon?.name\"></mat-icon>\r\n      }\r\n    }\r\n    {{ label | translate }}\r\n  </ng-template>\r\n</div>\r\n", styles: ["a{text-decoration:none}.mobile-header{display:flex;justify-content:space-between;padding:23px 27px;background-color:#fcfcfc;border:1px solid var(--base-70)}.mobile.menu-container.collapsed{display:none!important}.mobile.menu-container:not(.collapsed){display:block!important;position:fixed;min-width:100vw;min-height:100dvh;z-index:1000}.mobile .profile-wrapper{position:relative}.mobile .profile-wrapper mat-icon{position:absolute!important;right:0}.menu-product-name{white-space:nowrap;margin-left:12px;font-weight:600;color:var(--base-10)}.menu-container{max-height:100dvh;white-space:nowrap;height:100%;transition:width .2s ease;min-height:100dvh;overflow:auto;background:var(--base-100);border-right:2px solid var(--base-95)}.menu-container .menu-container-header{margin:24px 0;max-height:40px}.menu-container.collapsed .menu-container-header{margin:24px 0 32px!important}.menu-container .content:not(.collapsed){overflow-x:hidden;padding:0 12px}.menu-container .content:not(.collapsed) .menu-logo{margin-left:16px;max-width:100%}.menu-container .divider{width:100%}.menu-container .profile{position:relative;height:100%;margin-top:100px}.menu-container .profile-wrapper{background:none;color:var(--base-30);display:flex;align-items:center;justify-content:start;width:100%;position:absolute;bottom:0;margin:32px 16px}.menu-container .profile-icon{display:flex;justify-content:center;align-items:center;min-width:40px;height:40px;border-radius:100%;color:var(--base-0);background-color:var(--base-70);font-size:16px;font-weight:600}.menu-container .profile-name{max-width:145px;overflow:hidden;margin-left:12px;text-overflow:ellipsis}.collapsed .profile-wrapper{margin:36px 0!important}.mobile .profile-name{max-width:60vw}.profile-option-icon{vertical-align:middle;margin:0 5px 5px 0}:host ::ng-deep .menu-item{display:flex;padding:16px!important;border-radius:4px!important}:host ::ng-deep .child-list .menu-item{padding:8px 46px!important}:host ::ng-deep .collapsed .menu-item{padding:0!important;width:40px;height:40px;border-radius:50%!important}:host ::ng-deep .active-menu-item{background-color:var(--base-95)!important}:host ::ng-deep .menu-item-title{margin-left:12px}tld-menu-icon{margin-right:10px}.profile-arrow{position:absolute;right:3px;margin-right:20px}.spin{animation:spinArrow .3s forwards}:host::ng-deep button.collapse-btn .mat-mdc-button-persistent-ripple,:host::ng-deep button.toggler .mat-mdc-button-persistent-ripple{display:none}:host ::ng-deep .mobile .child-list .menu-item{padding:8px 54px!important}::ng-deep .cdk-overlay-container .profile-menu{margin:10px 0!important}::ng-deep .mat-mdc-menu-item .mat-icon{margin-right:5px!important}::ng-deep .collapsed .profile-wrapper{justify-content:center!important}::ng-deep .profile-menu a{font-weight:400!important;display:flex;align-items:center;gap:5px}::ng-deep .profile-menu a:hover{color:var(--mat-menu-item-label-text-color, var(--mat-app-on-surface))!important;text-decoration:inherit}@keyframes spinArrow{to{transform:rotate(180deg)}}\n"] }]
+        args: [{ selector: 'lib-side-nav-menu', template: "<div fxHide.gt-xs>\r\n  <div [fxHide]=\"!collapsed\" class=\"mobile-header\">\r\n    <a [libPlausibleEvent]=\"LOGOCLICK_PLAUSIBLE_EVENT\" fxFlex=\"3.125em\" [href]=\"baseUrl\" [class.no-click]=\"menuSettings?.disableLogoNavigation\"\r\n      [attr.aria-label]=\"'MENU.ARIA_LABELS.LOGO' | translate\" (click)=\"logoClick($event)\" fxLayoutAlign=\"start center\"\r\n    >\r\n      <img height=\"40\" width=\"40\" class=\"menu-logo\" [src]=\"menuLogoImage\" alt=\"logo\" />\r\n      <span class=\"menu-product-name\">\r\n        {{ productName }}\r\n      </span>\r\n    </a>\r\n\r\n    <button\r\n      mat-icon-button\r\n      class=\"toggler\"\r\n      [attr.aria-label]=\"'ARIA_LABELS.MENU_TOGGLER' | translate\"\r\n      [libPlausibleEvent]=\"collapsed ? EXPAND_PLAUSIBLE_EVENT : COLLAPSE_PLAUSIBLE_EVENT\"\r\n      (click)=\"toggleCollapse()\"\r\n    >\r\n      <mat-icon>menu</mat-icon>\r\n    </button>\r\n  </div>\r\n</div>\r\n\r\n<div [ngClass.lt-sm]=\"'mobile'\" class=\"menu-container\" [style.width]=\"sideNavWidth\" fxLayout=\"column\" [class.collapsed]=\"collapsed\">\r\n  <div class=\"content\" fxLayout=\"column\" fxFlexFill>\r\n    <div class=\"menu-container-header\" fxLayout=\"row\" [fxLayoutAlign]=\"collapsed ? 'center center' : 'space-between center'\">\r\n      <a *ngIf=\"!collapsed\" [libPlausibleEvent]=\"LOGOCLICK_PLAUSIBLE_EVENT\" fxFlex=\"3.125em\" [class.no-click]=\"menuSettings?.disableLogoNavigation\" [href]=\"baseUrl\"\r\n        [attr.aria-label]=\"'MENU.ARIA_LABELS.LOGO' | translate\" (click)=\"logoClick($event)\" fxLayoutAlign=\"start center\"\r\n      >\r\n        <img height=\"40\" width=\"40\" class=\"menu-logo\" [src]=\"menuLogoImage\" alt=\"logo\" />\r\n        <span class=\"menu-product-name\">\r\n          {{ productName }}\r\n        </span>\r\n      </a>\r\n\r\n      <button\r\n        mat-icon-button\r\n        class=\"toggler\"\r\n        [attr.aria-label]=\"'ARIA_LABELS.MENU_TOGGLER' | translate\"\r\n        [libPlausibleEvent]=\"collapsed ? EXPAND_PLAUSIBLE_EVENT : COLLAPSE_PLAUSIBLE_EVENT\"\r\n        [matTooltip]=\"(collapsed ? 'MENU.EXPAND' : 'MENU.COLLAPSE') | translate\"\r\n        (click)=\"toggleCollapse()\"\r\n      >\r\n        <mat-icon fxHide.gt-xs>close</mat-icon>\r\n        <mat-icon fxHide.lt-sm>{{ collapsed ? 'keyboard_double_arrow_right' : 'keyboard_double_arrow_left' }}</mat-icon>\r\n      </button>\r\n    </div>\r\n\r\n    <div class=\"menu-wrapper\" fxLayout=\"column\">\r\n      <menu-columns (toggleCollapseEvent)=\"toggleCollapse()\" [direction]=\"direction\" role=\"navigation\" [isOpen]=\"!collapsed\"\r\n        [active]=\"active\"></menu-columns>\r\n    </div>\r\n\r\n  <div class=\"profile\">\r\n    <button #state=\"matMenuTrigger\" [matMenuTriggerFor]=\"menu\" class=\"profile-wrapper\">\r\n      <div class=\"profile-icon\">\r\n        @if (userInitials) {\r\n          {{userInitials}}\r\n        } @else {\r\n          <mat-icon>person</mat-icon>\r\n        }\r\n    </div>\r\n\r\n      <ng-container *ngIf=\"!collapsed\">\r\n        <span class=\"profile-name\">\r\n          {{ username ?? 'MENU.ANONYMOUS' | translate }}\r\n        </span>\r\n\r\n        <mat-icon *ngIf=\"state.menuOpen; else iconDown\" class=\"profile-arrow spin\">{{\"keyboard_arrow_down\"}}</mat-icon>\r\n\r\n        <ng-template #iconDown>\r\n          <mat-icon class=\"profile-arrow spin\">{{\"keyboard_arrow_up\" }}</mat-icon>\r\n        </ng-template>\r\n      </ng-container>\r\n    </button>\r\n\r\n    <mat-menu #menu=\"matMenu\" class=\"profile-menu\">\r\n      @for (item of menuSettings.userOptions; track item.label) {\r\n        @if (item.link) {\r\n          @if (item.link.isExternal) {\r\n            <a class=\"mat-mdc-menu-item\" [href]=\"item.link.href\" target=\"_blank\" (click)=\"linkCallback(item.link)\">\r\n              <ng-container\r\n                *ngTemplateOutlet=\"profileMenuItem; context: { icon: item.icon, label: item.label }\">\r\n              </ng-container>\r\n            </a>\r\n          } @else {\r\n            <a class=\"mat-mdc-menu-item\" [routerLink]=\"item.link.href\" (click)=\"linkCallback(item.link)\">\r\n              <ng-container\r\n                *ngTemplateOutlet=\"profileMenuItem; context: { icon: item.icon, label: item.label }\">\r\n              </ng-container>\r\n            </a>\r\n          }\r\n        } @else {\r\n          <button\r\n            mat-menu-item\r\n            class=\"profile-option\"\r\n            (click)=\"item.button?.callback()\"\r\n        >\r\n          <ng-container\r\n            *ngTemplateOutlet=\"profileMenuItem; context: { icon: item.icon, label: item.label }\">\r\n          </ng-container>\r\n        </button>\r\n        }\r\n      }\r\n    </mat-menu>\r\n  </div>\r\n\r\n  <ng-template #profileMenuItem let-icon=\"icon\" let-label=\"label\">\r\n    @if (icon) {\r\n      @if (!icon?.isCustom) {\r\n        <span class=\"material-icons profile-option-icon\" [class.material-icons-outlined]=\"icon?.isOutlined\">\r\n          {{icon?.name}}\r\n        </span>\r\n      } @else {\r\n        <mat-icon class=\"profile-option-icon\" [svgIcon]=\"icon?.name\"></mat-icon>\r\n      }\r\n    }\r\n    {{ label | translate }}\r\n  </ng-template>\r\n</div>\r\n", styles: ["a{text-decoration:none}.no-click{pointer-events:none!important}.mobile-header{display:flex;justify-content:space-between;padding:23px 27px;background-color:#fcfcfc;border:1px solid var(--base-70)}.mobile.menu-container.collapsed{display:none!important}.mobile.menu-container:not(.collapsed){display:block!important;position:fixed;min-width:100vw;min-height:100dvh;z-index:1000}.mobile .profile-wrapper{position:relative}.mobile .profile-wrapper mat-icon{position:absolute!important;right:0}.menu-product-name{white-space:nowrap;margin-left:12px;font-weight:600;color:var(--base-10)}.menu-container{max-height:100dvh;white-space:nowrap;height:100%;transition:width .2s ease;min-height:100dvh;overflow:auto;background:var(--base-100);border-right:2px solid var(--base-95)}.menu-container .menu-container-header{margin:24px 0;max-height:40px}.menu-container.collapsed .menu-container-header{margin:24px 0 32px!important}.menu-container .content:not(.collapsed){overflow-x:hidden;padding:0 12px}.menu-container .content:not(.collapsed) .menu-logo{margin-left:16px;max-width:100%}.menu-container .divider{width:100%}.menu-container .profile{position:relative;height:100%;margin-top:100px}.menu-container .profile-wrapper{background:none;color:var(--base-30);display:flex;align-items:center;justify-content:start;width:100%;position:absolute;bottom:0;margin:32px 16px}.menu-container .profile-icon{display:flex;justify-content:center;align-items:center;min-width:40px;height:40px;border-radius:100%;color:var(--base-0);background-color:var(--base-70);font-size:16px;font-weight:600}.menu-container .profile-name{max-width:145px;overflow:hidden;margin-left:12px;text-overflow:ellipsis}.collapsed .profile-wrapper{margin:36px 0!important}.mobile .profile-name{max-width:60vw}.profile-option-icon{vertical-align:middle;margin:0 5px 5px 0}:host ::ng-deep .menu-item{display:flex;padding:16px!important;border-radius:4px!important}:host ::ng-deep .child-list .menu-item{padding:8px 46px!important}:host ::ng-deep .collapsed .menu-item{padding:0!important;width:40px;height:40px;border-radius:50%!important}:host ::ng-deep .active-menu-item{background-color:var(--base-95)!important}:host ::ng-deep .menu-item-title{margin-left:12px}tld-menu-icon{margin-right:10px}.profile-arrow{position:absolute;right:3px;margin-right:20px}.spin{animation:spinArrow .3s forwards}:host::ng-deep button.collapse-btn .mat-mdc-button-persistent-ripple,:host::ng-deep button.toggler .mat-mdc-button-persistent-ripple{display:none}:host ::ng-deep .mobile .child-list .menu-item{padding:8px 54px!important}::ng-deep .cdk-overlay-container .profile-menu{margin:10px 0!important}::ng-deep .mat-mdc-menu-item .mat-icon{margin-right:5px!important}::ng-deep .collapsed .profile-wrapper{justify-content:center!important}::ng-deep .profile-menu a{font-weight:400!important;display:flex;align-items:center;gap:5px}::ng-deep .profile-menu a:hover{color:var(--mat-menu-item-label-text-color, var(--mat-app-on-surface))!important;text-decoration:inherit}@keyframes spinArrow{to{transform:rotate(180deg)}}\n"] }]
     }], () => [{ type: i1.StrapiLinkService }, { type: i2.DOMService }, { type: MenuItemsService }], { username: [{
             type: Input
         }], menuSettings: [{
@@ -1264,50 +1270,54 @@ class MenuModule {
  */
 const USER_MENU_OPTIONS = {
     subscription: (href, callback) => ({
-        icon: { name: "credit_card" },
+        icon: { name: 'credit_card' },
         label: 'MENU.SUBSCRIPTION',
-        link: { href: href, callback }
+        link: { href: href, callback },
     }),
     termsOfUse: (href, callback) => ({
-        icon: { name: "text_snippet" },
+        icon: { name: 'text_snippet' },
         label: 'MENU.TERMS_OF_USE',
-        link: { href, isExternal: true, callback }
+        link: { href, isExternal: true, callback },
     }),
     privacy: (href, callback) => ({
-        icon: { name: "gpp_maybe" },
+        icon: { name: 'gpp_maybe' },
         label: 'MENU.PRIVACY',
         link: { href, isExternal: true, callback },
     }),
-    help: (href, callback) => ({
+    help: (href, icon, callback) => ({
         label: 'MENU.HELP_CENTER',
-        icon: { name: `help` },
-        link: { href, isExternal: true, callback }
+        icon: { name: icon ? icon.name : `help`, isCustom: icon ? icon.isCustom : false },
+        link: { href, isExternal: true, callback },
     }),
     contactUs: (href, callback) => ({
         label: 'MENU.CONTACT_US',
         icon: { name: `mail` },
-        link: { href, isExternal: true, callback }
+        link: { href, isExternal: true, callback },
     }),
     /** use language update callback to save in localstorage */
     changeLanguage: (dialog, languages, languageChangeCallback) => ({
         label: 'MENU.CHANGE_LANGUAGE',
-        icon: { name: "language" },
+        icon: { name: 'language' },
         button: {
             callback: () => {
-                dialog.open(SelectLanguageDialogComponent, { data: { languages: languages } })
-                    .afterClosed().subscribe((language) => {
+                dialog
+                    .open(SelectLanguageDialogComponent, {
+                    data: { languages: languages },
+                })
+                    .afterClosed()
+                    .subscribe((language) => {
                     if (language && languageChangeCallback) {
                         languageChangeCallback(language);
                     }
                 });
-            }
-        }
+            },
+        },
     }),
     logout: (callback) => ({
-        icon: { name: "logout" },
+        icon: { name: 'logout' },
         label: 'MENU.LOG_OUT',
-        button: { callback: () => callback() }
-    })
+        button: { callback: () => callback() },
+    }),
 };
 
 /*