@tilde-nlp/ngx-menu 8.1.58 → 8.1.59
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/tilde-nlp-ngx-menu.mjs +130 -120
- package/fesm2022/tilde-nlp-ngx-menu.mjs.map +1 -1
- package/index.d.ts +2 -0
- package/package.json +1 -1
|
@@ -197,6 +197,7 @@ class MenuItemsService {
|
|
|
197
197
|
this.config = config;
|
|
198
198
|
this.strapiService = strapiService;
|
|
199
199
|
this._activeElements = new BehaviorSubject({});
|
|
200
|
+
this.isMenuLoaded = signal(false, ...(ngDevMode ? [{ debugName: "isMenuLoaded" }] : []));
|
|
200
201
|
this.strapiItems = [];
|
|
201
202
|
this.isActiveMatchOptions = {
|
|
202
203
|
matrixParams: 'exact',
|
|
@@ -282,6 +283,7 @@ class MenuItemsService {
|
|
|
282
283
|
allItems.forEach((array) => { newArray = newArray.concat(array); });
|
|
283
284
|
this._allRootItems = newArray;
|
|
284
285
|
this.updateActive();
|
|
286
|
+
this.isMenuLoaded.set(true);
|
|
285
287
|
}
|
|
286
288
|
isElementCustomIdActive(element) {
|
|
287
289
|
return this.customId && element.customId === this.customId;
|
|
@@ -340,17 +342,17 @@ class NavBaseComponent {
|
|
|
340
342
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(NavBaseComponent, { className: "NavBaseComponent", filePath: "lib/components/nav-base/nav-base.component.ts", lineNumber: 14 }); })();
|
|
341
343
|
|
|
342
344
|
const _c0$3 = ["*"];
|
|
343
|
-
function
|
|
344
|
-
const
|
|
345
|
+
function SideNavMenuComponent_Conditional_0_a_15_Template(rf, ctx) { if (rf & 1) {
|
|
346
|
+
const _r3 = i0.ɵɵgetCurrentView();
|
|
345
347
|
i0.ɵɵelementStart(0, "a", 1);
|
|
346
348
|
i0.ɵɵpipe(1, "translate");
|
|
347
|
-
i0.ɵɵlistener("click", function
|
|
349
|
+
i0.ɵɵlistener("click", function SideNavMenuComponent_Conditional_0_a_15_Template_a_click_0_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.logoClick($event)); });
|
|
348
350
|
i0.ɵɵelement(2, "img", 2);
|
|
349
351
|
i0.ɵɵelementStart(3, "span", 3);
|
|
350
352
|
i0.ɵɵtext(4);
|
|
351
353
|
i0.ɵɵelementEnd()();
|
|
352
354
|
} if (rf & 2) {
|
|
353
|
-
const ctx_r1 = i0.ɵɵnextContext();
|
|
355
|
+
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
354
356
|
i0.ɵɵclassProp("no-click", ctx_r1.menuSettings == null ? null : ctx_r1.menuSettings.disableLogoNavigation);
|
|
355
357
|
i0.ɵɵproperty("libPlausibleEvent", ctx_r1.LOGOCLICK_PLAUSIBLE_EVENT)("href", ctx_r1.baseUrl, i0.ɵɵsanitizeUrl);
|
|
356
358
|
i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(1, 7, "ARIA_LABELS.LOGO"));
|
|
@@ -359,54 +361,147 @@ function SideNavMenuComponent_a_15_Template(rf, ctx) { if (rf & 1) {
|
|
|
359
361
|
i0.ɵɵadvance(2);
|
|
360
362
|
i0.ɵɵtextInterpolate1(" ", ctx_r1.strapiMenuTitle() ?? ctx_r1.productName, " ");
|
|
361
363
|
} }
|
|
362
|
-
function
|
|
364
|
+
function SideNavMenuComponent_Conditional_0_Conditional_26_Template(rf, ctx) { if (rf & 1) {
|
|
363
365
|
i0.ɵɵelement(0, "lib-menu-accessibility", 15);
|
|
364
366
|
} if (rf & 2) {
|
|
365
|
-
const ctx_r1 = i0.ɵɵnextContext();
|
|
367
|
+
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
366
368
|
i0.ɵɵproperty("isCollapsed", ctx_r1.collapsed)("baseUrl", ctx_r1.baseUrl);
|
|
367
369
|
} }
|
|
368
|
-
function
|
|
369
|
-
const
|
|
370
|
+
function SideNavMenuComponent_Conditional_0_Conditional_27_Template(rf, ctx) { if (rf & 1) {
|
|
371
|
+
const _r4 = i0.ɵɵgetCurrentView();
|
|
370
372
|
i0.ɵɵelementStart(0, "lib-menu-lang-switcher", 20);
|
|
371
|
-
i0.ɵɵlistener("changeLanguageEvent", function
|
|
373
|
+
i0.ɵɵlistener("changeLanguageEvent", function SideNavMenuComponent_Conditional_0_Conditional_27_Template_lib_menu_lang_switcher_changeLanguageEvent_0_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.changeLanguage($event)); });
|
|
372
374
|
i0.ɵɵelementEnd();
|
|
373
375
|
} if (rf & 2) {
|
|
374
|
-
const ctx_r1 = i0.ɵɵnextContext();
|
|
376
|
+
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
375
377
|
i0.ɵɵproperty("isCollapsed", ctx_r1.collapsed)("languages", ctx_r1.supportedLanguages);
|
|
376
378
|
} }
|
|
377
|
-
function
|
|
379
|
+
function SideNavMenuComponent_Conditional_0_Conditional_31_Conditional_1_For_1_Conditional_2_Template(rf, ctx) { if (rf & 1) {
|
|
378
380
|
i0.ɵɵtext(0, " \u00A0\u00A0|\u00A0\u00A0 ");
|
|
379
381
|
} }
|
|
380
|
-
function
|
|
382
|
+
function SideNavMenuComponent_Conditional_0_Conditional_31_Conditional_1_For_1_Template(rf, ctx) { if (rf & 1) {
|
|
381
383
|
i0.ɵɵelementStart(0, "a", 21);
|
|
382
384
|
i0.ɵɵtext(1);
|
|
383
385
|
i0.ɵɵelementEnd();
|
|
384
|
-
i0.ɵɵconditionalCreate(2,
|
|
386
|
+
i0.ɵɵconditionalCreate(2, SideNavMenuComponent_Conditional_0_Conditional_31_Conditional_1_For_1_Conditional_2_Template, 1, 0);
|
|
385
387
|
} if (rf & 2) {
|
|
386
|
-
const
|
|
387
|
-
const ɵ$
|
|
388
|
-
const ctx_r1 = i0.ɵɵnextContext(
|
|
389
|
-
i0.ɵɵproperty("href",
|
|
388
|
+
const item_r5 = ctx.$implicit;
|
|
389
|
+
const ɵ$index_68_r6 = ctx.$index;
|
|
390
|
+
const ctx_r1 = i0.ɵɵnextContext(4);
|
|
391
|
+
i0.ɵɵproperty("href", item_r5.link, i0.ɵɵsanitizeUrl);
|
|
390
392
|
i0.ɵɵadvance();
|
|
391
|
-
i0.ɵɵtextInterpolate(
|
|
393
|
+
i0.ɵɵtextInterpolate(item_r5.title);
|
|
392
394
|
i0.ɵɵadvance();
|
|
393
|
-
i0.ɵɵconditional(ɵ$
|
|
395
|
+
i0.ɵɵconditional(ɵ$index_68_r6 !== ctx_r1.footerItems.length - 1 ? 2 : -1);
|
|
394
396
|
} }
|
|
395
|
-
function
|
|
396
|
-
i0.ɵɵrepeaterCreate(0,
|
|
397
|
+
function SideNavMenuComponent_Conditional_0_Conditional_31_Conditional_1_Template(rf, ctx) { if (rf & 1) {
|
|
398
|
+
i0.ɵɵrepeaterCreate(0, SideNavMenuComponent_Conditional_0_Conditional_31_Conditional_1_For_1_Template, 3, 3, null, null, i0.ɵɵrepeaterTrackByIndex);
|
|
397
399
|
} if (rf & 2) {
|
|
398
|
-
const ctx_r1 = i0.ɵɵnextContext(
|
|
400
|
+
const ctx_r1 = i0.ɵɵnextContext(3);
|
|
399
401
|
i0.ɵɵrepeater(ctx_r1.footerItems);
|
|
400
402
|
} }
|
|
401
|
-
function
|
|
403
|
+
function SideNavMenuComponent_Conditional_0_Conditional_31_Template(rf, ctx) { if (rf & 1) {
|
|
402
404
|
i0.ɵɵelementStart(0, "div", 19);
|
|
403
|
-
i0.ɵɵconditionalCreate(1,
|
|
405
|
+
i0.ɵɵconditionalCreate(1, SideNavMenuComponent_Conditional_0_Conditional_31_Conditional_1_Template, 2, 0);
|
|
404
406
|
i0.ɵɵelementEnd();
|
|
405
407
|
} if (rf & 2) {
|
|
406
|
-
const ctx_r1 = i0.ɵɵnextContext();
|
|
408
|
+
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
407
409
|
i0.ɵɵadvance();
|
|
408
410
|
i0.ɵɵconditional(!ctx_r1.collapsed ? 1 : -1);
|
|
409
411
|
} }
|
|
412
|
+
function SideNavMenuComponent_Conditional_0_Template(rf, ctx) { if (rf & 1) {
|
|
413
|
+
const _r1 = i0.ɵɵgetCurrentView();
|
|
414
|
+
i0.ɵɵelementStart(0, "div", 0)(1, "a", 1);
|
|
415
|
+
i0.ɵɵpipe(2, "translate");
|
|
416
|
+
i0.ɵɵlistener("click", function SideNavMenuComponent_Conditional_0_Template_a_click_1_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.logoClick($event)); });
|
|
417
|
+
i0.ɵɵelement(3, "img", 2);
|
|
418
|
+
i0.ɵɵelementStart(4, "span", 3);
|
|
419
|
+
i0.ɵɵtext(5);
|
|
420
|
+
i0.ɵɵelementEnd()();
|
|
421
|
+
i0.ɵɵelementStart(6, "button", 4);
|
|
422
|
+
i0.ɵɵpipe(7, "translate");
|
|
423
|
+
i0.ɵɵlistener("click", function SideNavMenuComponent_Conditional_0_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.toggleCollapse()); });
|
|
424
|
+
i0.ɵɵelementStart(8, "mat-icon", 5);
|
|
425
|
+
i0.ɵɵtext(9);
|
|
426
|
+
i0.ɵɵelementEnd();
|
|
427
|
+
i0.ɵɵelementStart(10, "mat-icon", 6);
|
|
428
|
+
i0.ɵɵtext(11);
|
|
429
|
+
i0.ɵɵelementEnd()()();
|
|
430
|
+
i0.ɵɵelementStart(12, "div", 7)(13, "div", 8)(14, "div", 9);
|
|
431
|
+
i0.ɵɵtemplate(15, SideNavMenuComponent_Conditional_0_a_15_Template, 5, 9, "a", 10);
|
|
432
|
+
i0.ɵɵelementStart(16, "button", 11);
|
|
433
|
+
i0.ɵɵpipe(17, "translate");
|
|
434
|
+
i0.ɵɵpipe(18, "translate");
|
|
435
|
+
i0.ɵɵlistener("click", function SideNavMenuComponent_Conditional_0_Template_button_click_16_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.toggleCollapse()); });
|
|
436
|
+
i0.ɵɵelementStart(19, "mat-icon", 5);
|
|
437
|
+
i0.ɵɵtext(20);
|
|
438
|
+
i0.ɵɵelementEnd();
|
|
439
|
+
i0.ɵɵelementStart(21, "mat-icon", 6);
|
|
440
|
+
i0.ɵɵtext(22);
|
|
441
|
+
i0.ɵɵelementEnd()()();
|
|
442
|
+
i0.ɵɵelementStart(23, "div", 12)(24, "menu-columns", 13);
|
|
443
|
+
i0.ɵɵlistener("toggleCollapseEvent", function SideNavMenuComponent_Conditional_0_Template_menu_columns_toggleCollapseEvent_24_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.toggleCollapse()); });
|
|
444
|
+
i0.ɵɵelementEnd();
|
|
445
|
+
i0.ɵɵelement(25, "div", 14);
|
|
446
|
+
i0.ɵɵconditionalCreate(26, SideNavMenuComponent_Conditional_0_Conditional_26_Template, 1, 2, "lib-menu-accessibility", 15);
|
|
447
|
+
i0.ɵɵconditionalCreate(27, SideNavMenuComponent_Conditional_0_Conditional_27_Template, 1, 2, "lib-menu-lang-switcher", 16);
|
|
448
|
+
i0.ɵɵelementEnd();
|
|
449
|
+
i0.ɵɵelementStart(28, "div", 17);
|
|
450
|
+
i0.ɵɵprojection(29);
|
|
451
|
+
i0.ɵɵelementEnd();
|
|
452
|
+
i0.ɵɵelementStart(30, "lib-menu-profile", 18);
|
|
453
|
+
i0.ɵɵlistener("linkCallbackEvent", function SideNavMenuComponent_Conditional_0_Template_lib_menu_profile_linkCallbackEvent_30_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.linkCallback($event)); })("loginEvent", function SideNavMenuComponent_Conditional_0_Template_lib_menu_profile_loginEvent_30_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.login()); });
|
|
454
|
+
i0.ɵɵelementEnd();
|
|
455
|
+
i0.ɵɵconditionalCreate(31, SideNavMenuComponent_Conditional_0_Conditional_31_Template, 2, 1, "div", 19);
|
|
456
|
+
i0.ɵɵelementEnd()();
|
|
457
|
+
} if (rf & 2) {
|
|
458
|
+
const ctx_r1 = i0.ɵɵnextContext();
|
|
459
|
+
i0.ɵɵproperty("fxHide", !ctx_r1.collapsed || ctx_r1.collapsed && !ctx_r1.isMobileRes && !ctx_r1.isViewIncreased())("ngClass", ctx_r1.menuSettings.menuVersion);
|
|
460
|
+
i0.ɵɵadvance();
|
|
461
|
+
i0.ɵɵclassProp("no-click", ctx_r1.menuSettings == null ? null : ctx_r1.menuSettings.disableLogoNavigation);
|
|
462
|
+
i0.ɵɵproperty("libPlausibleEvent", ctx_r1.LOGOCLICK_PLAUSIBLE_EVENT)("href", ctx_r1.baseUrl, i0.ɵɵsanitizeUrl);
|
|
463
|
+
i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(2, 42, "ARIA_LABELS.LOGO"));
|
|
464
|
+
i0.ɵɵadvance(2);
|
|
465
|
+
i0.ɵɵproperty("src", ctx_r1.logoImageSource(), i0.ɵɵsanitizeUrl);
|
|
466
|
+
i0.ɵɵadvance(2);
|
|
467
|
+
i0.ɵɵtextInterpolate1(" ", ctx_r1.strapiMenuTitle() ?? ctx_r1.productName, " ");
|
|
468
|
+
i0.ɵɵadvance();
|
|
469
|
+
i0.ɵɵproperty("libPlausibleEvent", ctx_r1.collapsed ? ctx_r1.EXPAND_PLAUSIBLE_EVENT : ctx_r1.COLLAPSE_PLAUSIBLE_EVENT);
|
|
470
|
+
i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(7, 44, "ARIA_LABELS.MENU_TOGGLER"));
|
|
471
|
+
i0.ɵɵadvance(2);
|
|
472
|
+
i0.ɵɵproperty("ngClass.lt-sm", "mob-close-icon");
|
|
473
|
+
i0.ɵɵadvance();
|
|
474
|
+
i0.ɵɵtextInterpolate(ctx_r1.collapsed ? ctx_r1.customIcons.customMobileOpenIcon : ctx_r1.customIcons.customMobileCloseIcon);
|
|
475
|
+
i0.ɵɵadvance(2);
|
|
476
|
+
i0.ɵɵtextInterpolate(ctx_r1.collapsed ? ctx_r1.customIcons.customOpenIcon : ctx_r1.customIcons.customCloseIcon);
|
|
477
|
+
i0.ɵɵadvance();
|
|
478
|
+
i0.ɵɵstyleProp("width", ctx_r1.sideNavWidth);
|
|
479
|
+
i0.ɵɵclassProp("accessibility-view", ctx_r1.isViewIncreased())("collapsed", ctx_r1.collapsed);
|
|
480
|
+
i0.ɵɵproperty("ngClass.lt-sm", "mobile")("ngClass", ctx_r1.menuSettings.menuVersion);
|
|
481
|
+
i0.ɵɵadvance(2);
|
|
482
|
+
i0.ɵɵproperty("fxLayoutAlign", ctx_r1.collapsed ? "center center" : "space-between center");
|
|
483
|
+
i0.ɵɵadvance();
|
|
484
|
+
i0.ɵɵproperty("ngIf", !ctx_r1.collapsed);
|
|
485
|
+
i0.ɵɵadvance();
|
|
486
|
+
i0.ɵɵproperty("libPlausibleEvent", ctx_r1.collapsed ? ctx_r1.EXPAND_PLAUSIBLE_EVENT : ctx_r1.COLLAPSE_PLAUSIBLE_EVENT)("matTooltip", i0.ɵɵpipeBind1(17, 46, ctx_r1.collapsed ? "MENU.EXPAND" : "MENU.COLLAPSE"));
|
|
487
|
+
i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(18, 48, "ARIA_LABELS.MENU_TOGGLER"));
|
|
488
|
+
i0.ɵɵadvance(3);
|
|
489
|
+
i0.ɵɵproperty("ngClass.lt-sm", "mob-close-icon");
|
|
490
|
+
i0.ɵɵadvance();
|
|
491
|
+
i0.ɵɵtextInterpolate(ctx_r1.customIcons.customMobileCloseIcon);
|
|
492
|
+
i0.ɵɵadvance(2);
|
|
493
|
+
i0.ɵɵtextInterpolate(ctx_r1.collapsed ? ctx_r1.customIcons.customOpenIcon : ctx_r1.customIcons.customCloseIcon);
|
|
494
|
+
i0.ɵɵadvance(2);
|
|
495
|
+
i0.ɵɵproperty("direction", ctx_r1.direction)("isOpen", !ctx_r1.collapsed)("active", ctx_r1.active)("expandableMenuChildren", ctx_r1.menuSettings == null ? null : ctx_r1.menuSettings.expandableMenuChildren)("openExternalLinksInSameTab", ctx_r1.menuSettings == null ? null : ctx_r1.menuSettings.openExternalLinksInSameTab);
|
|
496
|
+
i0.ɵɵadvance(2);
|
|
497
|
+
i0.ɵɵconditional((ctx_r1.menuSettings == null ? null : ctx_r1.menuSettings.showAccessibility) ? 26 : -1);
|
|
498
|
+
i0.ɵɵadvance();
|
|
499
|
+
i0.ɵɵconditional(ctx_r1.useDefaultLanguageSwitcher && ctx_r1.supportedLanguages && ctx_r1.supportedLanguages.length > 1 ? 27 : -1);
|
|
500
|
+
i0.ɵɵadvance(3);
|
|
501
|
+
i0.ɵɵproperty("userOptions", ctx_r1.userOptions())("username", ctx_r1.username)("collapsed", ctx_r1.collapsed)("useLargeLoginButton", ctx_r1.menuSettings == null ? null : ctx_r1.menuSettings.useLargeLoginButton);
|
|
502
|
+
i0.ɵɵadvance();
|
|
503
|
+
i0.ɵɵconditional((ctx_r1.footerItems == null ? null : ctx_r1.footerItems.length) ? 31 : -1);
|
|
504
|
+
} }
|
|
410
505
|
class SideNavMenuComponent extends NavBaseComponent {
|
|
411
506
|
#username;
|
|
412
507
|
get username() {
|
|
@@ -468,6 +563,7 @@ class SideNavMenuComponent extends NavBaseComponent {
|
|
|
468
563
|
eventId: this.COLLAPSE_PLAUSIBLE_EVENT_ID,
|
|
469
564
|
properties: [{ key: this.COLLAPSE_PLAUSIBLE_ACTION_KEY, value: 'collapse' }],
|
|
470
565
|
};
|
|
566
|
+
this.isMenuReady = computed(() => this.menuItems.isMenuLoaded(), ...(ngDevMode ? [{ debugName: "isMenuReady" }] : []));
|
|
471
567
|
this.userOptions = computed(() => {
|
|
472
568
|
const strapiItems = this.menuItemsService.strapiMenu()?.profileItems ?? [];
|
|
473
569
|
const mappedStrapiItems = strapiItems.map((item) => ({
|
|
@@ -562,102 +658,16 @@ class SideNavMenuComponent extends NavBaseComponent {
|
|
|
562
658
|
return this.menuItems.menuSharedConfig.permissions?.includes(permission) ?? false;
|
|
563
659
|
}
|
|
564
660
|
static { this.ɵfac = function SideNavMenuComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SideNavMenuComponent)(i0.ɵɵdirectiveInject(i1.StrapiLinkService), i0.ɵɵdirectiveInject(i2.DOMService), i0.ɵɵdirectiveInject(MenuItemsService), i0.ɵɵdirectiveInject(i2.AccessibilityService)); }; }
|
|
565
|
-
static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SideNavMenuComponent, selectors: [["lib-side-nav-menu"]], inputs: { username: "username", menuSettings: "menuSettings", productName: "productName", supportedLanguages: "supportedLanguages", useDefaultLanguageSwitcher: "useDefaultLanguageSwitcher" }, outputs: { changeLanguageEvent: "changeLanguageEvent", loginEvent: "loginEvent" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], ngContentSelectors: _c0$3, decls:
|
|
661
|
+
static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SideNavMenuComponent, selectors: [["lib-side-nav-menu"]], inputs: { username: "username", menuSettings: "menuSettings", productName: "productName", supportedLanguages: "supportedLanguages", useDefaultLanguageSwitcher: "useDefaultLanguageSwitcher" }, outputs: { changeLanguageEvent: "changeLanguageEvent", loginEvent: "loginEvent" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], ngContentSelectors: _c0$3, decls: 1, vars: 1, consts: [[1, "mobile-header", 3, "fxHide", "ngClass"], ["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"], ["fxHide.gt-xs", "", 3, "ngClass.lt-sm"], ["fxHide.lt-sm", ""], ["fxLayout", "column", 1, "menu-container", 3, "ngClass.lt-sm", "ngClass"], ["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"], ["fxLayout", "column", 1, "menu-wrapper"], ["role", "navigation", 3, "toggleCollapseEvent", "direction", "isOpen", "active", "expandableMenuChildren", "openExternalLinksInSameTab"], ["fxHide.gt-xs", "", 1, "menu-divider"], [3, "isCollapsed", "baseUrl"], [3, "isCollapsed", "languages"], ["fxFlex", "", "fxLayout", "column"], [3, "linkCallbackEvent", "loginEvent", "userOptions", "username", "collapsed", "useLargeLoginButton"], [1, "menu-footer"], [3, "changeLanguageEvent", "isCollapsed", "languages"], ["target", "_blank", 3, "href"]], template: function SideNavMenuComponent_Template(rf, ctx) { if (rf & 1) {
|
|
566
662
|
i0.ɵɵprojectionDef();
|
|
567
|
-
i0.ɵɵ
|
|
568
|
-
i0.ɵɵpipe(2, "translate");
|
|
569
|
-
i0.ɵɵlistener("click", function SideNavMenuComponent_Template_a_click_1_listener($event) { return ctx.logoClick($event); });
|
|
570
|
-
i0.ɵɵelement(3, "img", 2);
|
|
571
|
-
i0.ɵɵelementStart(4, "span", 3);
|
|
572
|
-
i0.ɵɵtext(5);
|
|
573
|
-
i0.ɵɵelementEnd()();
|
|
574
|
-
i0.ɵɵelementStart(6, "button", 4);
|
|
575
|
-
i0.ɵɵpipe(7, "translate");
|
|
576
|
-
i0.ɵɵlistener("click", function SideNavMenuComponent_Template_button_click_6_listener() { return ctx.toggleCollapse(); });
|
|
577
|
-
i0.ɵɵelementStart(8, "mat-icon", 5);
|
|
578
|
-
i0.ɵɵtext(9);
|
|
579
|
-
i0.ɵɵelementEnd();
|
|
580
|
-
i0.ɵɵelementStart(10, "mat-icon", 6);
|
|
581
|
-
i0.ɵɵtext(11);
|
|
582
|
-
i0.ɵɵelementEnd()()();
|
|
583
|
-
i0.ɵɵelementStart(12, "div", 7)(13, "div", 8)(14, "div", 9);
|
|
584
|
-
i0.ɵɵtemplate(15, SideNavMenuComponent_a_15_Template, 5, 9, "a", 10);
|
|
585
|
-
i0.ɵɵelementStart(16, "button", 11);
|
|
586
|
-
i0.ɵɵpipe(17, "translate");
|
|
587
|
-
i0.ɵɵpipe(18, "translate");
|
|
588
|
-
i0.ɵɵlistener("click", function SideNavMenuComponent_Template_button_click_16_listener() { return ctx.toggleCollapse(); });
|
|
589
|
-
i0.ɵɵelementStart(19, "mat-icon", 5);
|
|
590
|
-
i0.ɵɵtext(20);
|
|
591
|
-
i0.ɵɵelementEnd();
|
|
592
|
-
i0.ɵɵelementStart(21, "mat-icon", 6);
|
|
593
|
-
i0.ɵɵtext(22);
|
|
594
|
-
i0.ɵɵelementEnd()()();
|
|
595
|
-
i0.ɵɵelementStart(23, "div", 12)(24, "menu-columns", 13);
|
|
596
|
-
i0.ɵɵlistener("toggleCollapseEvent", function SideNavMenuComponent_Template_menu_columns_toggleCollapseEvent_24_listener() { return ctx.toggleCollapse(); });
|
|
597
|
-
i0.ɵɵelementEnd();
|
|
598
|
-
i0.ɵɵelement(25, "div", 14);
|
|
599
|
-
i0.ɵɵconditionalCreate(26, SideNavMenuComponent_Conditional_26_Template, 1, 2, "lib-menu-accessibility", 15);
|
|
600
|
-
i0.ɵɵconditionalCreate(27, SideNavMenuComponent_Conditional_27_Template, 1, 2, "lib-menu-lang-switcher", 16);
|
|
601
|
-
i0.ɵɵelementEnd();
|
|
602
|
-
i0.ɵɵelementStart(28, "div", 17);
|
|
603
|
-
i0.ɵɵprojection(29);
|
|
604
|
-
i0.ɵɵelementEnd();
|
|
605
|
-
i0.ɵɵelementStart(30, "lib-menu-profile", 18);
|
|
606
|
-
i0.ɵɵlistener("linkCallbackEvent", function SideNavMenuComponent_Template_lib_menu_profile_linkCallbackEvent_30_listener($event) { return ctx.linkCallback($event); })("loginEvent", function SideNavMenuComponent_Template_lib_menu_profile_loginEvent_30_listener() { return ctx.login(); });
|
|
607
|
-
i0.ɵɵelementEnd();
|
|
608
|
-
i0.ɵɵconditionalCreate(31, SideNavMenuComponent_Conditional_31_Template, 2, 1, "div", 19);
|
|
609
|
-
i0.ɵɵelementEnd()();
|
|
663
|
+
i0.ɵɵconditionalCreate(0, SideNavMenuComponent_Conditional_0_Template, 32, 50);
|
|
610
664
|
} if (rf & 2) {
|
|
611
|
-
i0.ɵɵ
|
|
612
|
-
|
|
613
|
-
i0.ɵɵclassProp("no-click", ctx.menuSettings == null ? null : ctx.menuSettings.disableLogoNavigation);
|
|
614
|
-
i0.ɵɵproperty("libPlausibleEvent", ctx.LOGOCLICK_PLAUSIBLE_EVENT)("href", ctx.baseUrl, i0.ɵɵsanitizeUrl);
|
|
615
|
-
i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(2, 42, "ARIA_LABELS.LOGO"));
|
|
616
|
-
i0.ɵɵadvance(2);
|
|
617
|
-
i0.ɵɵproperty("src", ctx.logoImageSource(), i0.ɵɵsanitizeUrl);
|
|
618
|
-
i0.ɵɵadvance(2);
|
|
619
|
-
i0.ɵɵtextInterpolate1(" ", ctx.strapiMenuTitle() ?? ctx.productName, " ");
|
|
620
|
-
i0.ɵɵadvance();
|
|
621
|
-
i0.ɵɵproperty("libPlausibleEvent", ctx.collapsed ? ctx.EXPAND_PLAUSIBLE_EVENT : ctx.COLLAPSE_PLAUSIBLE_EVENT);
|
|
622
|
-
i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(7, 44, "ARIA_LABELS.MENU_TOGGLER"));
|
|
623
|
-
i0.ɵɵadvance(2);
|
|
624
|
-
i0.ɵɵproperty("ngClass.lt-sm", "mob-close-icon");
|
|
625
|
-
i0.ɵɵadvance();
|
|
626
|
-
i0.ɵɵtextInterpolate(ctx.collapsed ? ctx.customIcons.customMobileOpenIcon : ctx.customIcons.customMobileCloseIcon);
|
|
627
|
-
i0.ɵɵadvance(2);
|
|
628
|
-
i0.ɵɵtextInterpolate(ctx.collapsed ? ctx.customIcons.customOpenIcon : ctx.customIcons.customCloseIcon);
|
|
629
|
-
i0.ɵɵadvance();
|
|
630
|
-
i0.ɵɵstyleProp("width", ctx.sideNavWidth);
|
|
631
|
-
i0.ɵɵclassProp("accessibility-view", ctx.isViewIncreased())("collapsed", ctx.collapsed);
|
|
632
|
-
i0.ɵɵproperty("ngClass.lt-sm", "mobile")("ngClass", ctx.menuSettings.menuVersion);
|
|
633
|
-
i0.ɵɵadvance(2);
|
|
634
|
-
i0.ɵɵproperty("fxLayoutAlign", ctx.collapsed ? "center center" : "space-between center");
|
|
635
|
-
i0.ɵɵadvance();
|
|
636
|
-
i0.ɵɵproperty("ngIf", !ctx.collapsed);
|
|
637
|
-
i0.ɵɵadvance();
|
|
638
|
-
i0.ɵɵproperty("libPlausibleEvent", ctx.collapsed ? ctx.EXPAND_PLAUSIBLE_EVENT : ctx.COLLAPSE_PLAUSIBLE_EVENT)("matTooltip", i0.ɵɵpipeBind1(17, 46, ctx.collapsed ? "MENU.EXPAND" : "MENU.COLLAPSE"));
|
|
639
|
-
i0.ɵɵattribute("aria-label", i0.ɵɵpipeBind1(18, 48, "ARIA_LABELS.MENU_TOGGLER"));
|
|
640
|
-
i0.ɵɵadvance(3);
|
|
641
|
-
i0.ɵɵproperty("ngClass.lt-sm", "mob-close-icon");
|
|
642
|
-
i0.ɵɵadvance();
|
|
643
|
-
i0.ɵɵtextInterpolate(ctx.customIcons.customMobileCloseIcon);
|
|
644
|
-
i0.ɵɵadvance(2);
|
|
645
|
-
i0.ɵɵtextInterpolate(ctx.collapsed ? ctx.customIcons.customOpenIcon : ctx.customIcons.customCloseIcon);
|
|
646
|
-
i0.ɵɵadvance(2);
|
|
647
|
-
i0.ɵɵproperty("direction", ctx.direction)("isOpen", !ctx.collapsed)("active", ctx.active)("expandableMenuChildren", ctx.menuSettings == null ? null : ctx.menuSettings.expandableMenuChildren)("openExternalLinksInSameTab", ctx.menuSettings == null ? null : ctx.menuSettings.openExternalLinksInSameTab);
|
|
648
|
-
i0.ɵɵadvance(2);
|
|
649
|
-
i0.ɵɵconditional((ctx.menuSettings == null ? null : ctx.menuSettings.showAccessibility) ? 26 : -1);
|
|
650
|
-
i0.ɵɵadvance();
|
|
651
|
-
i0.ɵɵconditional(ctx.useDefaultLanguageSwitcher && ctx.supportedLanguages && ctx.supportedLanguages.length > 1 ? 27 : -1);
|
|
652
|
-
i0.ɵɵadvance(3);
|
|
653
|
-
i0.ɵɵproperty("userOptions", ctx.userOptions())("username", ctx.username)("collapsed", ctx.collapsed)("useLargeLoginButton", ctx.menuSettings == null ? null : ctx.menuSettings.useLargeLoginButton);
|
|
654
|
-
i0.ɵɵadvance();
|
|
655
|
-
i0.ɵɵconditional((ctx.footerItems == null ? null : ctx.footerItems.length) ? 31 : -1);
|
|
656
|
-
} }, styles: ["a[_ngcontent-%COMP%]{text-decoration:none}.menu-container[_ngcontent-%COMP%]:not(.collapsed) menu-columns[_ngcontent-%COMP%]{margin-right:-12px;padding-right:8px;max-height:fit-content;overflow-y:scroll}.no-click[_ngcontent-%COMP%]{pointer-events:none!important}.mobile-header[_ngcontent-%COMP%]{display:flex;justify-content:space-between;padding:23px 27px;background-color:var(--base-100);border:1px solid var(--base-70)}.accessibility-view.menu-container[_ngcontent-%COMP%]:not(.collapsed), .mobile.menu-container[_ngcontent-%COMP%]:not(.collapsed){display:block!important;position:fixed;min-width:100vw;max-width:100vw;min-height:100dvh;z-index:1000} .mobile.menu-container.collapsed, .accessibility-view.menu-container.collapsed{display:none!important}button[_ngcontent-%COMP%]:has(.mob-close-icon){margin-right:10px}.menu-container[_ngcontent-%COMP%] [_ngcontent-%COMP%]::-webkit-scrollbar{width:5px}.menu-container[_ngcontent-%COMP%] [_ngcontent-%COMP%]::-webkit-scrollbar-thumb{background:var(--base-95);background-clip:padding-box}.menu-container[_ngcontent-%COMP%] [_ngcontent-%COMP%]::-webkit-scrollbar-track{background:var(--base-100)}.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%}[_nghost-%COMP%] .collapsed .profile-wrapper{margin:36px 0!important}[_nghost-%COMP%] .mobile .profile-name{max-width:60vw}[_nghost-%COMP%] .menu-item, [_nghost-%COMP%] .accessibility-btn, [_nghost-%COMP%] .lang-switcher{touch-action:pan-y!important}[_nghost-%COMP%] .menu-item{display:flex;padding:16px!important;border-radius:4px!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}[_nghost-%COMP%] .child-list .mob-menu-item .menu-item-title{margin-left:36px!important}tld-menu-icon[_ngcontent-%COMP%]{margin-right:10px}[_nghost-%COMP%] button.collapse-btn .mat-mdc-button-persistent-ripple, [_nghost-%COMP%] button.toggler .mat-mdc-button-persistent-ripple{display:none} .cdk-overlay-container .child-menu, .cdk-overlay-container .profile-menu, .cdk-overlay-container .lang-menu{min-width:250px;margin:10px 0}@media (max-width: 600px){ .cdk-overlay-container .child-menu, .cdk-overlay-container .profile-menu, .cdk-overlay-container .lang-menu{min-width:calc(100vw - 32px)!important}} .mat-mdc-menu-item .mat-icon{margin-right:5px!important} .collapsed .profile-wrapper{justify-content:center!important}.menu-divider[_ngcontent-%COMP%]{border:1px solid var(--base-70)}.menu-footer[_ngcontent-%COMP%]{display:flex;justify-content:center;margin-bottom:20px;color:var(--base-40);font-size:.8125rem}.mobile[_ngcontent-%COMP%] .menu-footer[_ngcontent-%COMP%]{font-size:.875rem;justify-content:space-between;margin-right:16px;margin-left:16px}", ".compact-menu menu-columns{margin-bottom:86px} .compact-menu .profile{margin-top:80px!important} .compact-menu .profile-icon{margin-left:10px!important;min-width:28px!important;height:28px!important;font-size:12px!important} .compact-menu .profile-arrow{margin-right:5px!important} .compact-menu .profile-name{margin-left:10px!important;font-size:.875rem!important;font-weight:600!important} .compact-menu .profile-wrapper{padding:6px 0!important;border-radius:16px!important;border:2px solid var(--base-70)} .compact-menu .menu-wrapper{position:relative;height:100%} .compact-menu .lang-switcher{position:absolute;bottom:0} .compact-menu .accessibility-btn{position:absolute;bottom:46px} .compact-menu .menu-item, .compact-menu .lang-switcher, .compact-menu .accessibility-btn{margin:0 2px;padding:8px 12px!important;border-radius:16px!important} .compact-menu .lang-switcher .menu-arrow{margin-right:-8px} .compact-menu .child-list{margin-left:24px;padding:3px 6px 3px 0} .compact-menu.collapsed .child-list{margin-left:0} .compact-menu.collapsed .accessibility-btn, .compact-menu.collapsed .lang-switcher{padding:0!important;border-radius:50%!important} .compact-menu tld-menu-item-link:not(:first-child){margin-top:0!important;margin-bottom:5px} .compact-menu tld-menu-item-link .title-content{font-weight:400!important}"] }); }
|
|
665
|
+
i0.ɵɵconditional(ctx.isMenuReady() ? 0 : -1);
|
|
666
|
+
} }, styles: ["a[_ngcontent-%COMP%]{text-decoration:none}.menu-container[_ngcontent-%COMP%]:not(.collapsed) menu-columns[_ngcontent-%COMP%]{margin-right:-12px;padding-right:8px;max-height:fit-content;overflow-y:scroll}.no-click[_ngcontent-%COMP%]{pointer-events:none!important}.mobile-header[_ngcontent-%COMP%]{display:flex;justify-content:space-between;padding:23px 13px 23px 27px;background-color:var(--base-100);border:1px solid var(--base-70)}.accessibility-view.menu-container[_ngcontent-%COMP%]:not(.collapsed), .mobile.menu-container[_ngcontent-%COMP%]:not(.collapsed){display:block!important;position:fixed;min-width:100vw;max-width:100vw;min-height:100dvh;z-index:1000} .mobile.menu-container.collapsed, .accessibility-view.menu-container.collapsed{display:none!important}button[_ngcontent-%COMP%]:has(.mob-close-icon){margin-right:10px}.menu-container[_ngcontent-%COMP%] [_ngcontent-%COMP%]::-webkit-scrollbar{width:5px}.menu-container[_ngcontent-%COMP%] [_ngcontent-%COMP%]::-webkit-scrollbar-thumb{background:var(--base-95);background-clip:padding-box}.menu-container[_ngcontent-%COMP%] [_ngcontent-%COMP%]::-webkit-scrollbar-track{background:var(--base-100)}.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%}[_nghost-%COMP%] .collapsed .profile-wrapper{margin:36px 0!important}[_nghost-%COMP%] .mobile .profile-name{max-width:60vw}[_nghost-%COMP%] .menu-item, [_nghost-%COMP%] .accessibility-btn, [_nghost-%COMP%] .lang-switcher{touch-action:pan-y!important}[_nghost-%COMP%] .menu-item{display:flex;padding:16px!important;border-radius:4px!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}[_nghost-%COMP%] .child-list .mob-menu-item .menu-item-title{margin-left:36px!important}tld-menu-icon[_ngcontent-%COMP%]{margin-right:10px}[_nghost-%COMP%] button.collapse-btn .mat-mdc-button-persistent-ripple, [_nghost-%COMP%] button.toggler .mat-mdc-button-persistent-ripple{display:none} .cdk-overlay-container .child-menu, .cdk-overlay-container .profile-menu, .cdk-overlay-container .lang-menu{min-width:250px;margin:10px 0}@media (max-width: 600px){ .cdk-overlay-container .child-menu, .cdk-overlay-container .profile-menu, .cdk-overlay-container .lang-menu{min-width:calc(100vw - 32px)!important}} .mat-mdc-menu-item .mat-icon{margin-right:5px!important} .collapsed .profile-wrapper{justify-content:center!important}.menu-divider[_ngcontent-%COMP%]{border:1px solid var(--base-70)}.menu-footer[_ngcontent-%COMP%]{display:flex;justify-content:center;margin-bottom:20px;color:var(--base-40);font-size:.8125rem}.mobile[_ngcontent-%COMP%] .menu-footer[_ngcontent-%COMP%]{font-size:.875rem;justify-content:space-between;margin-right:16px;margin-left:16px}", ".compact-menu menu-columns{margin-bottom:86px} .compact-menu .profile{margin-top:80px!important} .compact-menu .profile-icon{margin-left:10px!important;min-width:28px!important;height:28px!important;font-size:12px!important} .compact-menu .profile-arrow{margin-right:5px!important} .compact-menu .profile-name{margin-left:10px!important;font-size:.875rem!important;font-weight:600!important} .compact-menu .profile-wrapper{padding:6px 0!important;border-radius:16px!important;border:2px solid var(--base-70)} .compact-menu .menu-wrapper{position:relative;height:100%} .compact-menu .lang-switcher{position:absolute;bottom:0} .compact-menu .accessibility-btn{position:absolute;bottom:46px} .compact-menu .menu-item, .compact-menu .lang-switcher, .compact-menu .accessibility-btn{margin:0 2px;padding:8px 12px!important;border-radius:16px!important} .compact-menu .lang-switcher .menu-arrow{margin-right:-8px} .compact-menu .child-list{margin-left:24px;padding:3px 6px 3px 0} .compact-menu.collapsed .child-list{margin-left:0} .compact-menu.collapsed .accessibility-btn, .compact-menu.collapsed .lang-switcher{padding:0!important;border-radius:50%!important} .compact-menu tld-menu-item-link:not(:first-child){margin-top:0!important;margin-bottom:5px} .compact-menu tld-menu-item-link .title-content{font-weight:400!important}"] }); }
|
|
657
667
|
}
|
|
658
668
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SideNavMenuComponent, [{
|
|
659
669
|
type: Component,
|
|
660
|
-
args: [{ selector: 'lib-side-nav-menu', standalone: false, template: "\t<div [fxHide]=\"!collapsed || collapsed && !isMobileRes && !isViewIncreased()\" class=\"mobile-header\" [ngClass]=\"menuSettings.menuVersion\">\r\n\t\t<a\r\n\t\t\t[libPlausibleEvent]=\"LOGOCLICK_PLAUSIBLE_EVENT\"\r\n\t\t\tfxFlex=\"3.125em\"\r\n\t\t\t[href]=\"baseUrl\"\r\n\t\t\t[class.no-click]=\"menuSettings?.disableLogoNavigation\"\r\n\t\t\t[attr.aria-label]=\"'ARIA_LABELS.LOGO' | translate\"\r\n\t\t\t(click)=\"logoClick($event)\"\r\n\t\t\tfxLayoutAlign=\"start center\"\r\n\t\t>\r\n\t\t\t<img height=\"40\" width=\"40\" class=\"menu-logo\" [src]=\"logoImageSource()\" alt=\"logo\" />\r\n\t\t\t<span class=\"menu-product-name\">\r\n\t\t\t\t{{ strapiMenuTitle() ?? productName }}\r\n\t\t\t</span>\r\n\t\t</a>\r\n\r\n\t\t<button\r\n\t\t\tmat-icon-button\r\n\t\t\tclass=\"toggler\"\r\n\t\t\t[attr.aria-label]=\"'ARIA_LABELS.MENU_TOGGLER' | translate\"\r\n\t\t\t[libPlausibleEvent]=\"collapsed ? EXPAND_PLAUSIBLE_EVENT : COLLAPSE_PLAUSIBLE_EVENT\"\r\n\t\t\t(click)=\"toggleCollapse()\"\r\n\t\t>\r\n\t\t\t<mat-icon fxHide.gt-xs [ngClass.lt-sm]=\"'mob-close-icon'\">{{collapsed ? customIcons.customMobileOpenIcon : customIcons.customMobileCloseIcon}}</mat-icon>\r\n <mat-icon fxHide.lt-sm>{{ collapsed ? customIcons.customOpenIcon : customIcons.customCloseIcon }}</mat-icon>\r\n\t\t</button>\r\n\t</div>\r\n\r\n<div \r\n\tclass=\"menu-container\"\r\n\tfxLayout=\"column\" \r\n\t[ngClass.lt-sm]=\"'mobile'\"\r\n\t[class.accessibility-view]=\"isViewIncreased()\"\r\n\t[style.width]=\"sideNavWidth\" \r\n\t[class.collapsed]=\"collapsed\" \r\n\t[ngClass]=\"menuSettings.menuVersion\"\r\n>\r\n\t<div class=\"content\" fxLayout=\"column\" fxFlexFill>\r\n\t\t<div class=\"menu-container-header\" fxLayout=\"row\" [fxLayoutAlign]=\"collapsed ? 'center center' : 'space-between center'\">\r\n\t\t\t<a\r\n\t\t\t\t*ngIf=\"!collapsed\"\r\n\t\t\t\t[libPlausibleEvent]=\"LOGOCLICK_PLAUSIBLE_EVENT\"\r\n\t\t\t\tfxFlex=\"3.125em\"\r\n\t\t\t\t[class.no-click]=\"menuSettings?.disableLogoNavigation\"\r\n\t\t\t\t[href]=\"baseUrl\"\r\n\t\t\t\t[attr.aria-label]=\"'ARIA_LABELS.LOGO' | translate\"\r\n\t\t\t\t(click)=\"logoClick($event)\"\r\n\t\t\t\tfxLayoutAlign=\"start center\"\r\n\t\t\t>\r\n\t\t\t\t<img height=\"40\" width=\"40\" class=\"menu-logo\" [src]=\"logoImageSource()\" alt=\"logo\" />\r\n\t\t\t\t<span class=\"menu-product-name\">\r\n\t\t\t\t\t{{ strapiMenuTitle() ?? productName }}\r\n\t\t\t\t</span>\r\n\t\t\t</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 [ngClass.lt-sm]=\"'mob-close-icon'\">{{customIcons.customMobileCloseIcon}}</mat-icon>\r\n <mat-icon fxHide.lt-sm>{{ collapsed ? customIcons.customOpenIcon : customIcons.customCloseIcon }}</mat-icon>\r\n </button>\r\n </div>\r\n\r\n\t\t<div class=\"menu-wrapper\" fxLayout=\"column\">\r\n\t\t\t<menu-columns\r\n\t\t\t\t(toggleCollapseEvent)=\"toggleCollapse()\"\r\n\t\t\t\t[direction]=\"direction\"\r\n\t\t\t\trole=\"navigation\"\r\n\t\t\t\t[isOpen]=\"!collapsed\"\r\n\t\t\t\t[active]=\"active\"\r\n\t\t\t\t[expandableMenuChildren]=\"menuSettings?.expandableMenuChildren\"\r\n\t\t\t\t[openExternalLinksInSameTab]=\"menuSettings?.openExternalLinksInSameTab\"\r\n\t\t\t></menu-columns>\r\n\r\n\t\t\t<div fxHide.gt-xs class=\"menu-divider\"></div>\r\n\r\n\t\t\t@if (menuSettings?.showAccessibility) {\r\n\t\t\t\t<lib-menu-accessibility [isCollapsed]=\"collapsed\" [baseUrl]=\"baseUrl\"></lib-menu-accessibility>\r\n\t\t\t}\r\n\t\t\t@if (useDefaultLanguageSwitcher && supportedLanguages && supportedLanguages.length > 1) {\r\n\t\t\t<lib-menu-lang-switcher [isCollapsed]=\"collapsed\" [languages]=\"supportedLanguages\" (changeLanguageEvent)=\"changeLanguage($event)\"></lib-menu-lang-switcher>\r\n\t\t\t}\r\n\t\t</div>\r\n\t\t<div fxFlex fxLayout=\"column\">\r\n\t\t\t<ng-content></ng-content>\r\n\t\t</div>\r\n\r\n\t\t<lib-menu-profile \r\n\t\t\t[userOptions]=\"userOptions()\" \r\n\t\t\t[username]=\"username\" \r\n\t\t\t[collapsed]=\"collapsed\" \r\n\t\t\t[useLargeLoginButton]=\"menuSettings?.useLargeLoginButton\"\r\n\t\t\t(linkCallbackEvent)=\"linkCallback($event)\"\r\n\t\t\t(loginEvent)=\"login()\"\t\r\n\t\t>\r\n\t\t</lib-menu-profile>\r\n\r\n @if (footerItems?.length) {\r\n <div class=\"menu-footer\">\r\n @if (!collapsed) {\r\n @for (item of footerItems; let i = $index; track i) {\r\n <a [href]=\"item.link\" target=\"_blank\">{{ item.title }}</a>\r\n \r\n @if (i !== footerItems!.length - 1) { \r\n | \r\n } \r\n }\r\n }\r\n </div>\r\n }\r\n\t</div>\r\n</div>\r\n", styles: ["a{text-decoration:none}.menu-container:not(.collapsed) menu-columns{margin-right:-12px;padding-right:8px;max-height:fit-content;overflow-y:scroll}.no-click{pointer-events:none!important}.mobile-header{display:flex;justify-content:space-between;padding:23px 27px;background-color:var(--base-100);border:1px solid var(--base-70)}.accessibility-view.menu-container:not(.collapsed),.mobile.menu-container:not(.collapsed){display:block!important;position:fixed;min-width:100vw;max-width:100vw;min-height:100dvh;z-index:1000}::ng-deep .mobile.menu-container.collapsed,::ng-deep .accessibility-view.menu-container.collapsed{display:none!important}button:has(.mob-close-icon){margin-right:10px}.menu-container ::-webkit-scrollbar{width:5px}.menu-container ::-webkit-scrollbar-thumb{background:var(--base-95);background-clip:padding-box}.menu-container ::-webkit-scrollbar-track{background:var(--base-100)}.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%}:host ::ng-deep .collapsed .profile-wrapper{margin:36px 0!important}:host ::ng-deep .mobile .profile-name{max-width:60vw}:host ::ng-deep .menu-item,:host ::ng-deep .accessibility-btn,:host ::ng-deep .lang-switcher{touch-action:pan-y!important}:host ::ng-deep .menu-item{display:flex;padding:16px!important;border-radius:4px!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}:host ::ng-deep .child-list .mob-menu-item .menu-item-title{margin-left:36px!important}tld-menu-icon{margin-right:10px}:host::ng-deep button.collapse-btn .mat-mdc-button-persistent-ripple,:host::ng-deep button.toggler .mat-mdc-button-persistent-ripple{display:none}::ng-deep .cdk-overlay-container .child-menu,::ng-deep .cdk-overlay-container .profile-menu,::ng-deep .cdk-overlay-container .lang-menu{min-width:250px;margin:10px 0}@media (max-width: 600px){::ng-deep .cdk-overlay-container .child-menu,::ng-deep .cdk-overlay-container .profile-menu,::ng-deep .cdk-overlay-container .lang-menu{min-width:calc(100vw - 32px)!important}}::ng-deep .mat-mdc-menu-item .mat-icon{margin-right:5px!important}::ng-deep .collapsed .profile-wrapper{justify-content:center!important}.menu-divider{border:1px solid var(--base-70)}.menu-footer{display:flex;justify-content:center;margin-bottom:20px;color:var(--base-40);font-size:.8125rem}.mobile .menu-footer{font-size:.875rem;justify-content:space-between;margin-right:16px;margin-left:16px}\n", "::ng-deep .compact-menu menu-columns{margin-bottom:86px}::ng-deep .compact-menu .profile{margin-top:80px!important}::ng-deep .compact-menu .profile-icon{margin-left:10px!important;min-width:28px!important;height:28px!important;font-size:12px!important}::ng-deep .compact-menu .profile-arrow{margin-right:5px!important}::ng-deep .compact-menu .profile-name{margin-left:10px!important;font-size:.875rem!important;font-weight:600!important}::ng-deep .compact-menu .profile-wrapper{padding:6px 0!important;border-radius:16px!important;border:2px solid var(--base-70)}::ng-deep .compact-menu .menu-wrapper{position:relative;height:100%}::ng-deep .compact-menu .lang-switcher{position:absolute;bottom:0}::ng-deep .compact-menu .accessibility-btn{position:absolute;bottom:46px}::ng-deep .compact-menu .menu-item,::ng-deep .compact-menu .lang-switcher,::ng-deep .compact-menu .accessibility-btn{margin:0 2px;padding:8px 12px!important;border-radius:16px!important}::ng-deep .compact-menu .lang-switcher .menu-arrow{margin-right:-8px}::ng-deep .compact-menu .child-list{margin-left:24px;padding:3px 6px 3px 0}::ng-deep .compact-menu.collapsed .child-list{margin-left:0}::ng-deep .compact-menu.collapsed .accessibility-btn,::ng-deep .compact-menu.collapsed .lang-switcher{padding:0!important;border-radius:50%!important}::ng-deep .compact-menu tld-menu-item-link:not(:first-child){margin-top:0!important;margin-bottom:5px}::ng-deep .compact-menu tld-menu-item-link .title-content{font-weight:400!important}\n"] }]
|
|
670
|
+
args: [{ selector: 'lib-side-nav-menu', standalone: false, template: "@if (isMenuReady()) {\r\n\t<div [fxHide]=\"!collapsed || collapsed && !isMobileRes && !isViewIncreased()\" class=\"mobile-header\" [ngClass]=\"menuSettings.menuVersion\">\r\n\t\t<a\r\n\t\t\t[libPlausibleEvent]=\"LOGOCLICK_PLAUSIBLE_EVENT\"\r\n\t\t\tfxFlex=\"3.125em\"\r\n\t\t\t[href]=\"baseUrl\"\r\n\t\t\t[class.no-click]=\"menuSettings?.disableLogoNavigation\"\r\n\t\t\t[attr.aria-label]=\"'ARIA_LABELS.LOGO' | translate\"\r\n\t\t\t(click)=\"logoClick($event)\"\r\n\t\t\tfxLayoutAlign=\"start center\"\r\n\t\t>\r\n\t\t\t<img height=\"40\" width=\"40\" class=\"menu-logo\" [src]=\"logoImageSource()\" alt=\"logo\" />\r\n\t\t\t<span class=\"menu-product-name\">\r\n\t\t\t\t{{ strapiMenuTitle() ?? productName }}\r\n\t\t\t</span>\r\n\t\t</a>\r\n\r\n\t\t<button\r\n\t\t\tmat-icon-button\r\n\t\t\tclass=\"toggler\"\r\n\t\t\t[attr.aria-label]=\"'ARIA_LABELS.MENU_TOGGLER' | translate\"\r\n\t\t\t[libPlausibleEvent]=\"collapsed ? EXPAND_PLAUSIBLE_EVENT : COLLAPSE_PLAUSIBLE_EVENT\"\r\n\t\t\t(click)=\"toggleCollapse()\"\r\n\t\t>\r\n\t\t\t<mat-icon fxHide.gt-xs [ngClass.lt-sm]=\"'mob-close-icon'\">{{collapsed ? customIcons.customMobileOpenIcon : customIcons.customMobileCloseIcon}}</mat-icon>\r\n <mat-icon fxHide.lt-sm>{{ collapsed ? customIcons.customOpenIcon : customIcons.customCloseIcon }}</mat-icon>\r\n\t\t</button>\r\n\t</div>\r\n\r\n<div \r\n\tclass=\"menu-container\"\r\n\tfxLayout=\"column\" \r\n\t[ngClass.lt-sm]=\"'mobile'\"\r\n\t[class.accessibility-view]=\"isViewIncreased()\"\r\n\t[style.width]=\"sideNavWidth\" \r\n\t[class.collapsed]=\"collapsed\" \r\n\t[ngClass]=\"menuSettings.menuVersion\"\r\n>\r\n\t<div class=\"content\" fxLayout=\"column\" fxFlexFill>\r\n\t\t<div class=\"menu-container-header\" fxLayout=\"row\" [fxLayoutAlign]=\"collapsed ? 'center center' : 'space-between center'\">\r\n\t\t\t<a\r\n\t\t\t\t*ngIf=\"!collapsed\"\r\n\t\t\t\t[libPlausibleEvent]=\"LOGOCLICK_PLAUSIBLE_EVENT\"\r\n\t\t\t\tfxFlex=\"3.125em\"\r\n\t\t\t\t[class.no-click]=\"menuSettings?.disableLogoNavigation\"\r\n\t\t\t\t[href]=\"baseUrl\"\r\n\t\t\t\t[attr.aria-label]=\"'ARIA_LABELS.LOGO' | translate\"\r\n\t\t\t\t(click)=\"logoClick($event)\"\r\n\t\t\t\tfxLayoutAlign=\"start center\"\r\n\t\t\t>\r\n\t\t\t\t<img height=\"40\" width=\"40\" class=\"menu-logo\" [src]=\"logoImageSource()\" alt=\"logo\" />\r\n\t\t\t\t<span class=\"menu-product-name\">\r\n\t\t\t\t\t{{ strapiMenuTitle() ?? productName }}\r\n\t\t\t\t</span>\r\n\t\t\t</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 [ngClass.lt-sm]=\"'mob-close-icon'\">{{customIcons.customMobileCloseIcon}}</mat-icon>\r\n <mat-icon fxHide.lt-sm>{{ collapsed ? customIcons.customOpenIcon : customIcons.customCloseIcon }}</mat-icon>\r\n </button>\r\n </div>\r\n\r\n\t\t<div class=\"menu-wrapper\" fxLayout=\"column\">\r\n\t\t\t<menu-columns\r\n\t\t\t\t(toggleCollapseEvent)=\"toggleCollapse()\"\r\n\t\t\t\t[direction]=\"direction\"\r\n\t\t\t\trole=\"navigation\"\r\n\t\t\t\t[isOpen]=\"!collapsed\"\r\n\t\t\t\t[active]=\"active\"\r\n\t\t\t\t[expandableMenuChildren]=\"menuSettings?.expandableMenuChildren\"\r\n\t\t\t\t[openExternalLinksInSameTab]=\"menuSettings?.openExternalLinksInSameTab\"\r\n\t\t\t></menu-columns>\r\n\r\n\t\t\t<div fxHide.gt-xs class=\"menu-divider\"></div>\r\n\r\n\t\t\t@if (menuSettings?.showAccessibility) {\r\n\t\t\t\t<lib-menu-accessibility [isCollapsed]=\"collapsed\" [baseUrl]=\"baseUrl\"></lib-menu-accessibility>\r\n\t\t\t}\r\n\t\t\t@if (useDefaultLanguageSwitcher && supportedLanguages && supportedLanguages.length > 1) {\r\n\t\t\t<lib-menu-lang-switcher [isCollapsed]=\"collapsed\" [languages]=\"supportedLanguages\" (changeLanguageEvent)=\"changeLanguage($event)\"></lib-menu-lang-switcher>\r\n\t\t\t}\r\n\t\t</div>\r\n\t\t<div fxFlex fxLayout=\"column\">\r\n\t\t\t<ng-content></ng-content>\r\n\t\t</div>\r\n\r\n\t\t<lib-menu-profile \r\n\t\t\t[userOptions]=\"userOptions()\" \r\n\t\t\t[username]=\"username\" \r\n\t\t\t[collapsed]=\"collapsed\" \r\n\t\t\t[useLargeLoginButton]=\"menuSettings?.useLargeLoginButton\"\r\n\t\t\t(linkCallbackEvent)=\"linkCallback($event)\"\r\n\t\t\t(loginEvent)=\"login()\"\t\r\n\t\t>\r\n\t\t</lib-menu-profile>\r\n\r\n @if (footerItems?.length) {\r\n <div class=\"menu-footer\">\r\n @if (!collapsed) {\r\n @for (item of footerItems; let i = $index; track i) {\r\n <a [href]=\"item.link\" target=\"_blank\">{{ item.title }}</a>\r\n \r\n @if (i !== footerItems!.length - 1) { \r\n | \r\n } \r\n }\r\n }\r\n </div>\r\n }\r\n\t</div>\r\n</div>\r\n}\r\n", styles: ["a{text-decoration:none}.menu-container:not(.collapsed) menu-columns{margin-right:-12px;padding-right:8px;max-height:fit-content;overflow-y:scroll}.no-click{pointer-events:none!important}.mobile-header{display:flex;justify-content:space-between;padding:23px 13px 23px 27px;background-color:var(--base-100);border:1px solid var(--base-70)}.accessibility-view.menu-container:not(.collapsed),.mobile.menu-container:not(.collapsed){display:block!important;position:fixed;min-width:100vw;max-width:100vw;min-height:100dvh;z-index:1000}::ng-deep .mobile.menu-container.collapsed,::ng-deep .accessibility-view.menu-container.collapsed{display:none!important}button:has(.mob-close-icon){margin-right:10px}.menu-container ::-webkit-scrollbar{width:5px}.menu-container ::-webkit-scrollbar-thumb{background:var(--base-95);background-clip:padding-box}.menu-container ::-webkit-scrollbar-track{background:var(--base-100)}.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%}:host ::ng-deep .collapsed .profile-wrapper{margin:36px 0!important}:host ::ng-deep .mobile .profile-name{max-width:60vw}:host ::ng-deep .menu-item,:host ::ng-deep .accessibility-btn,:host ::ng-deep .lang-switcher{touch-action:pan-y!important}:host ::ng-deep .menu-item{display:flex;padding:16px!important;border-radius:4px!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}:host ::ng-deep .child-list .mob-menu-item .menu-item-title{margin-left:36px!important}tld-menu-icon{margin-right:10px}:host::ng-deep button.collapse-btn .mat-mdc-button-persistent-ripple,:host::ng-deep button.toggler .mat-mdc-button-persistent-ripple{display:none}::ng-deep .cdk-overlay-container .child-menu,::ng-deep .cdk-overlay-container .profile-menu,::ng-deep .cdk-overlay-container .lang-menu{min-width:250px;margin:10px 0}@media (max-width: 600px){::ng-deep .cdk-overlay-container .child-menu,::ng-deep .cdk-overlay-container .profile-menu,::ng-deep .cdk-overlay-container .lang-menu{min-width:calc(100vw - 32px)!important}}::ng-deep .mat-mdc-menu-item .mat-icon{margin-right:5px!important}::ng-deep .collapsed .profile-wrapper{justify-content:center!important}.menu-divider{border:1px solid var(--base-70)}.menu-footer{display:flex;justify-content:center;margin-bottom:20px;color:var(--base-40);font-size:.8125rem}.mobile .menu-footer{font-size:.875rem;justify-content:space-between;margin-right:16px;margin-left:16px}\n", "::ng-deep .compact-menu menu-columns{margin-bottom:86px}::ng-deep .compact-menu .profile{margin-top:80px!important}::ng-deep .compact-menu .profile-icon{margin-left:10px!important;min-width:28px!important;height:28px!important;font-size:12px!important}::ng-deep .compact-menu .profile-arrow{margin-right:5px!important}::ng-deep .compact-menu .profile-name{margin-left:10px!important;font-size:.875rem!important;font-weight:600!important}::ng-deep .compact-menu .profile-wrapper{padding:6px 0!important;border-radius:16px!important;border:2px solid var(--base-70)}::ng-deep .compact-menu .menu-wrapper{position:relative;height:100%}::ng-deep .compact-menu .lang-switcher{position:absolute;bottom:0}::ng-deep .compact-menu .accessibility-btn{position:absolute;bottom:46px}::ng-deep .compact-menu .menu-item,::ng-deep .compact-menu .lang-switcher,::ng-deep .compact-menu .accessibility-btn{margin:0 2px;padding:8px 12px!important;border-radius:16px!important}::ng-deep .compact-menu .lang-switcher .menu-arrow{margin-right:-8px}::ng-deep .compact-menu .child-list{margin-left:24px;padding:3px 6px 3px 0}::ng-deep .compact-menu.collapsed .child-list{margin-left:0}::ng-deep .compact-menu.collapsed .accessibility-btn,::ng-deep .compact-menu.collapsed .lang-switcher{padding:0!important;border-radius:50%!important}::ng-deep .compact-menu tld-menu-item-link:not(:first-child){margin-top:0!important;margin-bottom:5px}::ng-deep .compact-menu tld-menu-item-link .title-content{font-weight:400!important}\n"] }]
|
|
661
671
|
}], () => [{ type: i1.StrapiLinkService }, { type: i2.DOMService }, { type: MenuItemsService }, { type: i2.AccessibilityService }], { username: [{
|
|
662
672
|
type: Input
|
|
663
673
|
}], menuSettings: [{
|
|
@@ -1406,11 +1416,11 @@ class MenuItemListComponent {
|
|
|
1406
1416
|
i0.ɵɵproperty("fxLayoutAlign", ctx.menuLayoutDirection);
|
|
1407
1417
|
i0.ɵɵadvance();
|
|
1408
1418
|
i0.ɵɵproperty("ngForOf", ctx.items);
|
|
1409
|
-
} }, dependencies: [i1$2.DefaultLayoutDirective, i1$2.DefaultLayoutAlignDirective, i2$2.DefaultClassDirective, i1$1.RouterLink, i3.NgForOf, i3.NgIf, i3.NgTemplateOutlet, i4.MatTooltip, i2$1.MatIcon, i7.MatButton, i7.MatIconButton, MenuItemLinkComponent, MenuItemBtnComponent, MenuItemWithChildrenComponent, i9.TranslatePipe], styles: ["[_nghost-%COMP%]{display:inline-block} .menu-item{width:100%} a, a:hover{text-decoration:none} .collapsed .menu-item-list{display:flex!important;justify-content:center!important;align-items:center!important} .collapsed .menu-list-wrapper, .collapsed tld-menu-item-link{display:flex!important;justify-content:center!important} .collapsed .menu-item{display:flex!important;place-content:center center!important} .collapsed tld-menu-item-link:not(:first-child){margin-top:16px} .active-parent button, .active-menu-item-group{background-color:var(--base-95)!important} .description-block{margin-top:24px;display:flex;flex-direction:column;gap:4px;width:100%;padding:8px 14px;border-radius:8px;text-align:left;font-size:14px} .description-block .description-block-title{font-weight:500} .description-block .description-block-paragraph{font-weight:400;white-space:normal} .menu-action-button{justify-content:flex-start;align-items:center;max-width:100%;width:-webkit-fill-available} .menu-list-wrapper .menu-item{cursor:pointer;font-style:normal;color:var(--base-30);text-decoration:none;align-items:center!important;font-weight:400;background:none;border:none} .menu-list-wrapper .menu-item:not(button):not(.active-menu-item):hover{background-color:var(--base-70)!important} .menu-list-wrapper .menu-item.active-menu-item, .menu-list-wrapper .menu-item.active-menu-item mat-icon, .menu-list-wrapper .menu-item.active-menu-item:hover{font-weight:600} .menu-list-wrapper .menu-item span{display:inline-block} .menu-list-wrapper .menu-item .menu-item-title{display:flex;flex-direction:row;align-items:start;width:100%} .menu-list-wrapper .menu-item .menu-item-title .title-content{width:100%;text-align:start;display:block} .menu-list-wrapper .menu-item .menu-item-title .title-content:before{display:block;content:attr(content);font-weight:600;height:0;overflow:hidden;visibility:hidden} .menu-list-wrapper .menu-parent-item.active-menu-item, .menu-list-wrapper .menu-parent-item:hover{font-weight:400!important;background-color:var(--base-70)!important} .menu-tooltip{left:.625rem;font-family:Roboto;font-style:normal;font-weight:400;font-size:.75rem;line-height:1.25rem;color:var(--base-70);border-radius:.25rem;position:relative} .menu-tooltip:after{width:0;height:0;content:\"\";position:absolute;border-left:.5rem solid transparent;border-right:.5rem solid transparent;border-bottom:.5rem solid var(--menu-border-dark-color);left:-.75rem;top:calc(50% - .25rem);transform:rotate(270deg);overflow:initial} .menu-item-list-title{padding:8px 0 24px;font-size:1rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;margin-left:20px;height:56px} .menu-item-list-title:has(.menu-title-btn){margin-left:0} lib-menu-accessibility, lib-menu-lang-switcher, .menu-item-list{animation:_ngcontent-%COMP%_slide-in .3s forwards} lib-menu-accessibility, lib-menu-lang-switcher, .menu-title-btn{margin-right:2px;transition:opacity .3s} .arrow-icon{margin-right:-6px} .mob-menu-item .arrow-icon{margin-right:0}@keyframes _ngcontent-%COMP%_slide-in{0%{opacity:0;margin-left:-100px}to{opacity:1;margin-left:0}}"] }); }
|
|
1419
|
+
} }, dependencies: [i1$2.DefaultLayoutDirective, i1$2.DefaultLayoutAlignDirective, i2$2.DefaultClassDirective, i1$1.RouterLink, i3.NgForOf, i3.NgIf, i3.NgTemplateOutlet, i4.MatTooltip, i2$1.MatIcon, i7.MatButton, i7.MatIconButton, MenuItemLinkComponent, MenuItemBtnComponent, MenuItemWithChildrenComponent, i9.TranslatePipe], styles: ["[_nghost-%COMP%]{display:inline-block} .menu-item{width:100%} a, a:hover{text-decoration:none} .collapsed .menu-item-list{display:flex!important;justify-content:center!important;align-items:center!important} .collapsed .menu-list-wrapper, .collapsed tld-menu-item-link{display:flex!important;justify-content:center!important} .collapsed lib-menu-item-with-children{display:flex!important;flex-direction:column!important;align-items:center!important} .collapsed .menu-item{display:flex!important;place-content:center center!important} .collapsed tld-menu-item-link:not(:first-child){margin-top:16px} .active-parent button, .active-menu-item-group{background-color:var(--base-95)!important} .description-block{margin-top:24px;display:flex;flex-direction:column;gap:4px;width:100%;padding:8px 14px;border-radius:8px;text-align:left;font-size:14px} .description-block .description-block-title{font-weight:500} .description-block .description-block-paragraph{font-weight:400;white-space:normal} .menu-action-button{justify-content:flex-start;align-items:center;max-width:100%;width:-webkit-fill-available} .menu-list-wrapper .menu-item{cursor:pointer;font-style:normal;color:var(--base-30);text-decoration:none;align-items:center!important;font-weight:400;background:none;border:none} .menu-list-wrapper .menu-item:not(button):not(.active-menu-item):hover{background-color:var(--base-70)!important} .menu-list-wrapper .menu-item.active-menu-item, .menu-list-wrapper .menu-item.active-menu-item mat-icon, .menu-list-wrapper .menu-item.active-menu-item:hover{font-weight:600} .menu-list-wrapper .menu-item span{display:inline-block} .menu-list-wrapper .menu-item .menu-item-title{display:flex;flex-direction:row;align-items:start;width:100%} .menu-list-wrapper .menu-item .menu-item-title .title-content{width:100%;text-align:start;display:block} .menu-list-wrapper .menu-item .menu-item-title .title-content:before{display:block;content:attr(content);font-weight:600;height:0;overflow:hidden;visibility:hidden} .menu-list-wrapper .menu-parent-item.active-menu-item, .menu-list-wrapper .menu-parent-item:hover{font-weight:400!important;background-color:var(--base-70)!important} .menu-tooltip{left:.625rem;font-family:Roboto;font-style:normal;font-weight:400;font-size:.75rem;line-height:1.25rem;color:var(--base-70);border-radius:.25rem;position:relative} .menu-tooltip:after{width:0;height:0;content:\"\";position:absolute;border-left:.5rem solid transparent;border-right:.5rem solid transparent;border-bottom:.5rem solid var(--menu-border-dark-color);left:-.75rem;top:calc(50% - .25rem);transform:rotate(270deg);overflow:initial} .menu-item-list-title{padding:8px 0 24px;font-size:1rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;margin-left:20px;height:56px} .menu-item-list-title:has(.menu-title-btn){margin-left:0} lib-menu-accessibility, lib-menu-lang-switcher, .menu-item-list{animation:_ngcontent-%COMP%_slide-in .3s forwards} lib-menu-accessibility, lib-menu-lang-switcher, .menu-title-btn{margin-right:2px;transition:opacity .3s} .arrow-icon{margin-right:-6px} .mob-menu-item .arrow-icon{margin-right:0}@keyframes _ngcontent-%COMP%_slide-in{0%{opacity:0;margin-left:-100px}to{opacity:1;margin-left:0}}"] }); }
|
|
1410
1420
|
}
|
|
1411
1421
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MenuItemListComponent, [{
|
|
1412
1422
|
type: Component,
|
|
1413
|
-
args: [{ selector: 'menu-item-list', standalone: false, template: "<div class=\"menu-list-wrapper\">\r\n\t@if (titleKey && showTitle && labelsVisible && !menuItemGroup.itemGroupClick && !menuItemGroup.description) {\r\n\t<div fxLayoutAlign=\"start center\" class=\"menu-item-list-title\">\r\n\t\t<mat-icon *ngIf=\"menuItemGroup.titleIcon\" class=\"menu-title-btn\">\r\n\t\t\t{{ menuItemGroup.titleIcon }}\r\n\t\t</mat-icon>\r\n\r\n\t\t<button\r\n\t\t\t*ngIf=\"menuItemGroup.titleNavigation\"\r\n\t\t\tmat-icon-button\r\n\t\t\tclass=\"menu-title-btn\"\r\n\t\t\t[routerLink]=\"menuItemGroup.titleNavigation.path\"\r\n\t\t\t[matTooltip]=\"menuItemGroup.titleNavigation?.tooltip ?? '' | translate\"\r\n\t\t>\r\n\t\t\t<mat-icon>{{ menuItemGroup.titleNavigation.icon }}</mat-icon>\r\n\t\t</button>\r\n\r\n\t\t{{ titleKey | translate }}\r\n\t</div>\r\n\t} @else if (menuItemGroup?.itemGroupClick) {\r\n\t<ng-container *ngTemplateOutlet=\"itemGroupButton\"> </ng-container>\r\n\t} @else if (menuItemGroup?.description && labelsVisible) {\r\n\t<ng-container *ngTemplateOutlet=\"itemGroupDescriptionBlock\"></ng-container>\r\n\t}\r\n\t<div class=\"menu-item-list\" fxLayout=\"column\" [fxLayoutAlign]=\"menuLayoutDirection\">\r\n\t\t<ng-container *ngFor=\"let menuItem of items\">\r\n\t\t\t<ng-container\r\n\t\t\t\t*ngTemplateOutlet=\"\r\n\t\t\t\t\t!menuItem.showChildren || !menuItem.children || menuItem?.children?.length === 0 ? (menuItem.clickAction ? menuItemBtn : menuItemLink) : itemWithChildren;\r\n\t\t\t\t\tcontext: { menuItem: menuItem }\r\n\t\t\t\t\"\r\n\t\t\t>\r\n\t\t\t</ng-container>\r\n\t\t</ng-container>\r\n\t</div>\r\n</div>\r\n\r\n<ng-template #itemWithChildren let-menuItem=\"menuItem\">\r\n\t<lib-menu-item-with-children\r\n\t\t[menuItem]=\"menuItem\"\r\n\t\t[labelsVisible]=\"labelsVisible\"\r\n\t\t[menuLayoutDirection]=\"menuLayoutDirection\"\r\n\t\t[menuItemLayout]=\"menuItemLayout\"\r\n\t\t[activeItem]=\"activeItem\"\r\n\t\t[showIcons]=\"showIcons\"\r\n\t\t[direction]=\"direction\"\r\n\t\t[expandableMenuChildren]=\"expandableMenuChildren\"\r\n\t\t(toggleExpand)=\"toggleExpandEvent($event)\"\r\n\t\t(openMenu)=\"openMenu()\"\r\n\t\t[class.active-parent]=\"menuItem.appId === appId\"\r\n\t\t[openInSameTab]=\"openExternalLinksInSameTab\"\r\n\t></lib-menu-item-with-children>\r\n</ng-template>\r\n\r\n<ng-template #menuItemLink let-menuItem=\"menuItem\">\r\n\t<tld-menu-item-link\r\n\t\t[ngClass.lt-md]=\"'mob-menu-item'\"\r\n\t\t[menuItem]=\"menuItem\"\r\n\t\t[direction]=\"direction\"\r\n\t\t[labelsVisible]=\"labelsVisible\"\r\n\t\t[activeItem]=\"activeItem\"\r\n\t\t[showIcons]=\"showIcons\"\r\n\t\t[openInSameTab]=\"openExternalLinksInSameTab\"\r\n\t\t[allowTabSelection]=\"true\"\r\n\t></tld-menu-item-link>\r\n</ng-template>\r\n\r\n<ng-template #menuItemBtn let-menuItem=\"menuItem\">\r\n\t<lib-menu-item-btn *ngIf=\"labelsVisible\" [ngClass.lt-md]=\"'mob-menu-item'\" [menuItem]=\"menuItem\" [direction]=\"direction\" [activeItem]=\"activeItem\"></lib-menu-item-btn>\r\n</ng-template>\r\n\r\n<ng-template #itemGroupButton>\r\n\t<button\r\n\t\t*ngIf=\"menuItemGroup && labelsVisible\"\r\n\t\tmat-button\r\n\t\tclass=\"menu-title-btn menu-action-button\"\r\n\t\t(click)=\"menuItemGroup?.itemGroupClick()\"\r\n\t\t[class.active-menu-item-group]=\"menuItemGroup.isItemGroupActive && menuItemGroup.isItemGroupActive()\"\r\n\t>\r\n\t\t@if(menuItemGroup.isCustomItemGroupIcon){\r\n\t\t<mat-icon [svgIcon]=\"menuItemGroup.itemGroupIcon ?? ''\"></mat-icon>\r\n\t\t} @else {\r\n\t\t<mat-icon>{{ menuItemGroup.itemGroupIcon }}</mat-icon>\r\n\t\t}\r\n\t\t<span class=\"btn-label\" *ngIf=\"titleKey\">\r\n\t\t\t{{ titleKey | translate }}\r\n\t\t</span>\r\n\t</button>\r\n\r\n\t<button\r\n\t\t*ngIf=\"menuItemGroup && !labelsVisible && titleKey && menuItemGroup.itemGroupIcon\"\r\n\t\tmat-icon-button\r\n\t\tmatTooltipPosition=\"after\"\r\n\t\t[matTooltip]=\"titleKey | translate\"\r\n\t\t(click)=\"menuItemGroup?.itemGroupClick()\"\r\n\t>\r\n\t\t@if(menuItemGroup.isCustomItemGroupIcon){\r\n\t\t<mat-icon [svgIcon]=\"menuItemGroup.itemGroupIcon ?? ''\"></mat-icon>\r\n\t\t} @else {\r\n\t\t<mat-icon>{{ menuItemGroup.itemGroupIcon }}</mat-icon>\r\n\t\t}\r\n\t</button>\r\n</ng-template>\r\n\r\n<ng-template #itemGroupDescriptionBlock>\r\n\t<div class=\"description-block\">\r\n\t\t<span class=\"description-block-title\" [innerHTML]=\"(menuItemGroup.title || '') | translate\"></span>\r\n\t\t<p class=\"description-block-paragraph\" [innerHTML]=\"(menuItemGroup.description || '') | translate\"></p>\r\n\t</div>\r\n</ng-template>\r\n", styles: [":host{display:inline-block}::ng-deep .menu-item{width:100%}::ng-deep a,::ng-deep a:hover{text-decoration:none}::ng-deep .collapsed .menu-item-list{display:flex!important;justify-content:center!important;align-items:center!important}::ng-deep .collapsed .menu-list-wrapper,::ng-deep .collapsed tld-menu-item-link{display:flex!important;justify-content:center!important}::ng-deep .collapsed .menu-item{display:flex!important;place-content:center center!important}::ng-deep .collapsed tld-menu-item-link:not(:first-child){margin-top:16px}::ng-deep .active-parent button,::ng-deep .active-menu-item-group{background-color:var(--base-95)!important}::ng-deep .description-block{margin-top:24px;display:flex;flex-direction:column;gap:4px;width:100%;padding:8px 14px;border-radius:8px;text-align:left;font-size:14px}::ng-deep .description-block .description-block-title{font-weight:500}::ng-deep .description-block .description-block-paragraph{font-weight:400;white-space:normal}::ng-deep .menu-action-button{justify-content:flex-start;align-items:center;max-width:100%;width:-webkit-fill-available}::ng-deep .menu-list-wrapper .menu-item{cursor:pointer;font-style:normal;color:var(--base-30);text-decoration:none;align-items:center!important;font-weight:400;background:none;border:none}::ng-deep .menu-list-wrapper .menu-item:not(button):not(.active-menu-item):hover{background-color:var(--base-70)!important}::ng-deep .menu-list-wrapper .menu-item.active-menu-item,::ng-deep .menu-list-wrapper .menu-item.active-menu-item mat-icon,::ng-deep .menu-list-wrapper .menu-item.active-menu-item:hover{font-weight:600}::ng-deep .menu-list-wrapper .menu-item span{display:inline-block}::ng-deep .menu-list-wrapper .menu-item .menu-item-title{display:flex;flex-direction:row;align-items:start;width:100%}::ng-deep .menu-list-wrapper .menu-item .menu-item-title .title-content{width:100%;text-align:start;display:block}::ng-deep .menu-list-wrapper .menu-item .menu-item-title .title-content:before{display:block;content:attr(content);font-weight:600;height:0;overflow:hidden;visibility:hidden}::ng-deep .menu-list-wrapper .menu-parent-item.active-menu-item,::ng-deep .menu-list-wrapper .menu-parent-item:hover{font-weight:400!important;background-color:var(--base-70)!important}::ng-deep .menu-tooltip{left:.625rem;font-family:Roboto;font-style:normal;font-weight:400;font-size:.75rem;line-height:1.25rem;color:var(--base-70);border-radius:.25rem;position:relative}::ng-deep .menu-tooltip:after{width:0;height:0;content:\"\";position:absolute;border-left:.5rem solid transparent;border-right:.5rem solid transparent;border-bottom:.5rem solid var(--menu-border-dark-color);left:-.75rem;top:calc(50% - .25rem);transform:rotate(270deg);overflow:initial}::ng-deep .menu-item-list-title{padding:8px 0 24px;font-size:1rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;margin-left:20px;height:56px}::ng-deep .menu-item-list-title:has(.menu-title-btn){margin-left:0}::ng-deep lib-menu-accessibility,::ng-deep lib-menu-lang-switcher,::ng-deep .menu-item-list{animation:slide-in .3s forwards}::ng-deep lib-menu-accessibility,::ng-deep lib-menu-lang-switcher,::ng-deep .menu-title-btn{margin-right:2px;transition:opacity .3s}::ng-deep .arrow-icon{margin-right:-6px}::ng-deep .mob-menu-item .arrow-icon{margin-right:0}@keyframes slide-in{0%{opacity:0;margin-left:-100px}to{opacity:1;margin-left:0}}\n"] }]
|
|
1423
|
+
args: [{ selector: 'menu-item-list', standalone: false, template: "<div class=\"menu-list-wrapper\">\r\n\t@if (titleKey && showTitle && labelsVisible && !menuItemGroup.itemGroupClick && !menuItemGroup.description) {\r\n\t<div fxLayoutAlign=\"start center\" class=\"menu-item-list-title\">\r\n\t\t<mat-icon *ngIf=\"menuItemGroup.titleIcon\" class=\"menu-title-btn\">\r\n\t\t\t{{ menuItemGroup.titleIcon }}\r\n\t\t</mat-icon>\r\n\r\n\t\t<button\r\n\t\t\t*ngIf=\"menuItemGroup.titleNavigation\"\r\n\t\t\tmat-icon-button\r\n\t\t\tclass=\"menu-title-btn\"\r\n\t\t\t[routerLink]=\"menuItemGroup.titleNavigation.path\"\r\n\t\t\t[matTooltip]=\"menuItemGroup.titleNavigation?.tooltip ?? '' | translate\"\r\n\t\t>\r\n\t\t\t<mat-icon>{{ menuItemGroup.titleNavigation.icon }}</mat-icon>\r\n\t\t</button>\r\n\r\n\t\t{{ titleKey | translate }}\r\n\t</div>\r\n\t} @else if (menuItemGroup?.itemGroupClick) {\r\n\t<ng-container *ngTemplateOutlet=\"itemGroupButton\"> </ng-container>\r\n\t} @else if (menuItemGroup?.description && labelsVisible) {\r\n\t<ng-container *ngTemplateOutlet=\"itemGroupDescriptionBlock\"></ng-container>\r\n\t}\r\n\t<div class=\"menu-item-list\" fxLayout=\"column\" [fxLayoutAlign]=\"menuLayoutDirection\">\r\n\t\t<ng-container *ngFor=\"let menuItem of items\">\r\n\t\t\t<ng-container\r\n\t\t\t\t*ngTemplateOutlet=\"\r\n\t\t\t\t\t!menuItem.showChildren || !menuItem.children || menuItem?.children?.length === 0 ? (menuItem.clickAction ? menuItemBtn : menuItemLink) : itemWithChildren;\r\n\t\t\t\t\tcontext: { menuItem: menuItem }\r\n\t\t\t\t\"\r\n\t\t\t>\r\n\t\t\t</ng-container>\r\n\t\t</ng-container>\r\n\t</div>\r\n</div>\r\n\r\n<ng-template #itemWithChildren let-menuItem=\"menuItem\">\r\n\t<lib-menu-item-with-children\r\n\t\t[menuItem]=\"menuItem\"\r\n\t\t[labelsVisible]=\"labelsVisible\"\r\n\t\t[menuLayoutDirection]=\"menuLayoutDirection\"\r\n\t\t[menuItemLayout]=\"menuItemLayout\"\r\n\t\t[activeItem]=\"activeItem\"\r\n\t\t[showIcons]=\"showIcons\"\r\n\t\t[direction]=\"direction\"\r\n\t\t[expandableMenuChildren]=\"expandableMenuChildren\"\r\n\t\t(toggleExpand)=\"toggleExpandEvent($event)\"\r\n\t\t(openMenu)=\"openMenu()\"\r\n\t\t[class.active-parent]=\"menuItem.appId === appId\"\r\n\t\t[openInSameTab]=\"openExternalLinksInSameTab\"\r\n\t></lib-menu-item-with-children>\r\n</ng-template>\r\n\r\n<ng-template #menuItemLink let-menuItem=\"menuItem\">\r\n\t<tld-menu-item-link\r\n\t\t[ngClass.lt-md]=\"'mob-menu-item'\"\r\n\t\t[menuItem]=\"menuItem\"\r\n\t\t[direction]=\"direction\"\r\n\t\t[labelsVisible]=\"labelsVisible\"\r\n\t\t[activeItem]=\"activeItem\"\r\n\t\t[showIcons]=\"showIcons\"\r\n\t\t[openInSameTab]=\"openExternalLinksInSameTab\"\r\n\t\t[allowTabSelection]=\"true\"\r\n\t></tld-menu-item-link>\r\n</ng-template>\r\n\r\n<ng-template #menuItemBtn let-menuItem=\"menuItem\">\r\n\t<lib-menu-item-btn *ngIf=\"labelsVisible\" [ngClass.lt-md]=\"'mob-menu-item'\" [menuItem]=\"menuItem\" [direction]=\"direction\" [activeItem]=\"activeItem\"></lib-menu-item-btn>\r\n</ng-template>\r\n\r\n<ng-template #itemGroupButton>\r\n\t<button\r\n\t\t*ngIf=\"menuItemGroup && labelsVisible\"\r\n\t\tmat-button\r\n\t\tclass=\"menu-title-btn menu-action-button\"\r\n\t\t(click)=\"menuItemGroup?.itemGroupClick()\"\r\n\t\t[class.active-menu-item-group]=\"menuItemGroup.isItemGroupActive && menuItemGroup.isItemGroupActive()\"\r\n\t>\r\n\t\t@if(menuItemGroup.isCustomItemGroupIcon){\r\n\t\t<mat-icon [svgIcon]=\"menuItemGroup.itemGroupIcon ?? ''\"></mat-icon>\r\n\t\t} @else {\r\n\t\t<mat-icon>{{ menuItemGroup.itemGroupIcon }}</mat-icon>\r\n\t\t}\r\n\t\t<span class=\"btn-label\" *ngIf=\"titleKey\">\r\n\t\t\t{{ titleKey | translate }}\r\n\t\t</span>\r\n\t</button>\r\n\r\n\t<button\r\n\t\t*ngIf=\"menuItemGroup && !labelsVisible && titleKey && menuItemGroup.itemGroupIcon\"\r\n\t\tmat-icon-button\r\n\t\tmatTooltipPosition=\"after\"\r\n\t\t[matTooltip]=\"titleKey | translate\"\r\n\t\t(click)=\"menuItemGroup?.itemGroupClick()\"\r\n\t>\r\n\t\t@if(menuItemGroup.isCustomItemGroupIcon){\r\n\t\t<mat-icon [svgIcon]=\"menuItemGroup.itemGroupIcon ?? ''\"></mat-icon>\r\n\t\t} @else {\r\n\t\t<mat-icon>{{ menuItemGroup.itemGroupIcon }}</mat-icon>\r\n\t\t}\r\n\t</button>\r\n</ng-template>\r\n\r\n<ng-template #itemGroupDescriptionBlock>\r\n\t<div class=\"description-block\">\r\n\t\t<span class=\"description-block-title\" [innerHTML]=\"(menuItemGroup.title || '') | translate\"></span>\r\n\t\t<p class=\"description-block-paragraph\" [innerHTML]=\"(menuItemGroup.description || '') | translate\"></p>\r\n\t</div>\r\n</ng-template>\r\n", styles: [":host{display:inline-block}::ng-deep .menu-item{width:100%}::ng-deep a,::ng-deep a:hover{text-decoration:none}::ng-deep .collapsed .menu-item-list{display:flex!important;justify-content:center!important;align-items:center!important}::ng-deep .collapsed .menu-list-wrapper,::ng-deep .collapsed tld-menu-item-link{display:flex!important;justify-content:center!important}::ng-deep .collapsed lib-menu-item-with-children{display:flex!important;flex-direction:column!important;align-items:center!important}::ng-deep .collapsed .menu-item{display:flex!important;place-content:center center!important}::ng-deep .collapsed tld-menu-item-link:not(:first-child){margin-top:16px}::ng-deep .active-parent button,::ng-deep .active-menu-item-group{background-color:var(--base-95)!important}::ng-deep .description-block{margin-top:24px;display:flex;flex-direction:column;gap:4px;width:100%;padding:8px 14px;border-radius:8px;text-align:left;font-size:14px}::ng-deep .description-block .description-block-title{font-weight:500}::ng-deep .description-block .description-block-paragraph{font-weight:400;white-space:normal}::ng-deep .menu-action-button{justify-content:flex-start;align-items:center;max-width:100%;width:-webkit-fill-available}::ng-deep .menu-list-wrapper .menu-item{cursor:pointer;font-style:normal;color:var(--base-30);text-decoration:none;align-items:center!important;font-weight:400;background:none;border:none}::ng-deep .menu-list-wrapper .menu-item:not(button):not(.active-menu-item):hover{background-color:var(--base-70)!important}::ng-deep .menu-list-wrapper .menu-item.active-menu-item,::ng-deep .menu-list-wrapper .menu-item.active-menu-item mat-icon,::ng-deep .menu-list-wrapper .menu-item.active-menu-item:hover{font-weight:600}::ng-deep .menu-list-wrapper .menu-item span{display:inline-block}::ng-deep .menu-list-wrapper .menu-item .menu-item-title{display:flex;flex-direction:row;align-items:start;width:100%}::ng-deep .menu-list-wrapper .menu-item .menu-item-title .title-content{width:100%;text-align:start;display:block}::ng-deep .menu-list-wrapper .menu-item .menu-item-title .title-content:before{display:block;content:attr(content);font-weight:600;height:0;overflow:hidden;visibility:hidden}::ng-deep .menu-list-wrapper .menu-parent-item.active-menu-item,::ng-deep .menu-list-wrapper .menu-parent-item:hover{font-weight:400!important;background-color:var(--base-70)!important}::ng-deep .menu-tooltip{left:.625rem;font-family:Roboto;font-style:normal;font-weight:400;font-size:.75rem;line-height:1.25rem;color:var(--base-70);border-radius:.25rem;position:relative}::ng-deep .menu-tooltip:after{width:0;height:0;content:\"\";position:absolute;border-left:.5rem solid transparent;border-right:.5rem solid transparent;border-bottom:.5rem solid var(--menu-border-dark-color);left:-.75rem;top:calc(50% - .25rem);transform:rotate(270deg);overflow:initial}::ng-deep .menu-item-list-title{padding:8px 0 24px;font-size:1rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;margin-left:20px;height:56px}::ng-deep .menu-item-list-title:has(.menu-title-btn){margin-left:0}::ng-deep lib-menu-accessibility,::ng-deep lib-menu-lang-switcher,::ng-deep .menu-item-list{animation:slide-in .3s forwards}::ng-deep lib-menu-accessibility,::ng-deep lib-menu-lang-switcher,::ng-deep .menu-title-btn{margin-right:2px;transition:opacity .3s}::ng-deep .arrow-icon{margin-right:-6px}::ng-deep .mob-menu-item .arrow-icon{margin-right:0}@keyframes slide-in{0%{opacity:0;margin-left:-100px}to{opacity:1;margin-left:0}}\n"] }]
|
|
1414
1424
|
}], null, { direction: [{
|
|
1415
1425
|
type: Input
|
|
1416
1426
|
}], labelsVisible: [{
|
|
@@ -1878,11 +1888,11 @@ class MenuLangSwitcherComponent {
|
|
|
1878
1888
|
i0.ɵɵconditional(!ctx.isCollapsed() ? 7 : -1);
|
|
1879
1889
|
i0.ɵɵadvance(3);
|
|
1880
1890
|
i0.ɵɵrepeater(ctx.languages());
|
|
1881
|
-
} }, dependencies: [i4.MatTooltip, i2$1.MatIcon, i5.MatMenu, i5.MatMenuItem, i5.MatMenuTrigger, i9.TranslatePipe], styles: [".spin[_ngcontent-%COMP%]{animation:_ngcontent-%COMP%_spinArrow .3s forwards}@keyframes _ngcontent-%COMP%_spinArrow{to{transform:rotate(180deg)}}span[_ngcontent-%COMP%]{font-size:.875rem}.lang-switcher[_ngcontent-%COMP%]{white-space:nowrap;overflow:hidden;display:flex;align-items:center;color:var(--base-30);background:none;width:100%;padding:16px 8px 16px 18px;border-radius:5px}.lang-switcher.active[_ngcontent-%COMP%], .lang-switcher[_ngcontent-%COMP%]:hover{background-color:var(--base-70)}.collapsed[_ngcontent-%COMP%]{padding:0;min-width:40px;height:40px;border-radius:50%;margin-top:10px;justify-content:center;width:100%;margin-left:-
|
|
1891
|
+
} }, dependencies: [i4.MatTooltip, i2$1.MatIcon, i5.MatMenu, i5.MatMenuItem, i5.MatMenuTrigger, i9.TranslatePipe], styles: [".spin[_ngcontent-%COMP%]{animation:_ngcontent-%COMP%_spinArrow .3s forwards}@keyframes _ngcontent-%COMP%_spinArrow{to{transform:rotate(180deg)}}span[_ngcontent-%COMP%]{font-size:.875rem}.lang-switcher[_ngcontent-%COMP%]{white-space:nowrap;overflow:hidden;display:flex;align-items:center;color:var(--base-30);background:none;width:100%;padding:16px 8px 16px 18px;border-radius:5px}.lang-switcher.active[_ngcontent-%COMP%], .lang-switcher[_ngcontent-%COMP%]:hover{background-color:var(--base-70)}.collapsed[_ngcontent-%COMP%]{padding:0;min-width:40px;height:40px;border-radius:50%;margin-top:10px;justify-content:center;width:100%;margin-left:-5px}.current-lang[_ngcontent-%COMP%]{display:flex;align-items:center;width:100%;gap:12px}.collapsed[_ngcontent-%COMP%] .current-lang[_ngcontent-%COMP%]{justify-content:center;width:100%}"] }); }
|
|
1882
1892
|
}
|
|
1883
1893
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MenuLangSwitcherComponent, [{
|
|
1884
1894
|
type: Component,
|
|
1885
|
-
args: [{ selector: 'lib-menu-lang-switcher', standalone: false, template: "<button\r\n [class.collapsed]=\"isCollapsed()\"\r\n #state=\"matMenuTrigger\"\r\n [matMenuTriggerFor]=\"menu\"\r\n [matTooltip]=\"isCollapsed() ? ('MENU.CHANGE_LANGUAGE' | translate) : ''\"\r\n matTooltipPosition=\"after\"\r\n matTooltipClass=\"menu-tooltip\" \r\n class=\"lang-switcher\"\r\n [class.active]=\"state.menuOpen\"\r\n>\r\n<div class=\"current-lang\">\r\n <mat-icon>language</mat-icon>\r\n\r\n @if (!isCollapsed()) {\r\n <span>\r\n {{ languageCodeTranslations[currentLanguageCode[0]+currentLanguageCode[1]] }}\r\n </span>\r\n }\r\n</div>\r\n\r\n @if (!isCollapsed()) {\r\n @if (state.menuOpen) {\r\n <mat-icon class=\"menu-arrow spin\">keyboard_arrow_down</mat-icon>\r\n } @else {\r\n <mat-icon class=\"menu-arrow spin\">keyboard_arrow_up</mat-icon>\r\n }\r\n }\r\n</button>\r\n\r\n<mat-menu #menu=\"matMenu\" class=\"lang-menu\">\r\n @for (lang of languages(); track lang) {\r\n @if (lang !== currentLanguageCode) {\r\n <button mat-menu-item (click)=\"changeLanguage(lang)\">\r\n {{ languageCodeTranslations[lang[0]+lang[1]] }}\r\n </button>\r\n }\r\n }\r\n</mat-menu>\r\n", styles: [".spin{animation:spinArrow .3s forwards}@keyframes spinArrow{to{transform:rotate(180deg)}}span{font-size:.875rem}.lang-switcher{white-space:nowrap;overflow:hidden;display:flex;align-items:center;color:var(--base-30);background:none;width:100%;padding:16px 8px 16px 18px;border-radius:5px}.lang-switcher.active,.lang-switcher:hover{background-color:var(--base-70)}.collapsed{padding:0;min-width:40px;height:40px;border-radius:50%;margin-top:10px;justify-content:center;width:100%;margin-left:-
|
|
1895
|
+
args: [{ selector: 'lib-menu-lang-switcher', standalone: false, template: "<button\r\n [class.collapsed]=\"isCollapsed()\"\r\n #state=\"matMenuTrigger\"\r\n [matMenuTriggerFor]=\"menu\"\r\n [matTooltip]=\"isCollapsed() ? ('MENU.CHANGE_LANGUAGE' | translate) : ''\"\r\n matTooltipPosition=\"after\"\r\n matTooltipClass=\"menu-tooltip\" \r\n class=\"lang-switcher\"\r\n [class.active]=\"state.menuOpen\"\r\n>\r\n<div class=\"current-lang\">\r\n <mat-icon>language</mat-icon>\r\n\r\n @if (!isCollapsed()) {\r\n <span>\r\n {{ languageCodeTranslations[currentLanguageCode[0]+currentLanguageCode[1]] }}\r\n </span>\r\n }\r\n</div>\r\n\r\n @if (!isCollapsed()) {\r\n @if (state.menuOpen) {\r\n <mat-icon class=\"menu-arrow spin\">keyboard_arrow_down</mat-icon>\r\n } @else {\r\n <mat-icon class=\"menu-arrow spin\">keyboard_arrow_up</mat-icon>\r\n }\r\n }\r\n</button>\r\n\r\n<mat-menu #menu=\"matMenu\" class=\"lang-menu\">\r\n @for (lang of languages(); track lang) {\r\n @if (lang !== currentLanguageCode) {\r\n <button mat-menu-item (click)=\"changeLanguage(lang)\">\r\n {{ languageCodeTranslations[lang[0]+lang[1]] }}\r\n </button>\r\n }\r\n }\r\n</mat-menu>\r\n", styles: [".spin{animation:spinArrow .3s forwards}@keyframes spinArrow{to{transform:rotate(180deg)}}span{font-size:.875rem}.lang-switcher{white-space:nowrap;overflow:hidden;display:flex;align-items:center;color:var(--base-30);background:none;width:100%;padding:16px 8px 16px 18px;border-radius:5px}.lang-switcher.active,.lang-switcher:hover{background-color:var(--base-70)}.collapsed{padding:0;min-width:40px;height:40px;border-radius:50%;margin-top:10px;justify-content:center;width:100%;margin-left:-5px}.current-lang{display:flex;align-items:center;width:100%;gap:12px}.collapsed .current-lang{justify-content:center;width:100%}\n"] }]
|
|
1886
1896
|
}], null, { isCollapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "isCollapsed", required: false }] }], languages: [{ type: i0.Input, args: [{ isSignal: true, alias: "languages", required: false }] }], changeLanguageEvent: [{ type: i0.Output, args: ["changeLanguageEvent"] }], updateStorage: [{ type: i0.Input, args: [{ isSignal: true, alias: "updateStorage", required: false }] }] }); })();
|
|
1887
1897
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MenuLangSwitcherComponent, { className: "MenuLangSwitcherComponent", filePath: "lib/components/menu-lang-switcher/menu-lang-switcher.component.ts", lineNumber: 12 }); })();
|
|
1888
1898
|
|