@tilde-nlp/ngx-menu 2.0.4 → 4.0.0

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.
Files changed (45) hide show
  1. package/esm2022/lib/components/menu-columns/menu-columns.component.mjs +163 -0
  2. package/{esm2020 → esm2022}/lib/components/menu-icon/menu-icon.component.mjs +4 -4
  3. package/{esm2020 → esm2022}/lib/components/menu-item-icon/menu-item-icon.component.mjs +5 -5
  4. package/esm2022/lib/components/menu-item-link/menu-item-link.component.mjs +52 -0
  5. package/{esm2020 → esm2022}/lib/components/menu-item-list/menu-item-list.component.mjs +4 -4
  6. package/{esm2020 → esm2022}/lib/components/modal-nav-menu/modal-nav-menu.component.mjs +4 -4
  7. package/{esm2020 → esm2022}/lib/components/nav-base/nav-base.component.mjs +4 -4
  8. package/{esm2020 → esm2022}/lib/components/side-nav-menu/side-nav-menu.component.mjs +13 -13
  9. package/{esm2020 → esm2022}/lib/menu.module.mjs +41 -41
  10. package/{esm2020 → esm2022}/lib/services/strapi.service.mjs +4 -4
  11. package/{fesm2020 → fesm2022}/tilde-nlp-ngx-menu.mjs +98 -98
  12. package/{fesm2020 → fesm2022}/tilde-nlp-ngx-menu.mjs.map +1 -1
  13. package/lib/components/menu-columns/menu-columns.component.d.ts +1 -1
  14. package/lib/components/menu-icon/menu-icon.component.d.ts +1 -1
  15. package/lib/components/menu-item-icon/menu-item-icon.component.d.ts +1 -1
  16. package/lib/components/menu-item-link/menu-item-link.component.d.ts +1 -1
  17. package/lib/components/menu-item-list/menu-item-list.component.d.ts +1 -1
  18. package/lib/components/modal-nav-menu/modal-nav-menu.component.d.ts +1 -1
  19. package/lib/components/nav-base/nav-base.component.d.ts +1 -1
  20. package/lib/components/side-nav-menu/side-nav-menu.component.d.ts +1 -1
  21. package/package.json +13 -19
  22. package/esm2020/lib/components/menu-columns/menu-columns.component.mjs +0 -163
  23. package/esm2020/lib/components/menu-item-link/menu-item-link.component.mjs +0 -52
  24. package/fesm2015/tilde-nlp-ngx-menu.mjs +0 -712
  25. package/fesm2015/tilde-nlp-ngx-menu.mjs.map +0 -1
  26. /package/{esm2020 → esm2022}/lib/assets/menu-logo.svg.mjs +0 -0
  27. /package/{esm2020 → esm2022}/lib/components/menu-item-icon/menu.model.mjs +0 -0
  28. /package/{esm2020 → esm2022}/lib/components/menu-item-icon/models/menu-dialog-settings.model.mjs +0 -0
  29. /package/{esm2020 → esm2022}/lib/components/menu-item-icon/models/menu-item-settings.model.mjs +0 -0
  30. /package/{esm2020 → esm2022}/lib/components/menu-item-icon/models/menu-title-placement.model.mjs +0 -0
  31. /package/{esm2020 → esm2022}/lib/components/nav-base/models/index.mjs +0 -0
  32. /package/{esm2020 → esm2022}/lib/components/nav-base/models/strapi-data-location.enum.mjs +0 -0
  33. /package/{esm2020 → esm2022}/lib/components/side-nav-menu/index.mjs +0 -0
  34. /package/{esm2020 → esm2022}/lib/components/side-nav-menu/models/index.mjs +0 -0
  35. /package/{esm2020 → esm2022}/lib/components/side-nav-menu/models/side-nav-settings.model.mjs +0 -0
  36. /package/{esm2020 → esm2022}/lib/injection-tokens/index.mjs +0 -0
  37. /package/{esm2020 → esm2022}/lib/injection-tokens/menu-shared-config.token.mjs +0 -0
  38. /package/{esm2020 → esm2022}/lib/models/custom-menu-item.mjs +0 -0
  39. /package/{esm2020 → esm2022}/lib/models/index.mjs +0 -0
  40. /package/{esm2020 → esm2022}/lib/models/menu-icon-strapi-extension.const.mjs +0 -0
  41. /package/{esm2020 → esm2022}/lib/models/menu-item-group.model.mjs +0 -0
  42. /package/{esm2020 → esm2022}/lib/models/menu-layout-direction.model.mjs +0 -0
  43. /package/{esm2020 → esm2022}/lib/models/menu-shared-config.model.mjs +0 -0
  44. /package/{esm2020 → esm2022}/public-api.mjs +0 -0
  45. /package/{esm2020 → esm2022}/tilde-nlp-ngx-menu.mjs +0 -0
