@tilde-nlp/ngx-menu 3.0.0 → 4.1.1
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/esm2022/lib/components/menu-columns/menu-columns.component.mjs +66 -0
- package/esm2022/lib/components/menu-icon/menu-icon.component.mjs +23 -0
- package/esm2022/lib/components/menu-item-icon/menu-item-icon.component.mjs +74 -0
- package/esm2022/lib/components/menu-item-link/menu-item-link.component.mjs +52 -0
- package/esm2022/lib/components/menu-item-list/menu-item-list.component.mjs +61 -0
- package/esm2022/lib/components/modal-nav-menu/modal-nav-menu.component.mjs +39 -0
- package/esm2022/lib/components/nav-base/nav-base.component.mjs +32 -0
- package/esm2022/lib/components/side-nav-menu/side-nav-menu.component.mjs +93 -0
- package/esm2022/lib/menu.module.mjs +113 -0
- package/esm2022/lib/models/active-menu-item-config.model.mjs +2 -0
- package/esm2022/lib/models/active-menu-items.model.mjs +2 -0
- package/esm2022/lib/models/index.mjs +8 -0
- package/esm2022/lib/models/menu-shared-config.model.mjs +2 -0
- package/esm2022/lib/services/index.mjs +3 -0
- package/esm2022/lib/services/menu-items.service.mjs +125 -0
- package/{esm2020 → esm2022}/lib/services/strapi.service.mjs +5 -5
- package/esm2022/public-api.mjs +16 -0
- package/fesm2022/tilde-nlp-ngx-menu.mjs +728 -0
- package/fesm2022/tilde-nlp-ngx-menu.mjs.map +1 -0
- package/lib/components/menu-columns/menu-columns.component.d.ts +13 -33
- package/lib/components/menu-icon/menu-icon.component.d.ts +10 -0
- package/lib/components/menu-item-icon/menu-item-icon.component.d.ts +2 -3
- package/lib/components/menu-item-link/menu-item-link.component.d.ts +25 -0
- package/lib/components/menu-item-list/menu-item-list.component.d.ts +2 -9
- package/lib/components/modal-nav-menu/modal-nav-menu.component.d.ts +6 -4
- package/lib/components/nav-base/nav-base.component.d.ts +14 -8
- package/lib/components/side-nav-menu/side-nav-menu.component.d.ts +7 -5
- package/lib/menu.module.d.ts +16 -15
- package/lib/models/active-menu-item-config.model.d.ts +4 -0
- package/lib/models/active-menu-items.model.d.ts +6 -0
- package/lib/models/index.d.ts +2 -0
- package/lib/models/menu-shared-config.model.d.ts +10 -0
- package/lib/services/index.d.ts +2 -0
- package/lib/services/menu-items.service.d.ts +38 -0
- package/package.json +12 -18
- package/public-api.d.ts +1 -2
- package/esm2020/lib/components/menu-columns/menu-columns.component.mjs +0 -163
- package/esm2020/lib/components/menu-item-icon/menu-item-icon.component.mjs +0 -76
- package/esm2020/lib/components/menu-item-list/menu-item-list.component.mjs +0 -73
- package/esm2020/lib/components/menu-strapi-item-list/menu-strapi-item-list.component.mjs +0 -15
- package/esm2020/lib/components/modal-nav-menu/modal-nav-menu.component.mjs +0 -37
- package/esm2020/lib/components/nav-base/nav-base.component.mjs +0 -28
- package/esm2020/lib/components/side-nav-menu/side-nav-menu.component.mjs +0 -90
- package/esm2020/lib/menu.module.mjs +0 -109
- package/esm2020/lib/models/index.mjs +0 -6
- package/esm2020/lib/models/menu-shared-config.model.mjs +0 -2
- package/esm2020/public-api.mjs +0 -17
- package/fesm2015/tilde-nlp-ngx-menu.mjs +0 -671
- package/fesm2015/tilde-nlp-ngx-menu.mjs.map +0 -1
- package/fesm2020/tilde-nlp-ngx-menu.mjs +0 -658
- package/fesm2020/tilde-nlp-ngx-menu.mjs.map +0 -1
- package/lib/components/menu-strapi-item-list/menu-strapi-item-list.component.d.ts +0 -7
- /package/{esm2020 → esm2022}/lib/assets/menu-logo.svg.mjs +0 -0
- /package/{esm2020 → esm2022}/lib/components/menu-item-icon/menu.model.mjs +0 -0
- /package/{esm2020 → esm2022}/lib/components/menu-item-icon/models/menu-dialog-settings.model.mjs +0 -0
- /package/{esm2020 → esm2022}/lib/components/menu-item-icon/models/menu-item-settings.model.mjs +0 -0
- /package/{esm2020 → esm2022}/lib/components/menu-item-icon/models/menu-title-placement.model.mjs +0 -0
- /package/{esm2020 → esm2022}/lib/components/nav-base/models/index.mjs +0 -0
- /package/{esm2020 → esm2022}/lib/components/nav-base/models/strapi-data-location.enum.mjs +0 -0
- /package/{esm2020 → esm2022}/lib/components/side-nav-menu/index.mjs +0 -0
- /package/{esm2020 → esm2022}/lib/components/side-nav-menu/models/index.mjs +0 -0
- /package/{esm2020 → esm2022}/lib/components/side-nav-menu/models/side-nav-settings.model.mjs +0 -0
- /package/{esm2020 → esm2022}/lib/injection-tokens/index.mjs +0 -0
- /package/{esm2020 → esm2022}/lib/injection-tokens/menu-shared-config.token.mjs +0 -0
- /package/{esm2020 → esm2022}/lib/models/custom-menu-item.mjs +0 -0
- /package/{esm2020 → esm2022}/lib/models/menu-icon-strapi-extension.const.mjs +0 -0
- /package/{esm2020 → esm2022}/lib/models/menu-item-group.model.mjs +0 -0
- /package/{esm2020 → esm2022}/lib/models/menu-layout-direction.model.mjs +0 -0
- /package/{esm2020 → esm2022}/tilde-nlp-ngx-menu.mjs +0 -0
|
@@ -1,658 +0,0 @@
|
|
|
1
|
-
import * as i0 from '@angular/core';
|
|
2
|
-
import { Component, Input, Injectable, Optional, Inject, EventEmitter, Output, ViewChild, NgModule } from '@angular/core';
|
|
3
|
-
import * as i1 from '@tilde-nlp/ngx-strapi';
|
|
4
|
-
import { STRAPI_API_CONFIG_TOKEN } from '@tilde-nlp/ngx-strapi';
|
|
5
|
-
import * as i2 from '@tilde-nlp/ngx-common';
|
|
6
|
-
import { PlausibleModule } from '@tilde-nlp/ngx-common';
|
|
7
|
-
import * as i3 from '@angular/flex-layout/flex';
|
|
8
|
-
import * as i3$1 from '@angular/common';
|
|
9
|
-
import { CommonModule } from '@angular/common';
|
|
10
|
-
import * as i5$1 from '@angular/material/button';
|
|
11
|
-
import { MatButtonModule } from '@angular/material/button';
|
|
12
|
-
import * as i5 from '@angular/material/icon';
|
|
13
|
-
import { MatIconModule } from '@angular/material/icon';
|
|
14
|
-
import * as i2$1 from '@angular/router';
|
|
15
|
-
import { NavigationEnd, RouterModule } from '@angular/router';
|
|
16
|
-
import { map, filter } from 'rxjs';
|
|
17
|
-
import { CollectionTypes } from '@tilde-nlp/strapi-models';
|
|
18
|
-
import * as i4$1 from '@angular/material/divider';
|
|
19
|
-
import * as i4 from '@angular/material/tooltip';
|
|
20
|
-
import { MatTooltipModule } from '@angular/material/tooltip';
|
|
21
|
-
import * as i7 from '@ngx-translate/core';
|
|
22
|
-
import { TranslateModule } from '@ngx-translate/core';
|
|
23
|
-
import { FlexLayoutModule } from '@angular/flex-layout';
|
|
24
|
-
import { MatDialogModule } from '@angular/material/dialog';
|
|
25
|
-
import { MatListModule } from '@angular/material/list';
|
|
26
|
-
import * as i6 from '@angular/material/menu';
|
|
27
|
-
import { MatMenuModule } from '@angular/material/menu';
|
|
28
|
-
import { HttpClientModule } from '@angular/common/http';
|
|
29
|
-
|
|
30
|
-
const MENU_SHARED_CONFIG = "menu-shared-config";
|
|
31
|
-
|
|
32
|
-
/** Necessary for menu components to determine where loaded data from strapi should be placed - either in front of pre defined items or in end. */
|
|
33
|
-
var StrapiDataLocation;
|
|
34
|
-
(function (StrapiDataLocation) {
|
|
35
|
-
StrapiDataLocation[StrapiDataLocation["START"] = 0] = "START";
|
|
36
|
-
StrapiDataLocation[StrapiDataLocation["END"] = 1] = "END";
|
|
37
|
-
})(StrapiDataLocation || (StrapiDataLocation = {}));
|
|
38
|
-
|
|
39
|
-
/** This component is created to help nest some common input params through nav components. */
|
|
40
|
-
class NavBaseComponent {
|
|
41
|
-
constructor() {
|
|
42
|
-
this.hideSelectedCustomId = false;
|
|
43
|
-
this.strapiGroupBase = {};
|
|
44
|
-
this.strapiDataLocation = StrapiDataLocation.END;
|
|
45
|
-
}
|
|
46
|
-
}
|
|
47
|
-
NavBaseComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NavBaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
48
|
-
NavBaseComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NavBaseComponent, selector: "nav-base", inputs: { hideSelectedCustomId: "hideSelectedCustomId", direction: "direction", menuItemGroups: "menuItemGroups", strapiGroupBase: "strapiGroupBase", strapiDataLocation: "strapiDataLocation" }, ngImport: i0, template: "<p>nav-base works!</p>\r\n", styles: [""] });
|
|
49
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NavBaseComponent, decorators: [{
|
|
50
|
-
type: Component,
|
|
51
|
-
args: [{ selector: 'nav-base', template: "<p>nav-base works!</p>\r\n" }]
|
|
52
|
-
}], propDecorators: { hideSelectedCustomId: [{
|
|
53
|
-
type: Input
|
|
54
|
-
}], direction: [{
|
|
55
|
-
type: Input
|
|
56
|
-
}], menuItemGroups: [{
|
|
57
|
-
type: Input
|
|
58
|
-
}], strapiGroupBase: [{
|
|
59
|
-
type: Input
|
|
60
|
-
}], strapiDataLocation: [{
|
|
61
|
-
type: Input
|
|
62
|
-
}] } });
|
|
63
|
-
|
|
64
|
-
var MenuLayoutDirection;
|
|
65
|
-
(function (MenuLayoutDirection) {
|
|
66
|
-
MenuLayoutDirection["column"] = "column";
|
|
67
|
-
MenuLayoutDirection["row"] = "row";
|
|
68
|
-
})(MenuLayoutDirection || (MenuLayoutDirection = {}));
|
|
69
|
-
|
|
70
|
-
const MENU_ICON_STRAPI_EXTENSION = ".svg";
|
|
71
|
-
|
|
72
|
-
class StarpiMenuService {
|
|
73
|
-
constructor(strapiSubscription, menuConfig, strapiConfig, iconService) {
|
|
74
|
-
this.strapiSubscription = strapiSubscription;
|
|
75
|
-
this.menuConfig = menuConfig;
|
|
76
|
-
this.iconService = iconService;
|
|
77
|
-
this.svgIconNamePrefix = "strapi-menu-icon-";
|
|
78
|
-
this.imgBaseUrl = '';
|
|
79
|
-
this.imgBaseUrl = strapiConfig.apiUrl;
|
|
80
|
-
}
|
|
81
|
-
getMenuItems() {
|
|
82
|
-
const responseObs = this.strapiSubscription.subscribeCollectionType(CollectionTypes.MENU_ITEMS)
|
|
83
|
-
.pipe(map((items) => {
|
|
84
|
-
// Remove disabled items so they are not processed later.
|
|
85
|
-
const convertedItems = [];
|
|
86
|
-
if (!items || items.length === 0) {
|
|
87
|
-
return convertedItems;
|
|
88
|
-
}
|
|
89
|
-
items = items.filter(item => !item.disabled);
|
|
90
|
-
items.forEach((menu) => {
|
|
91
|
-
menu.link = this.addBaseUrlIfNecessary(menu.link);
|
|
92
|
-
const originalMenuIcon = menu.icon.data.attributes;
|
|
93
|
-
if (originalMenuIcon.url.startsWith('/')) {
|
|
94
|
-
originalMenuIcon.url = this.imgBaseUrl + originalMenuIcon.url;
|
|
95
|
-
}
|
|
96
|
-
if (originalMenuIcon.ext === MENU_ICON_STRAPI_EXTENSION) {
|
|
97
|
-
// add custom prefix so that it is not easy to mix with other icons in registry
|
|
98
|
-
menu.icon.data.attributes.name = this.svgIconNamePrefix + originalMenuIcon.name;
|
|
99
|
-
this.iconService.registerIconFromUrl(originalMenuIcon.name, originalMenuIcon.url);
|
|
100
|
-
}
|
|
101
|
-
convertedItems.push(this.convertToCustomMenuItem(menu));
|
|
102
|
-
});
|
|
103
|
-
return convertedItems;
|
|
104
|
-
}));
|
|
105
|
-
return responseObs;
|
|
106
|
-
}
|
|
107
|
-
unsubscribe() {
|
|
108
|
-
this.strapiSubscription.unsubscribe(CollectionTypes.MENU_ITEMS);
|
|
109
|
-
}
|
|
110
|
-
addBaseUrlIfNecessary(link) {
|
|
111
|
-
if (!this.menuConfig?.baseUrl) {
|
|
112
|
-
return link;
|
|
113
|
-
}
|
|
114
|
-
try {
|
|
115
|
-
new URL(link);
|
|
116
|
-
// eslint-disable-next-line no-empty
|
|
117
|
-
}
|
|
118
|
-
catch { }
|
|
119
|
-
try {
|
|
120
|
-
return new URL(link, this.menuConfig.baseUrl).href;
|
|
121
|
-
}
|
|
122
|
-
catch {
|
|
123
|
-
return link;
|
|
124
|
-
}
|
|
125
|
-
}
|
|
126
|
-
convertToCustomMenuItem(item) {
|
|
127
|
-
return {
|
|
128
|
-
icon: item.icon.data.attributes.name,
|
|
129
|
-
link: item.link,
|
|
130
|
-
title: item.title,
|
|
131
|
-
externalLink: item.externalLink,
|
|
132
|
-
// Material icons should not come from strapi
|
|
133
|
-
materialIcon: false,
|
|
134
|
-
plausibleEvent: item.plausibleEvent,
|
|
135
|
-
customId: item.customId
|
|
136
|
-
};
|
|
137
|
-
}
|
|
138
|
-
}
|
|
139
|
-
StarpiMenuService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: StarpiMenuService, deps: [{ token: i1.StrapiSubscriptionService }, { token: MENU_SHARED_CONFIG, optional: true }, { token: STRAPI_API_CONFIG_TOKEN }, { token: i2.IconService }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
140
|
-
StarpiMenuService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: StarpiMenuService, providedIn: 'root' });
|
|
141
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: StarpiMenuService, decorators: [{
|
|
142
|
-
type: Injectable,
|
|
143
|
-
args: [{
|
|
144
|
-
providedIn: 'root'
|
|
145
|
-
}]
|
|
146
|
-
}], ctorParameters: function () { return [{ type: i1.StrapiSubscriptionService }, { type: undefined, decorators: [{
|
|
147
|
-
type: Optional
|
|
148
|
-
}, {
|
|
149
|
-
type: Inject,
|
|
150
|
-
args: [MENU_SHARED_CONFIG]
|
|
151
|
-
}] }, { type: undefined, decorators: [{
|
|
152
|
-
type: Inject,
|
|
153
|
-
args: [STRAPI_API_CONFIG_TOKEN]
|
|
154
|
-
}] }, { type: i2.IconService }]; } });
|
|
155
|
-
|
|
156
|
-
class MenuItemListComponent {
|
|
157
|
-
get titleKey() {
|
|
158
|
-
return this.menuItemGroup?.title;
|
|
159
|
-
}
|
|
160
|
-
get showTitle() {
|
|
161
|
-
return this.menuItemGroup?.showTitle;
|
|
162
|
-
}
|
|
163
|
-
get menuLayoutDirection() {
|
|
164
|
-
return this.direction === MenuLayoutDirection.column
|
|
165
|
-
? 'start center'
|
|
166
|
-
: (!this.labelsVisible ? 'start center' : 'start start');
|
|
167
|
-
}
|
|
168
|
-
get menuItemLayout() {
|
|
169
|
-
return this.direction === MenuLayoutDirection.column ? 'column' : 'row';
|
|
170
|
-
}
|
|
171
|
-
constructor(strapiLinkService) {
|
|
172
|
-
this.strapiLinkService = strapiLinkService;
|
|
173
|
-
this.direction = MenuLayoutDirection.column;
|
|
174
|
-
this.labelsVisible = true;
|
|
175
|
-
this.showIcons = true;
|
|
176
|
-
this.showChildren = true;
|
|
177
|
-
this.items = [];
|
|
178
|
-
this.toggleExpand = new EventEmitter();
|
|
179
|
-
this.svgExtension = MENU_ICON_STRAPI_EXTENSION;
|
|
180
|
-
}
|
|
181
|
-
linkClick(event, item) {
|
|
182
|
-
this.strapiLinkService.strapiLinkClick(event, item.externalLink);
|
|
183
|
-
}
|
|
184
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
185
|
-
isIconMediaType(icon) {
|
|
186
|
-
return typeof icon !== "string";
|
|
187
|
-
}
|
|
188
|
-
toggleItemExpand(event, menuItem) {
|
|
189
|
-
// so menu doesnt get closed.
|
|
190
|
-
event.stopPropagation();
|
|
191
|
-
menuItem.expanded = !menuItem.expanded;
|
|
192
|
-
this.toggleExpand.next(menuItem);
|
|
193
|
-
}
|
|
194
|
-
}
|
|
195
|
-
MenuItemListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: MenuItemListComponent, deps: [{ token: i1.StrapiLinkService }], target: i0.ɵɵFactoryTarget.Component });
|
|
196
|
-
MenuItemListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: MenuItemListComponent, selector: "menu-item-list", inputs: { direction: "direction", labelsVisible: "labelsVisible", activeItem: "activeItem", showIcons: "showIcons", showChildren: "showChildren", items: "items", menuItemGroup: "menuItemGroup" }, outputs: { toggleExpand: "toggleExpand" }, ngImport: i0, template: "<div class=\"menu-list-wrapper\">\r\n <div *ngIf=\"titleKey && showTitle && labelsVisible\" fxLayoutAlign=\"start center\" class=\"menu-item-list-title\">\r\n {{ titleKey | translate }}\r\n </div>\r\n <div fxLayout=\"column\" [fxLayoutAlign]=\"menuLayoutDirection\" class=\"menu-item-list\">\r\n <ng-container *ngFor=\"let menuItem of items\">\r\n <ng-container\r\n *ngTemplateOutlet=\"!showChildren || !menuItem.children || menuItem.children.length === 0 ? menuItemLink : itemWithChildren; context: {menuItem: menuItem}\">\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n</div>\r\n\r\n<ng-template #itemWithChildren let-menuItem=\"menuItem\">\r\n <button [fxLayout]=\"menuItemLayout\" [class.text-center]=\"menuItemLayout === 'column'\" class=\"text-m menu-item\"\r\n [matTooltip]=\"!labelsVisible ? (menuItem.title | translate) : ''\" matTooltipPosition=\"after\"\r\n [fxLayoutAlign]=\"menuLayoutDirection\" matTooltipClass=\"menu-tooltip\" fxLayoutGap=\"0.375rem\"\r\n [class.active-menu-item]=\"menuItem === activeItem\" (click)=\"toggleItemExpand($event,menuItem)\">\r\n <ng-container *ngIf=\"showIcons && menuItem.icon\">\r\n <ng-template\r\n *ngTemplateOutlet=\"isIconMediaType(menuItem.icon) ? iconImgTemplate : svgIconTemplate; context: { menuItem:menuItem }\">\r\n </ng-template>\r\n </ng-container>\r\n <span *ngIf=\"labelsVisible\" class=\"menu-item-title\">\r\n <span class=\"title-content\">{{ menuItem.title | translate }}</span></span>\r\n <span class=\"material-icons\" *ngIf=\"showChildren && menuItem.children\">\r\n {{menuItem.expanded? 'expand_more' : 'navigate_next'}}\r\n </span>\r\n </button>\r\n <ng-container *ngIf=\"showChildren && menuItem.expanded\">\r\n <menu-item-list class=\"child-list\" *ngIf=\"menuItem.children && menuItem.children.length\" [items]=\"menuItem.children\"\r\n [direction]=\"direction\" [labelsVisible]=\"labelsVisible\" [activeItem]=\"activeItem\" [showIcons]=\"false\">\r\n </menu-item-list>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #menuItemLink let-menuItem=\"menuItem\">\r\n <a [libPlausibleEvent]=\"menuItem.plausibleEvent\" [fxLayout]=\"menuItemLayout\"\r\n [class.text-center]=\"menuItemLayout === 'column'\" class=\"text-m menu-item\"\r\n [matTooltip]=\"!labelsVisible ? (menuItem.title | translate) : ''\" matTooltipPosition=\"after\"\r\n [fxLayoutAlign]=\"menuLayoutDirection\" matTooltipClass=\"menu-tooltip\" (click)=\"linkClick($event, menuItem)\"\r\n [href]=\"menuItem.link\" [attr.target]=\"menuItem.externalLink?'_blank': '_self'\" fxLayoutGap=\"0.375rem\"\r\n [class.active-menu-item]=\"menuItem === activeItem\">\r\n <ng-container *ngIf=\"showIcons && menuItem.icon\">\r\n <ng-template\r\n *ngTemplateOutlet=\"isIconMediaType(menuItem.icon) ? iconImgTemplate : svgIconTemplate; context: { menuItem:menuItem }\">\r\n </ng-template>\r\n </ng-container>\r\n <span *ngIf=\"labelsVisible\" class=\"menu-item-title\">\r\n <span class=\"title-content\" [attr.content]=\"menuItem.title | translate\">\r\n {{ menuItem.title | translate}}\r\n </span>\r\n </span>\r\n </a>\r\n</ng-template>\r\n\r\n<ng-template #iconImgTemplate let-icon=\"menuItem.icon\">\r\n <mat-icon class=\"menu-icon\" *ngIf=\"icon.ext===svgExtension; else nonSvgTemplate;\" [svgIcon]=\"icon.name\"></mat-icon>\r\n <ng-template #nonSvgTemplate>\r\n <img class=\"menu-icon\" [src]=\"icon.url\" [alt]=\"icon.alternativeText\" />\r\n </ng-template>\r\n</ng-template>\r\n\r\n\r\n<ng-template #svgIconTemplate let-menuItem=\"menuItem\">\r\n <mat-icon class=\"menu-icon\" [svgIcon]=\"menuItem.icon\" *ngIf=\"!menuItem.materialIcon; else materialIcon;\"></mat-icon>\r\n <ng-template #materialIcon>\r\n <mat-icon class=\"menu-icon\">{{menuItem.icon}}</mat-icon>\r\n </ng-template>\r\n</ng-template>\r\n", styles: [":host{margin:1em 0;display:inline-block}:host::ng-deep .menu-list-wrapper .menu-item-list-title{margin-bottom:1em;font-size:1rem;font-weight:500;line-height:1.5rem}:host::ng-deep .menu-list-wrapper .text-center{text-align:center}:host::ng-deep .menu-list-wrapper .menu-item{cursor:pointer;font-family:Inter;font-style:normal;color:var(--base-30);text-decoration:none;align-items:center!important;font-weight:400;background:none;border:none}:host::ng-deep .menu-list-wrapper .menu-item:focus-visible{outline:black solid 2px}:host::ng-deep .menu-list-wrapper .menu-item:hover{font-weight:600}:host::ng-deep .menu-list-wrapper .menu-item+.menu-item{margin-top:1.5625em}:host::ng-deep .menu-list-wrapper .menu-item.active-menu-item,:host::ng-deep .menu-list-wrapper .menu-item.active-menu-item mat-icon,:host::ng-deep .menu-list-wrapper .menu-item.active-menu-item:hover{color:var(--primary-accent)!important}:host::ng-deep .menu-list-wrapper .menu-item span{display:inline-block}:host::ng-deep .menu-list-wrapper .menu-item .menu-item-title{display:flex;flex-direction:row;flex-grow:100;align-items:start}:host::ng-deep .menu-list-wrapper .menu-item .menu-item-title .title-content{display:block}:host::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}:host::ng-deep .menu-list-wrapper .menu-icon{color:var(--base-40);margin:auto;min-width:24px;min-height:24px;max-width:24px;max-height:24px}:host.child-list{margin-top:1rem;margin-bottom:1rem}:host.child-list .menu-item+.menu-item{margin-top:.5rem}::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}menu-item-list{padding-left:3rem;margin:0}\n"], dependencies: [{ kind: "directive", type: i3.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i3.DefaultLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i3.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i2.PlausibleEventDirective, selector: "[libPlausibleEvent]", inputs: ["libPlausibleEvent"] }, { kind: "component", type: MenuItemListComponent, selector: "menu-item-list", inputs: ["direction", "labelsVisible", "activeItem", "showIcons", "showChildren", "items", "menuItemGroup"], outputs: ["toggleExpand"] }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }] });
|
|
197
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: MenuItemListComponent, decorators: [{
|
|
198
|
-
type: Component,
|
|
199
|
-
args: [{ selector: 'menu-item-list', template: "<div class=\"menu-list-wrapper\">\r\n <div *ngIf=\"titleKey && showTitle && labelsVisible\" fxLayoutAlign=\"start center\" class=\"menu-item-list-title\">\r\n {{ titleKey | translate }}\r\n </div>\r\n <div fxLayout=\"column\" [fxLayoutAlign]=\"menuLayoutDirection\" class=\"menu-item-list\">\r\n <ng-container *ngFor=\"let menuItem of items\">\r\n <ng-container\r\n *ngTemplateOutlet=\"!showChildren || !menuItem.children || menuItem.children.length === 0 ? menuItemLink : itemWithChildren; context: {menuItem: menuItem}\">\r\n </ng-container>\r\n </ng-container>\r\n </div>\r\n</div>\r\n\r\n<ng-template #itemWithChildren let-menuItem=\"menuItem\">\r\n <button [fxLayout]=\"menuItemLayout\" [class.text-center]=\"menuItemLayout === 'column'\" class=\"text-m menu-item\"\r\n [matTooltip]=\"!labelsVisible ? (menuItem.title | translate) : ''\" matTooltipPosition=\"after\"\r\n [fxLayoutAlign]=\"menuLayoutDirection\" matTooltipClass=\"menu-tooltip\" fxLayoutGap=\"0.375rem\"\r\n [class.active-menu-item]=\"menuItem === activeItem\" (click)=\"toggleItemExpand($event,menuItem)\">\r\n <ng-container *ngIf=\"showIcons && menuItem.icon\">\r\n <ng-template\r\n *ngTemplateOutlet=\"isIconMediaType(menuItem.icon) ? iconImgTemplate : svgIconTemplate; context: { menuItem:menuItem }\">\r\n </ng-template>\r\n </ng-container>\r\n <span *ngIf=\"labelsVisible\" class=\"menu-item-title\">\r\n <span class=\"title-content\">{{ menuItem.title | translate }}</span></span>\r\n <span class=\"material-icons\" *ngIf=\"showChildren && menuItem.children\">\r\n {{menuItem.expanded? 'expand_more' : 'navigate_next'}}\r\n </span>\r\n </button>\r\n <ng-container *ngIf=\"showChildren && menuItem.expanded\">\r\n <menu-item-list class=\"child-list\" *ngIf=\"menuItem.children && menuItem.children.length\" [items]=\"menuItem.children\"\r\n [direction]=\"direction\" [labelsVisible]=\"labelsVisible\" [activeItem]=\"activeItem\" [showIcons]=\"false\">\r\n </menu-item-list>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #menuItemLink let-menuItem=\"menuItem\">\r\n <a [libPlausibleEvent]=\"menuItem.plausibleEvent\" [fxLayout]=\"menuItemLayout\"\r\n [class.text-center]=\"menuItemLayout === 'column'\" class=\"text-m menu-item\"\r\n [matTooltip]=\"!labelsVisible ? (menuItem.title | translate) : ''\" matTooltipPosition=\"after\"\r\n [fxLayoutAlign]=\"menuLayoutDirection\" matTooltipClass=\"menu-tooltip\" (click)=\"linkClick($event, menuItem)\"\r\n [href]=\"menuItem.link\" [attr.target]=\"menuItem.externalLink?'_blank': '_self'\" fxLayoutGap=\"0.375rem\"\r\n [class.active-menu-item]=\"menuItem === activeItem\">\r\n <ng-container *ngIf=\"showIcons && menuItem.icon\">\r\n <ng-template\r\n *ngTemplateOutlet=\"isIconMediaType(menuItem.icon) ? iconImgTemplate : svgIconTemplate; context: { menuItem:menuItem }\">\r\n </ng-template>\r\n </ng-container>\r\n <span *ngIf=\"labelsVisible\" class=\"menu-item-title\">\r\n <span class=\"title-content\" [attr.content]=\"menuItem.title | translate\">\r\n {{ menuItem.title | translate}}\r\n </span>\r\n </span>\r\n </a>\r\n</ng-template>\r\n\r\n<ng-template #iconImgTemplate let-icon=\"menuItem.icon\">\r\n <mat-icon class=\"menu-icon\" *ngIf=\"icon.ext===svgExtension; else nonSvgTemplate;\" [svgIcon]=\"icon.name\"></mat-icon>\r\n <ng-template #nonSvgTemplate>\r\n <img class=\"menu-icon\" [src]=\"icon.url\" [alt]=\"icon.alternativeText\" />\r\n </ng-template>\r\n</ng-template>\r\n\r\n\r\n<ng-template #svgIconTemplate let-menuItem=\"menuItem\">\r\n <mat-icon class=\"menu-icon\" [svgIcon]=\"menuItem.icon\" *ngIf=\"!menuItem.materialIcon; else materialIcon;\"></mat-icon>\r\n <ng-template #materialIcon>\r\n <mat-icon class=\"menu-icon\">{{menuItem.icon}}</mat-icon>\r\n </ng-template>\r\n</ng-template>\r\n", styles: [":host{margin:1em 0;display:inline-block}:host::ng-deep .menu-list-wrapper .menu-item-list-title{margin-bottom:1em;font-size:1rem;font-weight:500;line-height:1.5rem}:host::ng-deep .menu-list-wrapper .text-center{text-align:center}:host::ng-deep .menu-list-wrapper .menu-item{cursor:pointer;font-family:Inter;font-style:normal;color:var(--base-30);text-decoration:none;align-items:center!important;font-weight:400;background:none;border:none}:host::ng-deep .menu-list-wrapper .menu-item:focus-visible{outline:black solid 2px}:host::ng-deep .menu-list-wrapper .menu-item:hover{font-weight:600}:host::ng-deep .menu-list-wrapper .menu-item+.menu-item{margin-top:1.5625em}:host::ng-deep .menu-list-wrapper .menu-item.active-menu-item,:host::ng-deep .menu-list-wrapper .menu-item.active-menu-item mat-icon,:host::ng-deep .menu-list-wrapper .menu-item.active-menu-item:hover{color:var(--primary-accent)!important}:host::ng-deep .menu-list-wrapper .menu-item span{display:inline-block}:host::ng-deep .menu-list-wrapper .menu-item .menu-item-title{display:flex;flex-direction:row;flex-grow:100;align-items:start}:host::ng-deep .menu-list-wrapper .menu-item .menu-item-title .title-content{display:block}:host::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}:host::ng-deep .menu-list-wrapper .menu-icon{color:var(--base-40);margin:auto;min-width:24px;min-height:24px;max-width:24px;max-height:24px}:host.child-list{margin-top:1rem;margin-bottom:1rem}:host.child-list .menu-item+.menu-item{margin-top:.5rem}::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}menu-item-list{padding-left:3rem;margin:0}\n"] }]
|
|
200
|
-
}], ctorParameters: function () { return [{ type: i1.StrapiLinkService }]; }, propDecorators: { direction: [{
|
|
201
|
-
type: Input
|
|
202
|
-
}], labelsVisible: [{
|
|
203
|
-
type: Input
|
|
204
|
-
}], activeItem: [{
|
|
205
|
-
type: Input
|
|
206
|
-
}], showIcons: [{
|
|
207
|
-
type: Input
|
|
208
|
-
}], showChildren: [{
|
|
209
|
-
type: Input
|
|
210
|
-
}], items: [{
|
|
211
|
-
type: Input
|
|
212
|
-
}], menuItemGroup: [{
|
|
213
|
-
type: Input
|
|
214
|
-
}], toggleExpand: [{
|
|
215
|
-
type: Output
|
|
216
|
-
}] } });
|
|
217
|
-
|
|
218
|
-
class MenuColumnsComponent {
|
|
219
|
-
get customId() {
|
|
220
|
-
return this.menuSharedConfig?.customId;
|
|
221
|
-
}
|
|
222
|
-
get strapiGroup() { return this._strapiGroup; }
|
|
223
|
-
get menuItemGroups() { return this._menuItemGroups; }
|
|
224
|
-
set menuItemGroups(groups) {
|
|
225
|
-
this._menuItemGroups = groups ?? [];
|
|
226
|
-
}
|
|
227
|
-
get mergedGroups() { return this._mergedGroups; }
|
|
228
|
-
get allRootItems() {
|
|
229
|
-
const allItems = this.mergedGroups.map(map => map.items);
|
|
230
|
-
let newArray = [];
|
|
231
|
-
allItems.forEach((array) => { newArray = newArray.concat(array); });
|
|
232
|
-
return newArray;
|
|
233
|
-
}
|
|
234
|
-
constructor(strapiService, router, menuSharedConfig) {
|
|
235
|
-
this.strapiService = strapiService;
|
|
236
|
-
this.router = router;
|
|
237
|
-
this.menuSharedConfig = menuSharedConfig;
|
|
238
|
-
this.direction = MenuLayoutDirection.column;
|
|
239
|
-
this.hideSelectedCustomId = false;
|
|
240
|
-
this.strapiGroupBase = {};
|
|
241
|
-
this.strapiDataLocation = StrapiDataLocation.END;
|
|
242
|
-
this.labelsVisible = true;
|
|
243
|
-
this._menuItemGroups = [];
|
|
244
|
-
this.subscribedToStrapi = false;
|
|
245
|
-
this.strapiItems = [];
|
|
246
|
-
this._mergedGroups = [];
|
|
247
|
-
this.subscriptions = [];
|
|
248
|
-
this.isActiveMatchOptions = {
|
|
249
|
-
matrixParams: 'exact',
|
|
250
|
-
queryParams: 'exact',
|
|
251
|
-
paths: 'exact',
|
|
252
|
-
fragment: 'exact'
|
|
253
|
-
};
|
|
254
|
-
}
|
|
255
|
-
ngOnInit() {
|
|
256
|
-
this.subscribeOnRouteChange();
|
|
257
|
-
this.getStrapiData();
|
|
258
|
-
}
|
|
259
|
-
ngOnDestroy() {
|
|
260
|
-
this.subscriptions.forEach(sub => sub.unsubscribe());
|
|
261
|
-
if (this.subscribedToStrapi) {
|
|
262
|
-
this.strapiService.unsubscribe();
|
|
263
|
-
}
|
|
264
|
-
}
|
|
265
|
-
elementExpanded(element) {
|
|
266
|
-
if (!this.activeItem) {
|
|
267
|
-
return;
|
|
268
|
-
}
|
|
269
|
-
// if active item is expanded, most likely some of his child should be active, or if it is collapsed, most likely parent should be active if no route change.
|
|
270
|
-
if (element !== this.activeItem && !element.children?.includes(this.activeItem)) {
|
|
271
|
-
return;
|
|
272
|
-
}
|
|
273
|
-
this.changeActiveElement();
|
|
274
|
-
}
|
|
275
|
-
getStrapiData() {
|
|
276
|
-
if (!this.menuSharedConfig?.disableStrapi) {
|
|
277
|
-
this.subscribedToStrapi = true;
|
|
278
|
-
this.strapiService.getMenuItems().subscribe(this.loadData.bind(this));
|
|
279
|
-
}
|
|
280
|
-
}
|
|
281
|
-
loadData(data) {
|
|
282
|
-
// hide custom id based on input param
|
|
283
|
-
this.strapiItems = (this.hideSelectedCustomId && this.customId) ? data.filter(item => item.customId !== this.customId) : data;
|
|
284
|
-
this._strapiGroup = {
|
|
285
|
-
...this.strapiGroupBase,
|
|
286
|
-
items: this.strapiItems
|
|
287
|
-
};
|
|
288
|
-
if (this.strapiDataLocation === StrapiDataLocation.START) {
|
|
289
|
-
this._mergedGroups = [this.strapiGroup, ...this.menuItemGroups];
|
|
290
|
-
}
|
|
291
|
-
else if (this.strapiDataLocation === StrapiDataLocation.END) {
|
|
292
|
-
this._mergedGroups = [...this.menuItemGroups, this.strapiGroup];
|
|
293
|
-
}
|
|
294
|
-
this.changeActiveElement();
|
|
295
|
-
}
|
|
296
|
-
subscribeOnRouteChange() {
|
|
297
|
-
const subscription = this.router.events
|
|
298
|
-
.pipe(filter(e => e instanceof NavigationEnd))
|
|
299
|
-
.subscribe(() => { this.changeActiveElement(); });
|
|
300
|
-
this.subscriptions.push(subscription);
|
|
301
|
-
}
|
|
302
|
-
changeActiveElement() {
|
|
303
|
-
this.activeItem = this.findActiveElement(this.allRootItems);
|
|
304
|
-
}
|
|
305
|
-
/** Finds active element from whole list. RouterLink has priority over custom Id. */
|
|
306
|
-
// at this version, child elements should not have customId, since that property comes from strapi and strapi provides only one level structure
|
|
307
|
-
findActiveElement(list) {
|
|
308
|
-
if (!list) {
|
|
309
|
-
return null;
|
|
310
|
-
}
|
|
311
|
-
let customIdElement = null;
|
|
312
|
-
for (const item of list) {
|
|
313
|
-
// Child element has priority over parent, so need to check if any child is active
|
|
314
|
-
if (this.isElementRouterLinkActive(item)) {
|
|
315
|
-
// If has children and they are visible, return active child or current item
|
|
316
|
-
return this.showChildren && item.expanded ? this.findActiveElement(item.children) ?? item : item;
|
|
317
|
-
}
|
|
318
|
-
// if selected custom id element is hidden, no need to look for it and set it to active;
|
|
319
|
-
else if (!this.hideSelectedCustomId && this.isElementCustomIdActive(item)) {
|
|
320
|
-
customIdElement = item;
|
|
321
|
-
}
|
|
322
|
-
else if (this.showChildren && item.children?.length) {
|
|
323
|
-
const activeChild = this.findActiveElement(item.children);
|
|
324
|
-
if (activeChild) {
|
|
325
|
-
return activeChild;
|
|
326
|
-
}
|
|
327
|
-
}
|
|
328
|
-
}
|
|
329
|
-
return customIdElement;
|
|
330
|
-
}
|
|
331
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
332
|
-
// private isMenuItem(item: any): item is MenuItems {
|
|
333
|
-
// return item.customId;
|
|
334
|
-
// }
|
|
335
|
-
isElementCustomIdActive(element) {
|
|
336
|
-
return this.customId && element.customId === this.customId;
|
|
337
|
-
}
|
|
338
|
-
isElementRouterLinkActive(element) {
|
|
339
|
-
const routerLinkActiveOptions = element.routerLinkActiveOptions ?? this.menuSharedConfig.activeMatchOptions ?? this.isActiveMatchOptions;
|
|
340
|
-
return this.router.isActive(element.link, routerLinkActiveOptions);
|
|
341
|
-
}
|
|
342
|
-
}
|
|
343
|
-
MenuColumnsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: MenuColumnsComponent, deps: [{ token: StarpiMenuService }, { token: i2$1.Router }, { token: MENU_SHARED_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
344
|
-
MenuColumnsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: MenuColumnsComponent, selector: "menu-columns", inputs: { direction: "direction", hideSelectedCustomId: "hideSelectedCustomId", strapiGroupBase: "strapiGroupBase", strapiDataLocation: "strapiDataLocation", labelsVisible: "labelsVisible", showChildren: "showChildren", menuItemGroups: "menuItemGroups" }, ngImport: i0, template: "<ng-container *ngFor=\"let group of mergedGroups\">\r\n <menu-item-list *ngIf=\"group.items.length\" [activeItem]=\"activeItem\" [direction]=\"direction\" (toggleExpand)=\"elementExpanded($event)\"\r\n [labelsVisible]=\"labelsVisible\" [menuItemGroup]=\"group\" [items]=\"group.items\" [showChildren]=\"showChildren\">\r\n </menu-item-list>\r\n <div class=\"divider\" *ngIf=\"group.bottomDivider\">\r\n <mat-divider></mat-divider>\r\n </div>\r\n</ng-container>\r\n", styles: [":host{display:inline-block}:host menu-item-list{display:block}\n"], dependencies: [{ kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4$1.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "component", type: MenuItemListComponent, selector: "menu-item-list", inputs: ["direction", "labelsVisible", "activeItem", "showIcons", "showChildren", "items", "menuItemGroup"], outputs: ["toggleExpand"] }] });
|
|
345
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: MenuColumnsComponent, decorators: [{
|
|
346
|
-
type: Component,
|
|
347
|
-
args: [{ selector: 'menu-columns', template: "<ng-container *ngFor=\"let group of mergedGroups\">\r\n <menu-item-list *ngIf=\"group.items.length\" [activeItem]=\"activeItem\" [direction]=\"direction\" (toggleExpand)=\"elementExpanded($event)\"\r\n [labelsVisible]=\"labelsVisible\" [menuItemGroup]=\"group\" [items]=\"group.items\" [showChildren]=\"showChildren\">\r\n </menu-item-list>\r\n <div class=\"divider\" *ngIf=\"group.bottomDivider\">\r\n <mat-divider></mat-divider>\r\n </div>\r\n</ng-container>\r\n", styles: [":host{display:inline-block}:host menu-item-list{display:block}\n"] }]
|
|
348
|
-
}], ctorParameters: function () { return [{ type: StarpiMenuService }, { type: i2$1.Router }, { type: undefined, decorators: [{
|
|
349
|
-
type: Optional
|
|
350
|
-
}, {
|
|
351
|
-
type: Inject,
|
|
352
|
-
args: [MENU_SHARED_CONFIG]
|
|
353
|
-
}] }]; }, propDecorators: { direction: [{
|
|
354
|
-
type: Input
|
|
355
|
-
}], hideSelectedCustomId: [{
|
|
356
|
-
type: Input
|
|
357
|
-
}], strapiGroupBase: [{
|
|
358
|
-
type: Input
|
|
359
|
-
}], strapiDataLocation: [{
|
|
360
|
-
type: Input
|
|
361
|
-
}], labelsVisible: [{
|
|
362
|
-
type: Input
|
|
363
|
-
}], showChildren: [{
|
|
364
|
-
type: Input
|
|
365
|
-
}], menuItemGroups: [{
|
|
366
|
-
type: Input
|
|
367
|
-
}] } });
|
|
368
|
-
|
|
369
|
-
class SideNavMenuComponent extends NavBaseComponent {
|
|
370
|
-
get menuLogoImage() {
|
|
371
|
-
return this.collapsed
|
|
372
|
-
? this.menuSettings.menuLogoCollapsed ?? this.menuSettings.menuLogo
|
|
373
|
-
: this.menuSettings.menuLogo;
|
|
374
|
-
}
|
|
375
|
-
get sideNavWidth() {
|
|
376
|
-
return this.collapsed ? this.menuSettings.collapsedWidth : this.menuSettings.expandedWidth;
|
|
377
|
-
}
|
|
378
|
-
constructor(strapiLinkService, domService, menuSharedConfig) {
|
|
379
|
-
super();
|
|
380
|
-
this.strapiLinkService = strapiLinkService;
|
|
381
|
-
this.domService = domService;
|
|
382
|
-
this.COLLAPSED_LOCAL_STORAGE_KEY = "TLD_MENU_SIDE_NAV_COLLAPSED";
|
|
383
|
-
//#region Plausible event variables for collapse button
|
|
384
|
-
this.COLLAPSE_PLAUSIBLE_EVENT_ID = "collapseMenu";
|
|
385
|
-
this.COLLAPSE_PLAUSIBLE_ACTION_KEY = "action";
|
|
386
|
-
this.LOGOCLICK_PLAUSIBLE_ACTION_ID = "tilde_logo_click";
|
|
387
|
-
this.LOGOCLICK_PLAUSIBLE_EVENT = {
|
|
388
|
-
eventId: this.LOGOCLICK_PLAUSIBLE_ACTION_ID,
|
|
389
|
-
properties: []
|
|
390
|
-
};
|
|
391
|
-
this.EXPAND_PLAUSIBLE_EVENT = {
|
|
392
|
-
eventId: this.COLLAPSE_PLAUSIBLE_EVENT_ID,
|
|
393
|
-
properties: [{ key: this.COLLAPSE_PLAUSIBLE_ACTION_KEY, value: "expand" }]
|
|
394
|
-
};
|
|
395
|
-
this.COLLAPSE_PLAUSIBLE_EVENT = {
|
|
396
|
-
eventId: this.COLLAPSE_PLAUSIBLE_EVENT_ID,
|
|
397
|
-
properties: [{ key: this.COLLAPSE_PLAUSIBLE_ACTION_KEY, value: "collapse" }]
|
|
398
|
-
};
|
|
399
|
-
//#endregion
|
|
400
|
-
this.menuSettings = {
|
|
401
|
-
expandedWidth: '9.375em',
|
|
402
|
-
collapsedWidth: '5em',
|
|
403
|
-
menuLogo: '',
|
|
404
|
-
menuLogoCollapsed: '',
|
|
405
|
-
disableStrapi: false
|
|
406
|
-
};
|
|
407
|
-
this.collapsed = false;
|
|
408
|
-
this.baseUrl = menuSharedConfig.baseUrl || '';
|
|
409
|
-
}
|
|
410
|
-
ngOnInit() {
|
|
411
|
-
this.getColapsedFromLocalStorage();
|
|
412
|
-
}
|
|
413
|
-
logoClick(event) {
|
|
414
|
-
this.strapiLinkService.strapiLinkClick(event);
|
|
415
|
-
}
|
|
416
|
-
toggleCollapse() {
|
|
417
|
-
this.collapsed = !this.collapsed;
|
|
418
|
-
this.setColapsedFromLocalStorage();
|
|
419
|
-
}
|
|
420
|
-
getColapsedFromLocalStorage() {
|
|
421
|
-
if (!this.domService.localStorage) {
|
|
422
|
-
return;
|
|
423
|
-
}
|
|
424
|
-
this.collapsed = this.domService.localStorage.getItem(this.COLLAPSED_LOCAL_STORAGE_KEY) == 'true' ? true : false;
|
|
425
|
-
}
|
|
426
|
-
setColapsedFromLocalStorage() {
|
|
427
|
-
if (!this.domService.localStorage) {
|
|
428
|
-
return;
|
|
429
|
-
}
|
|
430
|
-
this.domService.localStorage.setItem(this.COLLAPSED_LOCAL_STORAGE_KEY, this.collapsed.toString());
|
|
431
|
-
}
|
|
432
|
-
}
|
|
433
|
-
SideNavMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SideNavMenuComponent, deps: [{ token: i1.StrapiLinkService }, { token: i2.DOMService }, { token: MENU_SHARED_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
434
|
-
SideNavMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: SideNavMenuComponent, selector: "lib-side-nav-menu", inputs: { menuSettings: "menuSettings" }, usesInheritance: true, ngImport: i0, template: "<div class=\"menu-container\" [style.width]=\"sideNavWidth\" fxLayout=\"column\" [class.collapsed]=\"collapsed\">\r\n <div class=\"content\" fxLayout=\"column\" fxFlexFill>\r\n <a [libPlausibleEvent]=\"LOGOCLICK_PLAUSIBLE_EVENT\" fxFlex=\"3.125em\" [href]=\"baseUrl\" [attr.aria-label]=\"'MENU.ARIA_LABELS.LOGO' | translate\" (click)=\"logoClick($event)\"\r\n fxLayoutAlign=\"center center\" fxFlexOffset=\"1em\">\r\n <img class=\"menu-logo\" [src]=\"menuLogoImage\" alt=\"\" />\r\n </a>\r\n <div class=\"menu-wrapper\" fxLayout=\"column\" fxFlex>\r\n <menu-columns role=\"navigation\" fxFlex [labelsVisible]=\"!collapsed\" [direction]=\"direction\"\r\n [hideSelectedCustomId]=\"hideSelectedCustomId\" [showChildren]=\"false\" [strapiGroupBase]=\"strapiGroupBase\"\r\n [strapiDataLocation]=\"strapiDataLocation\" [menuItemGroups]=\"menuItemGroups\"></menu-columns>\r\n <div fxLayoutAlign=\"center center\">\r\n <button [libPlausibleEvent]=\"COLLAPSE_PLAUSIBLE_EVENT\" class=\"collapse-btn\" [disableRipple]=\"true\"\r\n *ngIf=\"!collapsed; else expandButton\" (click)=\"toggleCollapse()\" mat-button>\r\n <mat-icon>keyboard_arrow_left</mat-icon>\r\n <span> {{ \"MENU.COLLAPSE\" | translate }} </span>\r\n </button>\r\n <ng-template #expandButton>\r\n <button class=\"toggler\" [libPlausibleEvent]=\"EXPAND_PLAUSIBLE_EVENT\" mat-icon-button\r\n (click)=\"toggleCollapse()\">\r\n <mat-icon>keyboard_arrow_right</mat-icon>\r\n </button>\r\n </ng-template>\r\n </div>\r\n </div>\r\n </div>\r\n", styles: [".menu-container{height:100%;overflow:auto;background:var(--base-100);border-right:1px solid var(--base-70)}.menu-container .content{padding:0 .8em}.menu-container .content .menu-logo{margin:auto;max-width:100%}.menu-container .divider{width:100%;margin:0}:host ::ng-deep .collapsed .menu-item{padding:calc(.125em + 1px)}:host ::ng-deep .collapsed .menu-item.active-menu-item{padding:.125em;border:1px solid var(--primary-accent);border-radius:var(--default-border-radius)}:host ::ng-deep button.collapse-btn{background-color:transparent;font-size:.8125rem;font-weight:400;line-height:1.25rem;letter-spacing:0px;text-align:left;padding:0!important}:host::ng-deep button.collapse-btn,:host::ng-deep button.toggler{margin-bottom:1em}:host::ng-deep button.collapse-btn .mat-mdc-button-persistent-ripple,:host::ng-deep button.toggler .mat-mdc-button-persistent-ripple{display:none}\n"], dependencies: [{ kind: "directive", type: i3.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i3.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i3.DefaultFlexOffsetDirective, selector: " [fxFlexOffset], [fxFlexOffset.xs], [fxFlexOffset.sm], [fxFlexOffset.md], [fxFlexOffset.lg], [fxFlexOffset.xl], [fxFlexOffset.lt-sm], [fxFlexOffset.lt-md], [fxFlexOffset.lt-lg], [fxFlexOffset.lt-xl], [fxFlexOffset.gt-xs], [fxFlexOffset.gt-sm], [fxFlexOffset.gt-md], [fxFlexOffset.gt-lg]", inputs: ["fxFlexOffset", "fxFlexOffset.xs", "fxFlexOffset.sm", "fxFlexOffset.md", "fxFlexOffset.lg", "fxFlexOffset.xl", "fxFlexOffset.lt-sm", "fxFlexOffset.lt-md", "fxFlexOffset.lt-lg", "fxFlexOffset.lt-xl", "fxFlexOffset.gt-xs", "fxFlexOffset.gt-sm", "fxFlexOffset.gt-md", "fxFlexOffset.gt-lg"] }, { kind: "directive", type: i3.FlexFillDirective, selector: "[fxFill], [fxFlexFill]" }, { kind: "directive", type: i3.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5$1.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5$1.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i2.PlausibleEventDirective, selector: "[libPlausibleEvent]", inputs: ["libPlausibleEvent"] }, { kind: "component", type: MenuColumnsComponent, selector: "menu-columns", inputs: ["direction", "hideSelectedCustomId", "strapiGroupBase", "strapiDataLocation", "labelsVisible", "showChildren", "menuItemGroups"] }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }] });
|
|
435
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: SideNavMenuComponent, decorators: [{
|
|
436
|
-
type: Component,
|
|
437
|
-
args: [{ selector: 'lib-side-nav-menu', template: "<div class=\"menu-container\" [style.width]=\"sideNavWidth\" fxLayout=\"column\" [class.collapsed]=\"collapsed\">\r\n <div class=\"content\" fxLayout=\"column\" fxFlexFill>\r\n <a [libPlausibleEvent]=\"LOGOCLICK_PLAUSIBLE_EVENT\" fxFlex=\"3.125em\" [href]=\"baseUrl\" [attr.aria-label]=\"'MENU.ARIA_LABELS.LOGO' | translate\" (click)=\"logoClick($event)\"\r\n fxLayoutAlign=\"center center\" fxFlexOffset=\"1em\">\r\n <img class=\"menu-logo\" [src]=\"menuLogoImage\" alt=\"\" />\r\n </a>\r\n <div class=\"menu-wrapper\" fxLayout=\"column\" fxFlex>\r\n <menu-columns role=\"navigation\" fxFlex [labelsVisible]=\"!collapsed\" [direction]=\"direction\"\r\n [hideSelectedCustomId]=\"hideSelectedCustomId\" [showChildren]=\"false\" [strapiGroupBase]=\"strapiGroupBase\"\r\n [strapiDataLocation]=\"strapiDataLocation\" [menuItemGroups]=\"menuItemGroups\"></menu-columns>\r\n <div fxLayoutAlign=\"center center\">\r\n <button [libPlausibleEvent]=\"COLLAPSE_PLAUSIBLE_EVENT\" class=\"collapse-btn\" [disableRipple]=\"true\"\r\n *ngIf=\"!collapsed; else expandButton\" (click)=\"toggleCollapse()\" mat-button>\r\n <mat-icon>keyboard_arrow_left</mat-icon>\r\n <span> {{ \"MENU.COLLAPSE\" | translate }} </span>\r\n </button>\r\n <ng-template #expandButton>\r\n <button class=\"toggler\" [libPlausibleEvent]=\"EXPAND_PLAUSIBLE_EVENT\" mat-icon-button\r\n (click)=\"toggleCollapse()\">\r\n <mat-icon>keyboard_arrow_right</mat-icon>\r\n </button>\r\n </ng-template>\r\n </div>\r\n </div>\r\n </div>\r\n", styles: [".menu-container{height:100%;overflow:auto;background:var(--base-100);border-right:1px solid var(--base-70)}.menu-container .content{padding:0 .8em}.menu-container .content .menu-logo{margin:auto;max-width:100%}.menu-container .divider{width:100%;margin:0}:host ::ng-deep .collapsed .menu-item{padding:calc(.125em + 1px)}:host ::ng-deep .collapsed .menu-item.active-menu-item{padding:.125em;border:1px solid var(--primary-accent);border-radius:var(--default-border-radius)}:host ::ng-deep button.collapse-btn{background-color:transparent;font-size:.8125rem;font-weight:400;line-height:1.25rem;letter-spacing:0px;text-align:left;padding:0!important}:host::ng-deep button.collapse-btn,:host::ng-deep button.toggler{margin-bottom:1em}:host::ng-deep button.collapse-btn .mat-mdc-button-persistent-ripple,:host::ng-deep button.toggler .mat-mdc-button-persistent-ripple{display:none}\n"] }]
|
|
438
|
-
}], ctorParameters: function () { return [{ type: i1.StrapiLinkService }, { type: i2.DOMService }, { type: undefined, decorators: [{
|
|
439
|
-
type: Optional
|
|
440
|
-
}, {
|
|
441
|
-
type: Inject,
|
|
442
|
-
args: [MENU_SHARED_CONFIG]
|
|
443
|
-
}] }]; }, propDecorators: { menuSettings: [{
|
|
444
|
-
type: Input
|
|
445
|
-
}] } });
|
|
446
|
-
|
|
447
|
-
class ModalNavMenuComponent extends NavBaseComponent {
|
|
448
|
-
constructor() {
|
|
449
|
-
super();
|
|
450
|
-
this.menuDialogSettings = {
|
|
451
|
-
showMenuTitle: false,
|
|
452
|
-
fullScreen: true
|
|
453
|
-
};
|
|
454
|
-
this.showChildren = true;
|
|
455
|
-
// any type because emitter doesn't really need a value
|
|
456
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
457
|
-
this.closeButtonClick = new EventEmitter();
|
|
458
|
-
}
|
|
459
|
-
close() {
|
|
460
|
-
this.closeButtonClick.emit(null);
|
|
461
|
-
}
|
|
462
|
-
}
|
|
463
|
-
ModalNavMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ModalNavMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
464
|
-
ModalNavMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: ModalNavMenuComponent, selector: "lib-modal-nav-menu", inputs: { menuDialogSettings: "menuDialogSettings", showChildren: "showChildren" }, outputs: { closeButtonClick: "closeButtonClick" }, usesInheritance: true, ngImport: i0, template: "<div class=\"content menu-modal\" fxLayout=\"row\" fxFlexFill>\r\n <div fxLayout=\"column\" [class.full-screen]=\"menuDialogSettings.fullScreen\">\r\n <div fxLayout=\"row\" class=\"menu-header\">\r\n <img [src]=\"menuDialogSettings.logo\" *ngIf=\"menuDialogSettings.logo\" alt=\"\">\r\n <span *ngIf=\"menuDialogSettings.showMenuTitle\" fxLayoutAlign=\"start center\" fxFlex>{{\r\n \"MENU.MENU\" | translate\r\n }}</span>\r\n <span *ngIf=\"menuDialogSettings.showCloseMenuButton\" (click)=\"close()\" class=\"close-icon\" fxFlex fxLayoutAlign=\"end center\">\r\n <mat-icon>close</mat-icon>\r\n </span>\r\n </div>\r\n <ng-content select=\"[top]\"></ng-content>\r\n <menu-columns [direction]=\"direction\" [hideSelectedCustomId]=\"hideSelectedCustomId\" [showChildren]=\"showChildren\"\r\n [strapiGroupBase]=\"strapiGroupBase\" [strapiDataLocation]=\"strapiDataLocation\" [menuItemGroups]=\"menuItemGroups\">\r\n </menu-columns>\r\n <ng-content select=\"[bottom]\"></ng-content>\r\n </div>\r\n</div>\r\n", styles: [".menu-modal{background-color:var(--base-100);padding:1.375rem 1.5rem}.close-icon{cursor:pointer}.menu-header{font-style:normal;font-weight:500;font-size:1.3125rem;line-height:1.75rem;text-align:center;margin-bottom:1em;color:var(--menu-dark-color)}.close-icon>mat-icon{transform:scale(1.5)}\n"], dependencies: [{ kind: "directive", type: i3.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i3.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i3.FlexFillDirective, selector: "[fxFill], [fxFlexFill]" }, { kind: "directive", type: i3.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MenuColumnsComponent, selector: "menu-columns", inputs: ["direction", "hideSelectedCustomId", "strapiGroupBase", "strapiDataLocation", "labelsVisible", "showChildren", "menuItemGroups"] }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }] });
|
|
465
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: ModalNavMenuComponent, decorators: [{
|
|
466
|
-
type: Component,
|
|
467
|
-
args: [{ selector: 'lib-modal-nav-menu', template: "<div class=\"content menu-modal\" fxLayout=\"row\" fxFlexFill>\r\n <div fxLayout=\"column\" [class.full-screen]=\"menuDialogSettings.fullScreen\">\r\n <div fxLayout=\"row\" class=\"menu-header\">\r\n <img [src]=\"menuDialogSettings.logo\" *ngIf=\"menuDialogSettings.logo\" alt=\"\">\r\n <span *ngIf=\"menuDialogSettings.showMenuTitle\" fxLayoutAlign=\"start center\" fxFlex>{{\r\n \"MENU.MENU\" | translate\r\n }}</span>\r\n <span *ngIf=\"menuDialogSettings.showCloseMenuButton\" (click)=\"close()\" class=\"close-icon\" fxFlex fxLayoutAlign=\"end center\">\r\n <mat-icon>close</mat-icon>\r\n </span>\r\n </div>\r\n <ng-content select=\"[top]\"></ng-content>\r\n <menu-columns [direction]=\"direction\" [hideSelectedCustomId]=\"hideSelectedCustomId\" [showChildren]=\"showChildren\"\r\n [strapiGroupBase]=\"strapiGroupBase\" [strapiDataLocation]=\"strapiDataLocation\" [menuItemGroups]=\"menuItemGroups\">\r\n </menu-columns>\r\n <ng-content select=\"[bottom]\"></ng-content>\r\n </div>\r\n</div>\r\n", styles: [".menu-modal{background-color:var(--base-100);padding:1.375rem 1.5rem}.close-icon{cursor:pointer}.menu-header{font-style:normal;font-weight:500;font-size:1.3125rem;line-height:1.75rem;text-align:center;margin-bottom:1em;color:var(--menu-dark-color)}.close-icon>mat-icon{transform:scale(1.5)}\n"] }]
|
|
468
|
-
}], ctorParameters: function () { return []; }, propDecorators: { menuDialogSettings: [{
|
|
469
|
-
type: Input
|
|
470
|
-
}], showChildren: [{
|
|
471
|
-
type: Input
|
|
472
|
-
}], closeButtonClick: [{
|
|
473
|
-
type: Output
|
|
474
|
-
}] } });
|
|
475
|
-
|
|
476
|
-
const menuLogo = `
|
|
477
|
-
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
478
|
-
<path d="M3.3 6.6C2.36667 6.6 1.58333 6.28333 0.95 5.65C0.316666 5.01667 0 4.23333 0 3.3C0 2.36667 0.316666 1.58333 0.95 0.95C1.58333 0.316666 2.36667 0 3.3 0C4.23333 0 5.01667 0.316666 5.65 0.95C6.28333 1.58333 6.6 2.36667 6.6 3.3C6.6 4.23333 6.28333 5.01667 5.65 5.65C5.01667 6.28333 4.23333 6.6 3.3 6.6ZM16 32C15.0667 32 14.2833 31.6833 13.65 31.05C13.0167 30.4167 12.7 29.6333 12.7 28.7C12.7 27.7667 13.0167 26.9833 13.65 26.35C14.2833 25.7167 15.0667 25.4 16 25.4C16.9333 25.4 17.7167 25.7167 18.35 26.35C18.9833 26.9833 19.3 27.7667 19.3 28.7C19.3 29.6333 18.9833 30.4167 18.35 31.05C17.7167 31.6833 16.9333 32 16 32ZM3.3 32C2.36667 32 1.58333 31.6833 0.95 31.05C0.316666 30.4167 0 29.6333 0 28.7C0 27.7667 0.316666 26.9833 0.95 26.35C1.58333 25.7167 2.36667 25.4 3.3 25.4C4.23333 25.4 5.01667 25.7167 5.65 26.35C6.28333 26.9833 6.6 27.7667 6.6 28.7C6.6 29.6333 6.28333 30.4167 5.65 31.05C5.01667 31.6833 4.23333 32 3.3 32ZM3.3 19.3C2.36667 19.3 1.58333 18.9833 0.95 18.35C0.316666 17.7167 0 16.9333 0 16C0 15.0667 0.316666 14.2833 0.95 13.65C1.58333 13.0167 2.36667 12.7 3.3 12.7C4.23333 12.7 5.01667 13.0167 5.65 13.65C6.28333 14.2833 6.6 15.0667 6.6 16C6.6 16.9333 6.28333 17.7167 5.65 18.35C5.01667 18.9833 4.23333 19.3 3.3 19.3ZM16 19.3C15.0667 19.3 14.2833 18.9833 13.65 18.35C13.0167 17.7167 12.7 16.9333 12.7 16C12.7 15.0667 13.0167 14.2833 13.65 13.65C14.2833 13.0167 15.0667 12.7 16 12.7C16.9333 12.7 17.7167 13.0167 18.35 13.65C18.9833 14.2833 19.3 15.0667 19.3 16C19.3 16.9333 18.9833 17.7167 18.35 18.35C17.7167 18.9833 16.9333 19.3 16 19.3ZM28.7 6.6C27.7667 6.6 26.9833 6.28333 26.35 5.65C25.7167 5.01667 25.4 4.23333 25.4 3.3C25.4 2.36667 25.7167 1.58333 26.35 0.95C26.9833 0.316666 27.7667 0 28.7 0C29.6333 0 30.4167 0.316666 31.05 0.95C31.6833 1.58333 32 2.36667 32 3.3C32 4.23333 31.6833 5.01667 31.05 5.65C30.4167 6.28333 29.6333 6.6 28.7 6.6ZM16 6.6C15.0667 6.6 14.2833 6.28333 13.65 5.65C13.0167 5.01667 12.7 4.23333 12.7 3.3C12.7 2.36667 13.0167 1.58333 13.65 0.95C14.2833 0.316666 15.0667 0 16 0C16.9333 0 17.7167 0.316666 18.35 0.95C18.9833 1.58333 19.3 2.36667 19.3 3.3C19.3 4.23333 18.9833 5.01667 18.35 5.65C17.7167 6.28333 16.9333 6.6 16 6.6ZM28.7 19.3C27.7667 19.3 26.9833 18.9833 26.35 18.35C25.7167 17.7167 25.4 16.9333 25.4 16C25.4 15.0667 25.7167 14.2833 26.35 13.65C26.9833 13.0167 27.7667 12.7 28.7 12.7C29.6333 12.7 30.4167 13.0167 31.05 13.65C31.6833 14.2833 32 15.0667 32 16C32 16.9333 31.6833 17.7167 31.05 18.35C30.4167 18.9833 29.6333 19.3 28.7 19.3ZM28.7 32C27.7667 32 26.9833 31.6833 26.35 31.05C25.7167 30.4167 25.4 29.6333 25.4 28.7C25.4 27.7667 25.7167 26.9833 26.35 26.35C26.9833 25.7167 27.7667 25.4 28.7 25.4C29.6333 25.4 30.4167 25.7167 31.05 26.35C31.6833 26.9833 32 27.7667 32 28.7C32 29.6333 31.6833 30.4167 31.05 31.05C30.4167 31.6833 29.6333 32 28.7 32Z" fill="#434C56"/>
|
|
479
|
-
</svg>
|
|
480
|
-
|
|
481
|
-
`;
|
|
482
|
-
|
|
483
|
-
var TitlePlacement;
|
|
484
|
-
(function (TitlePlacement) {
|
|
485
|
-
TitlePlacement["none"] = "none";
|
|
486
|
-
TitlePlacement["left"] = "left";
|
|
487
|
-
TitlePlacement["right"] = "right";
|
|
488
|
-
})(TitlePlacement || (TitlePlacement = {}));
|
|
489
|
-
|
|
490
|
-
class MenuItemIconComponent extends NavBaseComponent {
|
|
491
|
-
constructor(iconService, router) {
|
|
492
|
-
super();
|
|
493
|
-
this.iconService = iconService;
|
|
494
|
-
this.router = router;
|
|
495
|
-
this.menuSettings = {
|
|
496
|
-
titlePlacement: TitlePlacement.left
|
|
497
|
-
};
|
|
498
|
-
this.menuDialogSettings = {
|
|
499
|
-
showMenuTitle: true,
|
|
500
|
-
disableStrapi: true,
|
|
501
|
-
fullScreen: true
|
|
502
|
-
};
|
|
503
|
-
this.showChildren = true;
|
|
504
|
-
this.direction = MenuLayoutDirection.row;
|
|
505
|
-
this.subscription = [];
|
|
506
|
-
this.iconName = 'tld-menu-icon';
|
|
507
|
-
this.TITLE_PLACEMENT_NONE = TitlePlacement.none;
|
|
508
|
-
this.TITLE_PLACEMENT_LEFT = TitlePlacement.left;
|
|
509
|
-
this.PLAUSIBLE_EVENT = {
|
|
510
|
-
eventId: "burger_click"
|
|
511
|
-
};
|
|
512
|
-
}
|
|
513
|
-
ngOnInit() {
|
|
514
|
-
const routeChangeSub = this.router.events.subscribe(() => this.closeMenu());
|
|
515
|
-
this.subscription.push(routeChangeSub);
|
|
516
|
-
this.registerIcon();
|
|
517
|
-
}
|
|
518
|
-
closeMenu() {
|
|
519
|
-
this.menuTrigger?.closeMenu();
|
|
520
|
-
}
|
|
521
|
-
ngOnDestroy() {
|
|
522
|
-
this.subscription.forEach(e => e.unsubscribe());
|
|
523
|
-
}
|
|
524
|
-
registerIcon() {
|
|
525
|
-
if (this.menuSettings.iconPath) {
|
|
526
|
-
this.iconService.registerIconFromUrl(this.iconName, this.menuSettings.iconPath);
|
|
527
|
-
}
|
|
528
|
-
else {
|
|
529
|
-
this.iconService.registerIcons({ [this.iconName]: menuLogo });
|
|
530
|
-
}
|
|
531
|
-
}
|
|
532
|
-
}
|
|
533
|
-
MenuItemIconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: MenuItemIconComponent, deps: [{ token: i2.IconService }, { token: i2$1.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
534
|
-
MenuItemIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: MenuItemIconComponent, selector: "lib-menu-item-icon", inputs: { menuSettings: "menuSettings", menuDialogSettings: "menuDialogSettings", showChildren: "showChildren", direction: "direction" }, viewQueries: [{ propertyName: "menuTrigger", first: true, predicate: ["menuTrigger"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<button class=\"content text-l\" mat-button [disableRipple]=\"true\" #menuTrigger=\"matMenuTrigger\"\r\n [matMenuTriggerFor]=\"menu\" [libPlausibleEvent]=\"PLAUSIBLE_EVENT\">\r\n <span fxLayout=\"row\" fxLayoutGap=\"1.5em\" fxLayoutAlign=\"center center\">\r\n <span *ngIf=\"menuSettings.titlePlacement !== TITLE_PLACEMENT_NONE\" [fxFlexOrder]=\"\r\n menuSettings.titlePlacement === TITLE_PLACEMENT_LEFT ? 1 : 2\r\n \" class=\"menu-label\">{{ \"MENU.MENU\" | translate }}</span>\r\n <mat-icon [fxFlexOrder]=\"\r\n menuSettings.titlePlacement === TITLE_PLACEMENT_LEFT ? 2 : 1\r\n \" [svgIcon]=\"iconName\">\r\n </mat-icon>\r\n </span>\r\n</button>\r\n\r\n<mat-menu [hasBackdrop]=\"true\" #menu class=\"mobile-menu-dialog {{\r\n menuDialogSettings.fullScreen ? 'full-screen' : 'minimized-screen'\r\n }}\">\r\n <!-- Click method so that menu does not get closed when clicking outside of items-->\r\n <lib-modal-nav-menu (click)=\"$event.stopPropagation()\" (closeButtonClick)=\"closeMenu()\" [menuDialogSettings]=\"menuDialogSettings\" [direction]=\"direction\"\r\n [hideSelectedCustomId]=\"hideSelectedCustomId\" [showChildren]=\"showChildren\" [strapiGroupBase]=\"strapiGroupBase\"\r\n [strapiDataLocation]=\"strapiDataLocation\" [menuItemGroups]=\"menuItemGroups\">\r\n <ng-content top select=\"[top]\"></ng-content>\r\n <ng-content bottom select=\"[bottom]\"></ng-content>\r\n </lib-modal-nav-menu>\r\n</mat-menu>\r\n", styles: [".content{gap:1.5em;cursor:pointer}button.mat-mdc-icon-button{width:inherit}:host::ng-deep button span.mat-button-focus-overlay{opacity:0!important}::ng-deep lib-modal-nav-menu>.content.menu-modal>div.full-screen{width:100%}::ng-deep lib-modal-nav-menu>.content.menu-modal>div.full-screen .menu-list-wrapper .menu-item{width:100%}::ng-deep div:has(.mat-mdc-menu-panel.mobile-menu-dialog.full-screen){width:100%;max-width:100%}::ng-deep .mat-mdc-menu-panel.mobile-menu-dialog.full-screen{width:100vw;margin-top:-2.5em;max-width:none}\n"], dependencies: [{ kind: "directive", type: i3.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i3.DefaultLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i3.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i3.DefaultFlexOrderDirective, selector: " [fxFlexOrder], [fxFlexOrder.xs], [fxFlexOrder.sm], [fxFlexOrder.md], [fxFlexOrder.lg], [fxFlexOrder.xl], [fxFlexOrder.lt-sm], [fxFlexOrder.lt-md], [fxFlexOrder.lt-lg], [fxFlexOrder.lt-xl], [fxFlexOrder.gt-xs], [fxFlexOrder.gt-sm], [fxFlexOrder.gt-md], [fxFlexOrder.gt-lg]", inputs: ["fxFlexOrder", "fxFlexOrder.xs", "fxFlexOrder.sm", "fxFlexOrder.md", "fxFlexOrder.lg", "fxFlexOrder.xl", "fxFlexOrder.lt-sm", "fxFlexOrder.lt-md", "fxFlexOrder.lt-lg", "fxFlexOrder.lt-xl", "fxFlexOrder.gt-xs", "fxFlexOrder.gt-sm", "fxFlexOrder.gt-md", "fxFlexOrder.gt-lg"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5$1.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i6.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "directive", type: i6.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i2.PlausibleEventDirective, selector: "[libPlausibleEvent]", inputs: ["libPlausibleEvent"] }, { kind: "component", type: ModalNavMenuComponent, selector: "lib-modal-nav-menu", inputs: ["menuDialogSettings", "showChildren"], outputs: ["closeButtonClick"] }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }] });
|
|
535
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: MenuItemIconComponent, decorators: [{
|
|
536
|
-
type: Component,
|
|
537
|
-
args: [{ selector: 'lib-menu-item-icon', template: "<button class=\"content text-l\" mat-button [disableRipple]=\"true\" #menuTrigger=\"matMenuTrigger\"\r\n [matMenuTriggerFor]=\"menu\" [libPlausibleEvent]=\"PLAUSIBLE_EVENT\">\r\n <span fxLayout=\"row\" fxLayoutGap=\"1.5em\" fxLayoutAlign=\"center center\">\r\n <span *ngIf=\"menuSettings.titlePlacement !== TITLE_PLACEMENT_NONE\" [fxFlexOrder]=\"\r\n menuSettings.titlePlacement === TITLE_PLACEMENT_LEFT ? 1 : 2\r\n \" class=\"menu-label\">{{ \"MENU.MENU\" | translate }}</span>\r\n <mat-icon [fxFlexOrder]=\"\r\n menuSettings.titlePlacement === TITLE_PLACEMENT_LEFT ? 2 : 1\r\n \" [svgIcon]=\"iconName\">\r\n </mat-icon>\r\n </span>\r\n</button>\r\n\r\n<mat-menu [hasBackdrop]=\"true\" #menu class=\"mobile-menu-dialog {{\r\n menuDialogSettings.fullScreen ? 'full-screen' : 'minimized-screen'\r\n }}\">\r\n <!-- Click method so that menu does not get closed when clicking outside of items-->\r\n <lib-modal-nav-menu (click)=\"$event.stopPropagation()\" (closeButtonClick)=\"closeMenu()\" [menuDialogSettings]=\"menuDialogSettings\" [direction]=\"direction\"\r\n [hideSelectedCustomId]=\"hideSelectedCustomId\" [showChildren]=\"showChildren\" [strapiGroupBase]=\"strapiGroupBase\"\r\n [strapiDataLocation]=\"strapiDataLocation\" [menuItemGroups]=\"menuItemGroups\">\r\n <ng-content top select=\"[top]\"></ng-content>\r\n <ng-content bottom select=\"[bottom]\"></ng-content>\r\n </lib-modal-nav-menu>\r\n</mat-menu>\r\n", styles: [".content{gap:1.5em;cursor:pointer}button.mat-mdc-icon-button{width:inherit}:host::ng-deep button span.mat-button-focus-overlay{opacity:0!important}::ng-deep lib-modal-nav-menu>.content.menu-modal>div.full-screen{width:100%}::ng-deep lib-modal-nav-menu>.content.menu-modal>div.full-screen .menu-list-wrapper .menu-item{width:100%}::ng-deep div:has(.mat-mdc-menu-panel.mobile-menu-dialog.full-screen){width:100%;max-width:100%}::ng-deep .mat-mdc-menu-panel.mobile-menu-dialog.full-screen{width:100vw;margin-top:-2.5em;max-width:none}\n"] }]
|
|
538
|
-
}], ctorParameters: function () { return [{ type: i2.IconService }, { type: i2$1.Router }]; }, propDecorators: { menuTrigger: [{
|
|
539
|
-
type: ViewChild,
|
|
540
|
-
args: ['menuTrigger']
|
|
541
|
-
}], menuSettings: [{
|
|
542
|
-
type: Input
|
|
543
|
-
}], menuDialogSettings: [{
|
|
544
|
-
type: Input
|
|
545
|
-
}], showChildren: [{
|
|
546
|
-
type: Input
|
|
547
|
-
}], direction: [{
|
|
548
|
-
type: Input
|
|
549
|
-
}] } });
|
|
550
|
-
|
|
551
|
-
// TODO. REMOVE THIS COMPONENT IN FUTURE, SINCE IT IS JUST WRAPPER FOR MENU-COLUMN WITH RESTRICTED FUNCTIONALITY.
|
|
552
|
-
class MenuStrapiItemListComponent {
|
|
553
|
-
}
|
|
554
|
-
MenuStrapiItemListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: MenuStrapiItemListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
555
|
-
MenuStrapiItemListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: MenuStrapiItemListComponent, selector: "lib-menu-strapi-item-list", inputs: { direction: "direction" }, ngImport: i0, template: "<menu-columns [direction]=\"direction\"></menu-columns>", styles: [""], dependencies: [{ kind: "component", type: MenuColumnsComponent, selector: "menu-columns", inputs: ["direction", "hideSelectedCustomId", "strapiGroupBase", "strapiDataLocation", "labelsVisible", "showChildren", "menuItemGroups"] }] });
|
|
556
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: MenuStrapiItemListComponent, decorators: [{
|
|
557
|
-
type: Component,
|
|
558
|
-
args: [{ selector: 'lib-menu-strapi-item-list', template: "<menu-columns [direction]=\"direction\"></menu-columns>" }]
|
|
559
|
-
}], propDecorators: { direction: [{
|
|
560
|
-
type: Input
|
|
561
|
-
}] } });
|
|
562
|
-
|
|
563
|
-
class MenuModule {
|
|
564
|
-
static forRoot(config) {
|
|
565
|
-
return {
|
|
566
|
-
ngModule: MenuModule,
|
|
567
|
-
providers: [
|
|
568
|
-
{ provide: MENU_SHARED_CONFIG, useValue: config }
|
|
569
|
-
]
|
|
570
|
-
};
|
|
571
|
-
}
|
|
572
|
-
}
|
|
573
|
-
MenuModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: MenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
574
|
-
MenuModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.9", ngImport: i0, type: MenuModule, declarations: [SideNavMenuComponent,
|
|
575
|
-
ModalNavMenuComponent,
|
|
576
|
-
MenuItemIconComponent,
|
|
577
|
-
NavBaseComponent,
|
|
578
|
-
MenuItemListComponent,
|
|
579
|
-
MenuStrapiItemListComponent,
|
|
580
|
-
MenuColumnsComponent], imports: [HttpClientModule,
|
|
581
|
-
FlexLayoutModule,
|
|
582
|
-
RouterModule,
|
|
583
|
-
CommonModule,
|
|
584
|
-
MatTooltipModule,
|
|
585
|
-
MatDialogModule,
|
|
586
|
-
MatButtonModule,
|
|
587
|
-
MatListModule,
|
|
588
|
-
MatMenuModule,
|
|
589
|
-
MatIconModule,
|
|
590
|
-
TranslateModule,
|
|
591
|
-
PlausibleModule], exports: [SideNavMenuComponent,
|
|
592
|
-
ModalNavMenuComponent,
|
|
593
|
-
MenuItemIconComponent,
|
|
594
|
-
MenuStrapiItemListComponent,
|
|
595
|
-
MenuColumnsComponent] });
|
|
596
|
-
MenuModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: MenuModule, providers: [
|
|
597
|
-
StarpiMenuService
|
|
598
|
-
], imports: [HttpClientModule,
|
|
599
|
-
FlexLayoutModule,
|
|
600
|
-
RouterModule,
|
|
601
|
-
CommonModule,
|
|
602
|
-
MatTooltipModule,
|
|
603
|
-
MatDialogModule,
|
|
604
|
-
MatButtonModule,
|
|
605
|
-
MatListModule,
|
|
606
|
-
MatMenuModule,
|
|
607
|
-
MatIconModule,
|
|
608
|
-
TranslateModule,
|
|
609
|
-
PlausibleModule] });
|
|
610
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: MenuModule, decorators: [{
|
|
611
|
-
type: NgModule,
|
|
612
|
-
args: [{
|
|
613
|
-
declarations: [
|
|
614
|
-
SideNavMenuComponent,
|
|
615
|
-
ModalNavMenuComponent,
|
|
616
|
-
MenuItemIconComponent,
|
|
617
|
-
NavBaseComponent,
|
|
618
|
-
MenuItemListComponent,
|
|
619
|
-
MenuStrapiItemListComponent,
|
|
620
|
-
MenuColumnsComponent
|
|
621
|
-
],
|
|
622
|
-
providers: [
|
|
623
|
-
StarpiMenuService
|
|
624
|
-
],
|
|
625
|
-
imports: [
|
|
626
|
-
HttpClientModule,
|
|
627
|
-
FlexLayoutModule,
|
|
628
|
-
RouterModule,
|
|
629
|
-
CommonModule,
|
|
630
|
-
MatTooltipModule,
|
|
631
|
-
MatDialogModule,
|
|
632
|
-
MatButtonModule,
|
|
633
|
-
MatListModule,
|
|
634
|
-
MatMenuModule,
|
|
635
|
-
MatIconModule,
|
|
636
|
-
TranslateModule,
|
|
637
|
-
PlausibleModule
|
|
638
|
-
],
|
|
639
|
-
exports: [
|
|
640
|
-
SideNavMenuComponent,
|
|
641
|
-
ModalNavMenuComponent,
|
|
642
|
-
MenuItemIconComponent,
|
|
643
|
-
MenuStrapiItemListComponent,
|
|
644
|
-
MenuColumnsComponent
|
|
645
|
-
]
|
|
646
|
-
}]
|
|
647
|
-
}] });
|
|
648
|
-
|
|
649
|
-
/*
|
|
650
|
-
* Public API Surface of ngx-menu
|
|
651
|
-
*/
|
|
652
|
-
|
|
653
|
-
/**
|
|
654
|
-
* Generated bundle index. Do not edit.
|
|
655
|
-
*/
|
|
656
|
-
|
|
657
|
-
export { MENU_ICON_STRAPI_EXTENSION, MENU_SHARED_CONFIG, MenuColumnsComponent, MenuItemIconComponent, MenuLayoutDirection, MenuModule, MenuStrapiItemListComponent, ModalNavMenuComponent, NavBaseComponent, SideNavMenuComponent, StarpiMenuService, StrapiDataLocation, TitlePlacement };
|
|
658
|
-
//# sourceMappingURL=tilde-nlp-ngx-menu.mjs.map
|