@@ -1,712 +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 i2$1 from '@angular/common';
9
- import { CommonModule } from '@angular/common';
10
- import * as i5 from '@angular/material/icon';
11
- import { MatIconModule } from '@angular/material/icon';
12
- import * as i6 from '@angular/material/button';
13
- import { MatButtonModule } from '@angular/material/button';
14
- import * as i2$2 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 i7$1 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: "14.3.0", ngImport: i0, type: NavBaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
48
- NavBaseComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", 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: "14.3.0", 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
- var _a;
112
- if (!((_a = this.menuConfig) === null || _a === void 0 ? void 0 : _a.baseUrl)) {
113
- return link;
114
- }
115
- try {
116
- new URL(link);
117
- // eslint-disable-next-line no-empty
118
- }
119
- catch (_b) { }
120
- try {
121
- return new URL(link, this.menuConfig.baseUrl).href;
122
- }
123
- catch (_c) {
124
- return link;
125
- }
126
- }
127
- convertToCustomMenuItem(item) {
128
- return {
129
- icon: item.icon.data.attributes.name,
130
- link: item.link,
131
- title: item.title,
132
- externalLink: item.externalLink,
133
- // Material icons should not come from strapi
134
- materialIcon: false,
135
- plausibleEvent: item.plausibleEvent,
136
- customId: item.customId
137
- };
138
- }
139
- }
140
- StarpiMenuService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", 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 });
141
- StarpiMenuService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: StarpiMenuService, providedIn: 'root' });
142
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: StarpiMenuService, decorators: [{
143
- type: Injectable,
144
- args: [{
145
- providedIn: 'root'
146
- }]
147
- }], ctorParameters: function () {
148
- return [{ type: i1.StrapiSubscriptionService }, { type: undefined, decorators: [{
149
- type: Optional
150
- }, {
151
- type: Inject,
152
- args: [MENU_SHARED_CONFIG]
153
- }] }, { type: undefined, decorators: [{
154
- type: Inject,
155
- args: [STRAPI_API_CONFIG_TOKEN]
156
- }] }, { type: i2.IconService }];
157
- } });
158
-
159
- class MenuIconComponent {
160
- constructor() {
161
- this.svgExtension = MENU_ICON_STRAPI_EXTENSION;
162
- }
163
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
164
- isIconMediaType(icon) {
165
- return typeof icon !== "string";
166
- }
167
- }
168
- MenuIconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MenuIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
169
- MenuIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: MenuIconComponent, selector: "tld-menu-icon", inputs: { menuItem: "menuItem" }, ngImport: i0, template: "<ng-container *ngIf=\"menuItem.icon\">\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-container>\r\n", styles: [".menu-icon{color:var(--base-40);margin:auto;min-width:24px;min-height:24px;max-width:24px;max-height:24px;vertical-align:middle}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
170
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MenuIconComponent, decorators: [{
171
- type: Component,
172
- args: [{ selector: 'tld-menu-icon', template: "<ng-container *ngIf=\"menuItem.icon\">\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-container>\r\n", styles: [".menu-icon{color:var(--base-40);margin:auto;min-width:24px;min-height:24px;max-width:24px;max-height:24px;vertical-align:middle}\n"] }]
173
- }], propDecorators: { menuItem: [{
174
- type: Input
175
- }] } });
176
-
177
- class MenuItemLinkComponent {
178
- constructor(strapiLinkService, placeholderService) {
179
- this.strapiLinkService = strapiLinkService;
180
- this.placeholderService = placeholderService;
181
- this.showIcons = true;
182
- this.updateTextWithPlaceholders = (textWithReplacedPlaceholders) => this.href = textWithReplacedPlaceholders;
183
- }
184
- get menuItemLayout() {
185
- return this.direction === MenuLayoutDirection.column ? 'column' : 'row';
186
- }
187
- get menuLayoutDirection() {
188
- return (this.direction === MenuLayoutDirection.column || !this.labelsVisible)
189
- ? 'start center' : 'start start';
190
- }
191
- ngOnInit() {
192
- this.textWithPlaceholders = this.menuItem.link;
193
- this.placeholderServiceId = this.placeholderService.register(this);
194
- }
195
- linkClick(event, item) {
196
- this.strapiLinkService.strapiLinkClick(event, item.externalLink);
197
- }
198
- ngOnDestroy() {
199
- this.placeholderService.unregister(this.placeholderServiceId);
200
- }
201
- }
202
- MenuItemLinkComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MenuItemLinkComponent, deps: [{ token: i1.StrapiLinkService }, { token: i1.StrapiVariablesService }], target: i0.ɵɵFactoryTarget.Component });
203
- MenuItemLinkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: MenuItemLinkComponent, selector: "tld-menu-item-link", inputs: { direction: "direction", labelsVisible: "labelsVisible", activeItem: "activeItem", showIcons: "showIcons", menuItem: "menuItem" }, ngImport: i0, template: "<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]=\"href | translate\" [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 <tld-menu-icon [menuItem]=\"menuItem\"></tld-menu-icon>\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", styles: [""], 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: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "directive", type: i2.PlausibleEventDirective, selector: "[libPlausibleEvent]", inputs: ["libPlausibleEvent"] }, { kind: "component", type: MenuIconComponent, selector: "tld-menu-icon", inputs: ["menuItem"] }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }] });
204
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MenuItemLinkComponent, decorators: [{
205
- type: Component,
206
- args: [{ selector: 'tld-menu-item-link', template: "<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]=\"href | translate\" [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 <tld-menu-icon [menuItem]=\"menuItem\"></tld-menu-icon>\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" }]
207
- }], ctorParameters: function () { return [{ type: i1.StrapiLinkService }, { type: i1.StrapiVariablesService }]; }, propDecorators: { direction: [{
208
- type: Input
209
- }], labelsVisible: [{
210
- type: Input
211
- }], activeItem: [{
212
- type: Input
213
- }], showIcons: [{
214
- type: Input
215
- }], menuItem: [{
216
- type: Input
217
- }] } });
218
-
219
- class MenuItemListComponent {
220
- constructor() {
221
- this.direction = MenuLayoutDirection.column;
222
- this.labelsVisible = true;
223
- this.showIcons = true;
224
- this.showChildren = true;
225
- this.items = [];
226
- this.toggleExpand = new EventEmitter();
227
- }
228
- get titleKey() {
229
- var _a;
230
- return (_a = this.menuItemGroup) === null || _a === void 0 ? void 0 : _a.title;
231
- }
232
- get showTitle() {
233
- var _a;
234
- return (_a = this.menuItemGroup) === null || _a === void 0 ? void 0 : _a.showTitle;
235
- }
236
- get menuLayoutDirection() {
237
- return (this.direction === MenuLayoutDirection.column || !this.labelsVisible)
238
- ? 'start center' : 'start start';
239
- }
240
- get menuItemLayout() {
241
- return this.direction === MenuLayoutDirection.column ? 'column' : 'row';
242
- }
243
- toggleItemExpand(event, menuItem) {
244
- // so menu doesnt get closed.
245
- event.stopPropagation();
246
- menuItem.expanded = !menuItem.expanded;
247
- this.toggleExpand.next(menuItem);
248
- }
249
- }
250
- MenuItemListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MenuItemListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
251
- MenuItemListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", 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 <tld-menu-icon [menuItem]=\"menuItem\"></tld-menu-icon>\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 <tld-menu-item-link [menuItem]=\"menuItem\" [direction]=\"direction\" [labelsVisible]=\"labelsVisible\"\r\n [activeItem]=\"activeItem\" [showIcons]=\"showIcons\"></tld-menu-item-link>\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 tld-menu-item-link+tld-menu-item-link,:host::ng-deep .menu-list-wrapper tld-menu-item-link+.menu-item,:host::ng-deep .menu-list-wrapper .menu-item+tld-menu-item-link,:host::ng-deep .menu-list-wrapper .menu-item+menu-item{margin-top:1.5625em}:host::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}:host::ng-deep .menu-list-wrapper .menu-item:focus-visible{outline:black solid 2px}:host::ng-deep .menu-list-wrapper .menu-item:not(button):hover{font-weight:600}: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.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: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: MenuItemListComponent, selector: "menu-item-list", inputs: ["direction", "labelsVisible", "activeItem", "showIcons", "showChildren", "items", "menuItemGroup"], outputs: ["toggleExpand"] }, { kind: "component", type: MenuIconComponent, selector: "tld-menu-icon", inputs: ["menuItem"] }, { kind: "component", type: MenuItemLinkComponent, selector: "tld-menu-item-link", inputs: ["direction", "labelsVisible", "activeItem", "showIcons", "menuItem"] }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }] });
252
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MenuItemListComponent, decorators: [{
253
- type: Component,
254
- 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 <tld-menu-icon [menuItem]=\"menuItem\"></tld-menu-icon>\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 <tld-menu-item-link [menuItem]=\"menuItem\" [direction]=\"direction\" [labelsVisible]=\"labelsVisible\"\r\n [activeItem]=\"activeItem\" [showIcons]=\"showIcons\"></tld-menu-item-link>\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 tld-menu-item-link+tld-menu-item-link,:host::ng-deep .menu-list-wrapper tld-menu-item-link+.menu-item,:host::ng-deep .menu-list-wrapper .menu-item+tld-menu-item-link,:host::ng-deep .menu-list-wrapper .menu-item+menu-item{margin-top:1.5625em}:host::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}:host::ng-deep .menu-list-wrapper .menu-item:focus-visible{outline:black solid 2px}:host::ng-deep .menu-list-wrapper .menu-item:not(button):hover{font-weight:600}: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.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"] }]
255
- }], propDecorators: { direction: [{
256
- type: Input
257
- }], labelsVisible: [{
258
- type: Input
259
- }], activeItem: [{
260
- type: Input
261
- }], showIcons: [{
262
- type: Input
263
- }], showChildren: [{
264
- type: Input
265
- }], items: [{
266
- type: Input
267
- }], menuItemGroup: [{
268
- type: Input
269
- }], toggleExpand: [{
270
- type: Output
271
- }] } });
272
-
273
- class MenuColumnsComponent {
274
- constructor(strapiService, router, menuSharedConfig) {
275
- this.strapiService = strapiService;
276
- this.router = router;
277
- this.menuSharedConfig = menuSharedConfig;
278
- this.direction = MenuLayoutDirection.column;
279
- this.hideSelectedCustomId = false;
280
- this.strapiGroupBase = {};
281
- this.strapiDataLocation = StrapiDataLocation.END;
282
- this.labelsVisible = true;
283
- this._menuItemGroups = [];
284
- this.subscribedToStrapi = false;
285
- this.strapiItems = [];
286
- this._mergedGroups = [];
287
- this.subscriptions = [];
288
- this.isActiveMatchOptions = {
289
- matrixParams: 'exact',
290
- queryParams: 'exact',
291
- paths: 'exact',
292
- fragment: 'exact'
293
- };
294
- }
295
- get customId() {
296
- var _a;
297
- return (_a = this.menuSharedConfig) === null || _a === void 0 ? void 0 : _a.customId;
298
- }
299
- get strapiGroup() { return this._strapiGroup; }
300
- get menuItemGroups() { return this._menuItemGroups; }
301
- set menuItemGroups(groups) {
302
- this._menuItemGroups = groups !== null && groups !== void 0 ? groups : [];
303
- }
304
- get mergedGroups() { return this._mergedGroups; }
305
- get allRootItems() {
306
- const allItems = this.mergedGroups.map(map => map.items);
307
- let newArray = [];
308
- allItems.forEach((array) => { newArray = newArray.concat(array); });
309
- return newArray;
310
- }
311
- ngOnInit() {
312
- this.subscribeOnRouteChange();
313
- this.getStrapiData();
314
- }
315
- ngOnDestroy() {
316
- this.subscriptions.forEach(sub => sub.unsubscribe());
317
- if (this.subscribedToStrapi) {
318
- this.strapiService.unsubscribe();
319
- }
320
- }
321
- elementExpanded(element) {
322
- var _a;
323
- if (!this.activeItem) {
324
- return;
325
- }
326
- // 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.
327
- if (element !== this.activeItem && !((_a = element.children) === null || _a === void 0 ? void 0 : _a.includes(this.activeItem))) {
328
- return;
329
- }
330
- this.changeActiveElement();
331
- }
332
- getStrapiData() {
333
- var _a;
334
- if (!((_a = this.menuSharedConfig) === null || _a === void 0 ? void 0 : _a.disableStrapi)) {
335
- this.subscribedToStrapi = true;
336
- this.strapiService.getMenuItems().subscribe(this.loadData.bind(this));
337
- }
338
- }
339
- loadData(data) {
340
- // hide custom id based on input param
341
- this.strapiItems = (this.hideSelectedCustomId && this.customId) ? data.filter(item => item.customId !== this.customId) : data;
342
- this._strapiGroup = Object.assign(Object.assign({}, this.strapiGroupBase), { items: this.strapiItems });
343
- if (this.strapiDataLocation === StrapiDataLocation.START) {
344
- this._mergedGroups = [this.strapiGroup, ...this.menuItemGroups];
345
- }
346
- else if (this.strapiDataLocation === StrapiDataLocation.END) {
347
- this._mergedGroups = [...this.menuItemGroups, this.strapiGroup];
348
- }
349
- this.changeActiveElement();
350
- }
351
- subscribeOnRouteChange() {
352
- const subscription = this.router.events
353
- .pipe(filter(e => e instanceof NavigationEnd))
354
- .subscribe(() => { this.changeActiveElement(); });
355
- this.subscriptions.push(subscription);
356
- }
357
- changeActiveElement() {
358
- this.activeItem = this.findActiveElement(this.allRootItems);
359
- }
360
- /** Finds active element from whole list. RouterLink has priority over custom Id. */
361
- // at this version, child elements should not have customId, since that property comes from strapi and strapi provides only one level structure
362
- findActiveElement(list) {
363
- var _a, _b;
364
- if (!list) {
365
- return null;
366
- }
367
- let customIdElement = null;
368
- for (const item of list) {
369
- // Child element has priority over parent, so need to check if any child is active
370
- if (this.isElementRouterLinkActive(item)) {
371
- // If has children and they are visible, return active child or current item
372
- return this.showChildren && item.expanded ? (_a = this.findActiveElement(item.children)) !== null && _a !== void 0 ? _a : item : item;
373
- }
374
- // if selected custom id element is hidden, no need to look for it and set it to active;
375
- else if (!this.hideSelectedCustomId && this.isElementCustomIdActive(item)) {
376
- customIdElement = item;
377
- }
378
- else if (this.showChildren && ((_b = item.children) === null || _b === void 0 ? void 0 : _b.length)) {
379
- const activeChild = this.findActiveElement(item.children);
380
- if (activeChild) {
381
- return activeChild;
382
- }
383
- }
384
- }
385
- return customIdElement;
386
- }
387
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
388
- // private isMenuItem(item: any): item is MenuItems {
389
- // return item.customId;
390
- // }
391
- isElementCustomIdActive(element) {
392
- return this.customId && element.customId === this.customId;
393
- }
394
- isElementRouterLinkActive(element) {
395
- var _a, _b;
396
- const routerLinkActiveOptions = (_b = (_a = element.routerLinkActiveOptions) !== null && _a !== void 0 ? _a : this.menuSharedConfig.activeMatchOptions) !== null && _b !== void 0 ? _b : this.isActiveMatchOptions;
397
- return this.router.isActive(element.link, routerLinkActiveOptions);
398
- }
399
- }
400
- MenuColumnsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MenuColumnsComponent, deps: [{ token: StarpiMenuService }, { token: i2$2.Router }, { token: MENU_SHARED_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Component });
401
- MenuColumnsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", 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: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$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"] }] });
402
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MenuColumnsComponent, decorators: [{
403
- type: Component,
404
- 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"] }]
405
- }], ctorParameters: function () {
406
- return [{ type: StarpiMenuService }, { type: i2$2.Router }, { type: undefined, decorators: [{
407
- type: Optional
408
- }, {
409
- type: Inject,
410
- args: [MENU_SHARED_CONFIG]
411
- }] }];
412
- }, propDecorators: { direction: [{
413
- type: Input
414
- }], hideSelectedCustomId: [{
415
- type: Input
416
- }], strapiGroupBase: [{
417
- type: Input
418
- }], strapiDataLocation: [{
419
- type: Input
420
- }], labelsVisible: [{
421
- type: Input
422
- }], showChildren: [{
423
- type: Input
424
- }], menuItemGroups: [{
425
- type: Input
426
- }] } });
427
-
428
- class SideNavMenuComponent extends NavBaseComponent {
429
- constructor(strapiLinkService, domService, menuSharedConfig) {
430
- super();
431
- this.strapiLinkService = strapiLinkService;
432
- this.domService = domService;
433
- this.COLLAPSED_LOCAL_STORAGE_KEY = "TLD_MENU_SIDE_NAV_COLLAPSED";
434
- //#region Plausible event variables for collapse button
435
- this.COLLAPSE_PLAUSIBLE_EVENT_ID = "collapseMenu";
436
- this.COLLAPSE_PLAUSIBLE_ACTION_KEY = "action";
437
- this.LOGOCLICK_PLAUSIBLE_ACTION_ID = "tilde_logo_click";
438
- this.LOGOCLICK_PLAUSIBLE_EVENT = {
439
- eventId: this.LOGOCLICK_PLAUSIBLE_ACTION_ID,
440
- properties: []
441
- };
442
- this.EXPAND_PLAUSIBLE_EVENT = {
443
- eventId: this.COLLAPSE_PLAUSIBLE_EVENT_ID,
444
- properties: [{ key: this.COLLAPSE_PLAUSIBLE_ACTION_KEY, value: "expand" }]
445
- };
446
- this.COLLAPSE_PLAUSIBLE_EVENT = {
447
- eventId: this.COLLAPSE_PLAUSIBLE_EVENT_ID,
448
- properties: [{ key: this.COLLAPSE_PLAUSIBLE_ACTION_KEY, value: "collapse" }]
449
- };
450
- //#endregion
451
- this.menuSettings = {
452
- expandedWidth: '9.375em',
453
- collapsedWidth: '5em',
454
- menuLogo: '',
455
- menuLogoCollapsed: '',
456
- disableStrapi: false
457
- };
458
- this.collapsed = false;
459
- this.baseUrl = menuSharedConfig.baseUrl || '';
460
- }
461
- get menuLogoImage() {
462
- var _a;
463
- return this.collapsed
464
- ? (_a = this.menuSettings.menuLogoCollapsed) !== null && _a !== void 0 ? _a : this.menuSettings.menuLogo
465
- : this.menuSettings.menuLogo;
466
- }
467
- get sideNavWidth() {
468
- return this.collapsed ? this.menuSettings.collapsedWidth : this.menuSettings.expandedWidth;
469
- }
470
- ngOnInit() {
471
- this.getColapsedFromLocalStorage();
472
- }
473
- logoClick(event) {
474
- this.strapiLinkService.strapiLinkClick(event);
475
- }
476
- toggleCollapse() {
477
- this.collapsed = !this.collapsed;
478
- this.setColapsedFromLocalStorage();
479
- }
480
- getColapsedFromLocalStorage() {
481
- if (!this.domService.localStorage) {
482
- return;
483
- }
484
- this.collapsed = this.domService.localStorage.getItem(this.COLLAPSED_LOCAL_STORAGE_KEY) == 'true' ? true : false;
485
- }
486
- setColapsedFromLocalStorage() {
487
- if (!this.domService.localStorage) {
488
- return;
489
- }
490
- this.domService.localStorage.setItem(this.COLLAPSED_LOCAL_STORAGE_KEY, this.collapsed.toString());
491
- }
492
- }
493
- SideNavMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SideNavMenuComponent, deps: [{ token: i1.StrapiLinkService }, { token: i2.DOMService }, { token: MENU_SHARED_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Component });
494
- SideNavMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", 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 .toggler span.mat-button-focus-overlay{opacity:0!important}:host::ng-deep button.collapse-btn,:host::ng-deep button.toggler{margin-bottom:1em}:host::ng-deep button.collapse-btn .mat-button-focus-overlay,:host::ng-deep button.toggler .mat-button-focus-overlay{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: i2$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: i6.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { 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" }] });
495
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: SideNavMenuComponent, decorators: [{
496
- type: Component,
497
- 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 .toggler span.mat-button-focus-overlay{opacity:0!important}:host::ng-deep button.collapse-btn,:host::ng-deep button.toggler{margin-bottom:1em}:host::ng-deep button.collapse-btn .mat-button-focus-overlay,:host::ng-deep button.toggler .mat-button-focus-overlay{display:none}\n"] }]
498
- }], ctorParameters: function () {
499
- return [{ type: i1.StrapiLinkService }, { type: i2.DOMService }, { type: undefined, decorators: [{
500
- type: Optional
501
- }, {
502
- type: Inject,
503
- args: [MENU_SHARED_CONFIG]
504
- }] }];
505
- }, propDecorators: { menuSettings: [{
506
- type: Input
507
- }] } });
508
-
509
- class ModalNavMenuComponent extends NavBaseComponent {
510
- constructor() {
511
- super();
512
- this.menuDialogSettings = {
513
- showMenuTitle: false,
514
- fullScreen: true
515
- };
516
- this.showChildren = true;
517
- // any type because emitter doesn't really need a value
518
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
519
- this.closeButtonClick = new EventEmitter();
520
- }
521
- close() {
522
- this.closeButtonClick.emit(null);
523
- }
524
- }
525
- ModalNavMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ModalNavMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
526
- ModalNavMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", 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: i2$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" }] });
527
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ModalNavMenuComponent, decorators: [{
528
- type: Component,
529
- 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"] }]
530
- }], ctorParameters: function () { return []; }, propDecorators: { menuDialogSettings: [{
531
- type: Input
532
- }], showChildren: [{
533
- type: Input
534
- }], closeButtonClick: [{
535
- type: Output
536
- }] } });
537
-
538
- const menuLogo = `
539
- <svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
540
- <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"/>
541
- </svg>
542
-
543
- `;
544
-
545
- var TitlePlacement;
546
- (function (TitlePlacement) {
547
- TitlePlacement["none"] = "none";
548
- TitlePlacement["left"] = "left";
549
- TitlePlacement["right"] = "right";
550
- })(TitlePlacement || (TitlePlacement = {}));
551
-
552
- class MenuItemIconComponent extends NavBaseComponent {
553
- constructor(iconService, router) {
554
- super();
555
- this.iconService = iconService;
556
- this.router = router;
557
- this.menuSettings = {
558
- titlePlacement: TitlePlacement.left
559
- };
560
- this.menuDialogSettings = {
561
- showMenuTitle: true,
562
- disableStrapi: true,
563
- fullScreen: true
564
- };
565
- this.showChildren = true;
566
- this.direction = MenuLayoutDirection.row;
567
- this.subscription = [];
568
- this.iconName = 'tld-menu-icon';
569
- this.TITLE_PLACEMENT_NONE = TitlePlacement.none;
570
- this.TITLE_PLACEMENT_LEFT = TitlePlacement.left;
571
- this.PLAUSIBLE_EVENT = {
572
- eventId: "burger_click"
573
- };
574
- }
575
- ngOnInit() {
576
- const routeChangeSub = this.router.events.subscribe(() => this.closeMenu());
577
- this.subscription.push(routeChangeSub);
578
- this.registerIcon();
579
- }
580
- closeMenu() {
581
- var _a;
582
- (_a = this.menuTrigger) === null || _a === void 0 ? void 0 : _a.closeMenu();
583
- }
584
- ngOnDestroy() {
585
- this.subscription.forEach(e => e.unsubscribe());
586
- }
587
- registerIcon() {
588
- if (this.menuSettings.iconPath) {
589
- this.iconService.registerIconFromUrl(this.iconName, this.menuSettings.iconPath);
590
- }
591
- else {
592
- this.iconService.registerIcons({ [this.iconName]: menuLogo });
593
- }
594
- }
595
- }
596
- MenuItemIconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MenuItemIconComponent, deps: [{ token: i2.IconService }, { token: i2$2.Router }], target: i0.ɵɵFactoryTarget.Component });
597
- MenuItemIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", 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-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-menu-panel.mobile-menu-dialog.full-screen){width:100%;max-width:100%}::ng-deep .mat-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: i2$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: i6.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i7$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "directive", type: i7$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { 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" }] });
598
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MenuItemIconComponent, decorators: [{
599
- type: Component,
600
- 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-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-menu-panel.mobile-menu-dialog.full-screen){width:100%;max-width:100%}::ng-deep .mat-menu-panel.mobile-menu-dialog.full-screen{width:100vw;margin-top:-2.5em;max-width:none}\n"] }]
601
- }], ctorParameters: function () { return [{ type: i2.IconService }, { type: i2$2.Router }]; }, propDecorators: { menuTrigger: [{
602
- type: ViewChild,
603
- args: ['menuTrigger']
604
- }], menuSettings: [{
605
- type: Input
606
- }], menuDialogSettings: [{
607
- type: Input
608
- }], showChildren: [{
609
- type: Input
610
- }], direction: [{
611
- type: Input
612
- }] } });
613
-
614
- class MenuModule {
615
- static forRoot(config) {
616
- return {
617
- ngModule: MenuModule,
618
- providers: [
619
- { provide: MENU_SHARED_CONFIG, useValue: config }
620
- ]
621
- };
622
- }
623
- }
624
- MenuModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
625
- MenuModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.3.0", ngImport: i0, type: MenuModule, declarations: [SideNavMenuComponent,
626
- ModalNavMenuComponent,
627
- MenuItemIconComponent,
628
- NavBaseComponent,
629
- MenuItemListComponent,
630
- MenuColumnsComponent,
631
- MenuIconComponent,
632
- MenuItemLinkComponent], imports: [HttpClientModule,
633
- FlexLayoutModule,
634
- RouterModule,
635
- CommonModule,
636
- MatTooltipModule,
637
- MatDialogModule,
638
- MatIconModule,
639
- MatButtonModule,
640
- MatListModule,
641
- MatMenuModule,
642
- MatIconModule,
643
- TranslateModule,
644
- PlausibleModule], exports: [SideNavMenuComponent,
645
- ModalNavMenuComponent,
646
- MenuItemIconComponent,
647
- MenuColumnsComponent] });
648
- MenuModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MenuModule, providers: [
649
- StarpiMenuService
650
- ], imports: [HttpClientModule,
651
- FlexLayoutModule,
652
- RouterModule,
653
- CommonModule,
654
- MatTooltipModule,
655
- MatDialogModule,
656
- MatIconModule,
657
- MatButtonModule,
658
- MatListModule,
659
- MatMenuModule,
660
- MatIconModule,
661
- TranslateModule,
662
- PlausibleModule] });
663
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MenuModule, decorators: [{
664
- type: NgModule,
665
- args: [{
666
- declarations: [
667
- SideNavMenuComponent,
668
- ModalNavMenuComponent,
669
- MenuItemIconComponent,
670
- NavBaseComponent,
671
- MenuItemListComponent,
672
- MenuColumnsComponent,
673
- MenuIconComponent,
674
- MenuItemLinkComponent
675
- ],
676
- providers: [
677
- StarpiMenuService
678
- ],
679
- imports: [
680
- HttpClientModule,
681
- FlexLayoutModule,
682
- RouterModule,
683
- CommonModule,
684
- MatTooltipModule,
685
- MatDialogModule,
686
- MatIconModule,
687
- MatButtonModule,
688
- MatListModule,
689
- MatMenuModule,
690
- MatIconModule,
691
- TranslateModule,
692
- PlausibleModule
693
- ],
694
- exports: [
695
- SideNavMenuComponent,
696
- ModalNavMenuComponent,
697
- MenuItemIconComponent,
698
- MenuColumnsComponent,
699
- ]
700
- }]
701
- }] });
702
-
703
- /*
704
- * Public API Surface of ngx-menu
705
- */
706
-
707
- /**
708
- * Generated bundle index. Do not edit.
709
- */
710
-
711
- export { MENU_ICON_STRAPI_EXTENSION, MENU_SHARED_CONFIG, MenuColumnsComponent, MenuItemIconComponent, MenuLayoutDirection, MenuModule, ModalNavMenuComponent, NavBaseComponent, SideNavMenuComponent, StarpiMenuService, StrapiDataLocation, TitlePlacement };
712
- //# sourceMappingURL=tilde-nlp-ngx-menu.mjs.map