@muraai/mnl-commons 0.2.0-alpha-db495b1 → 0.2.0-alpha-11e96eb
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/muraai-mnl-commons.mjs +83 -99
- package/fesm2022/muraai-mnl-commons.mjs.map +1 -1
- package/lib/components/menu/menu.component.d.ts +3 -1
- package/package.json +4 -5
- package/src/lib/theming.scss +5 -0
- package/esm2022/lib/commons.module.mjs +0 -148
- package/esm2022/lib/components/header/header.component.mjs +0 -33
- package/esm2022/lib/components/highlighter/highlighter.component.mjs +0 -24
- package/esm2022/lib/components/language-menu/language-menu.component.mjs +0 -41
- package/esm2022/lib/components/login/login.component.mjs +0 -60
- package/esm2022/lib/components/menu/menu.component.mjs +0 -89
- package/esm2022/lib/components/placeholder/placeholder.component.mjs +0 -19
- package/esm2022/lib/components/profile/profile.component.mjs +0 -45
- package/esm2022/lib/material.module.mjs +0 -60
- package/esm2022/lib/model/log-levels.model.mjs +0 -17
- package/esm2022/lib/model/menu-data.model.mjs +0 -2
- package/esm2022/lib/model/translation-resource.mjs +0 -14
- package/esm2022/lib/model/user-model.mjs +0 -2
- package/esm2022/lib/pipes/app-config-pipe.mjs +0 -21
- package/esm2022/lib/pipes/time-ago-pipe.mjs +0 -44
- package/esm2022/lib/pipes/user-fullname-pipe.mjs +0 -35
- package/esm2022/lib/pipes/user-initials-pipe.mjs +0 -49
- package/esm2022/lib/services/app.config.service.mjs +0 -41
- package/esm2022/lib/services/local-storage.service.mjs +0 -48
- package/esm2022/lib/services/locale.service.mjs +0 -89
- package/esm2022/lib/services/log.service.mjs +0 -89
- package/esm2022/lib/services/user-profile.service.mjs +0 -36
- package/esm2022/lib/utils/object-utils.mjs +0 -46
- package/esm2022/muraai-mnl-commons.mjs +0 -5
- package/esm2022/public-api.mjs +0 -27
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { NgModule, EventEmitter,
|
|
2
|
+
import { NgModule, EventEmitter, Output, Input, ViewEncapsulation, Component, Injectable, Inject, ElementRef, ViewChildren, Pipe, APP_INITIALIZER, InjectionToken } from '@angular/core';
|
|
3
3
|
import * as i2$2 from '@angular/material/button';
|
|
4
4
|
import { MatButtonModule } from '@angular/material/button';
|
|
5
5
|
import { MatListModule, MatNavList, MatListItem } from '@angular/material/list';
|
|
@@ -17,22 +17,21 @@ import * as i3$1 from '@angular/material/menu';
|
|
|
17
17
|
import { MatMenuModule } from '@angular/material/menu';
|
|
18
18
|
import * as i1$1 from '@angular/common';
|
|
19
19
|
import { CommonModule, DOCUMENT, DatePipe, registerLocaleData } from '@angular/common';
|
|
20
|
-
import * as i1$2 from '@angular/common/http';
|
|
21
|
-
import { HttpBackend } from '@angular/common/http';
|
|
22
20
|
import localeAR from '@angular/common/locales/ar';
|
|
23
21
|
import localeDE from '@angular/common/locales/de';
|
|
24
22
|
import localeFR from '@angular/common/locales/fr';
|
|
25
23
|
import * as i3 from '@ngx-translate/core';
|
|
26
|
-
import { TranslateModule
|
|
24
|
+
import { TranslateModule } from '@ngx-translate/core';
|
|
27
25
|
import * as i2 from '@angular/material/toolbar';
|
|
28
26
|
import { MatToolbarModule } from '@angular/material/toolbar';
|
|
27
|
+
import * as i1$2 from '@angular/common/http';
|
|
29
28
|
import * as i1$3 from '@angular/platform-browser';
|
|
30
29
|
import * as i5$1 from '@angular/material/tooltip';
|
|
31
30
|
import { MatTooltipModule } from '@angular/material/tooltip';
|
|
32
|
-
import { MultiTranslateHttpLoader } from 'ngx-translate-multi-http-loader';
|
|
33
31
|
import { formatDistance } from 'date-fns';
|
|
34
32
|
import differenceInDays from 'date-fns/differenceInDays';
|
|
35
33
|
import { Subject } from 'rxjs';
|
|
34
|
+
import { MultiTranslateHttpLoader } from 'ngx-translate-multi-http-loader';
|
|
36
35
|
|
|
37
36
|
function modules() {
|
|
38
37
|
return [
|
|
@@ -48,8 +47,8 @@ function modules() {
|
|
|
48
47
|
];
|
|
49
48
|
}
|
|
50
49
|
class MaterialModule {
|
|
51
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
52
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
50
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: MaterialModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
51
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.17", ngImport: i0, type: MaterialModule, imports: [MatButtonModule,
|
|
53
52
|
MatCardModule,
|
|
54
53
|
MatFormFieldModule,
|
|
55
54
|
MatIconModule,
|
|
@@ -66,7 +65,7 @@ class MaterialModule {
|
|
|
66
65
|
FormsModule,
|
|
67
66
|
ReactiveFormsModule,
|
|
68
67
|
MatMenuModule] }); }
|
|
69
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
68
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: MaterialModule, imports: [modules(), MatButtonModule,
|
|
70
69
|
MatCardModule,
|
|
71
70
|
MatFormFieldModule,
|
|
72
71
|
MatIconModule,
|
|
@@ -76,7 +75,7 @@ class MaterialModule {
|
|
|
76
75
|
ReactiveFormsModule,
|
|
77
76
|
MatMenuModule] }); }
|
|
78
77
|
}
|
|
79
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
78
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: MaterialModule, decorators: [{
|
|
80
79
|
type: NgModule,
|
|
81
80
|
args: [{
|
|
82
81
|
imports: modules(),
|
|
@@ -95,10 +94,10 @@ class HeaderComponent {
|
|
|
95
94
|
onLogoClick(event) {
|
|
96
95
|
this.logoClick.emit(event);
|
|
97
96
|
}
|
|
98
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
99
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
97
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: HeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
98
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: HeaderComponent, isStandalone: true, selector: "mnl-header", inputs: { header: "header" }, outputs: { menuButonClickEvent: "menuButonClickEvent", logoClick: "logoClick" }, ngImport: i0, template: "@if(header){\n <mat-toolbar color=\"{{ header.toolbarColor }}\">\n <mat-toolbar-row>\n <div class=\"flex justify-start items-center\">\n @if(header.showMenuIcon){\n <button mat-icon-button class=\"flex items-center\" (click)=\"menuClick($event)\">\n <mat-icon >menu</mat-icon>\n </button>\n }\n <img\n class=\"mr-[15px]\"\n (click)=\"onLogoClick($event)\"\n src=\"{{ header.logo }}\"\n />\n <span>{{ header.name | translate }}</span>\n </div>\n <div class=\"flex justify-end items-center grow max-w-full\">\n <ng-content select=\"`[mnl-header-content]`\"></ng-content>\n </div>\n </mat-toolbar-row>\n </mat-toolbar>\n}\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatToolbarModule }, { kind: "component", type: i2.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "directive", type: i2.MatToolbarRow, selector: "mat-toolbar-row", exportAs: ["matToolbarRow"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
100
99
|
}
|
|
101
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
100
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: HeaderComponent, decorators: [{
|
|
102
101
|
type: Component,
|
|
103
102
|
args: [{ selector: 'mnl-header', standalone: true, imports: [MatIconModule, MatToolbarModule, TranslateModule], encapsulation: ViewEncapsulation.None, template: "@if(header){\n <mat-toolbar color=\"{{ header.toolbarColor }}\">\n <mat-toolbar-row>\n <div class=\"flex justify-start items-center\">\n @if(header.showMenuIcon){\n <button mat-icon-button class=\"flex items-center\" (click)=\"menuClick($event)\">\n <mat-icon >menu</mat-icon>\n </button>\n }\n <img\n class=\"mr-[15px]\"\n (click)=\"onLogoClick($event)\"\n src=\"{{ header.logo }}\"\n />\n <span>{{ header.name | translate }}</span>\n </div>\n <div class=\"flex justify-end items-center grow max-w-full\">\n <ng-content select=\"`[mnl-header-content]`\"></ng-content>\n </div>\n </mat-toolbar-row>\n </mat-toolbar>\n}\n" }]
|
|
104
103
|
}], propDecorators: { header: [{
|
|
@@ -115,10 +114,10 @@ class HighlighterComponent {
|
|
|
115
114
|
this.width = '4px';
|
|
116
115
|
this.enabled = true;
|
|
117
116
|
}
|
|
118
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
119
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
117
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: HighlighterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
118
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: HighlighterComponent, isStandalone: true, selector: "mnl-highlighter", inputs: { height: "height", width: "width", enabled: "enabled" }, ngImport: i0, template: "<div\n [ngClass]=\"{ 'mnl-bg-primary': enabled }\"\n [ngStyle]=\"{ height: height, width: width }\"\n></div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
|
|
120
119
|
}
|
|
121
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
120
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: HighlighterComponent, decorators: [{
|
|
122
121
|
type: Component,
|
|
123
122
|
args: [{ selector: 'mnl-highlighter', standalone: true, imports: [CommonModule], template: "<div\n [ngClass]=\"{ 'mnl-bg-primary': enabled }\"\n [ngStyle]=\"{ height: height, width: width }\"\n></div>\n" }]
|
|
124
123
|
}], propDecorators: { height: [{
|
|
@@ -202,10 +201,10 @@ class AppConfigService {
|
|
|
202
201
|
});
|
|
203
202
|
});
|
|
204
203
|
}
|
|
205
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
206
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
204
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: AppConfigService, deps: [{ token: i1$2.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
205
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: AppConfigService, providedIn: 'root' }); }
|
|
207
206
|
}
|
|
208
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
207
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: AppConfigService, decorators: [{
|
|
209
208
|
type: Injectable,
|
|
210
209
|
args: [{
|
|
211
210
|
providedIn: 'root',
|
|
@@ -248,10 +247,10 @@ class LocalStorageService {
|
|
|
248
247
|
return false;
|
|
249
248
|
}
|
|
250
249
|
}
|
|
251
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
252
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
250
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: LocalStorageService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
251
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: LocalStorageService, providedIn: 'root' }); }
|
|
253
252
|
}
|
|
254
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
253
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: LocalStorageService, decorators: [{
|
|
255
254
|
type: Injectable,
|
|
256
255
|
args: [{
|
|
257
256
|
providedIn: 'root',
|
|
@@ -280,10 +279,10 @@ class UserProfileService {
|
|
|
280
279
|
getLocale() {
|
|
281
280
|
return this.localStorageService.get(this.getApplicationId() + this.userPrefix + UserProfileService.LOCALE_PREFIX);
|
|
282
281
|
}
|
|
283
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
284
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
282
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: UserProfileService, deps: [{ token: AppConfigService }, { token: LocalStorageService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
283
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: UserProfileService, providedIn: 'root' }); }
|
|
285
284
|
}
|
|
286
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
285
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: UserProfileService, decorators: [{
|
|
287
286
|
type: Injectable,
|
|
288
287
|
args: [{
|
|
289
288
|
providedIn: 'root'
|
|
@@ -360,10 +359,10 @@ class LocaleService {
|
|
|
360
359
|
this.userProfileService.setLocale(locale.key);
|
|
361
360
|
}
|
|
362
361
|
}
|
|
363
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
364
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
362
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: LocaleService, deps: [{ token: AppConfigService }, { token: i3.TranslateService }, { token: UserProfileService }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
363
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: LocaleService, providedIn: 'root' }); }
|
|
365
364
|
}
|
|
366
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
365
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: LocaleService, decorators: [{
|
|
367
366
|
type: Injectable,
|
|
368
367
|
args: [{
|
|
369
368
|
providedIn: 'root',
|
|
@@ -390,10 +389,10 @@ class LanguageMenuComponent {
|
|
|
390
389
|
get locale() {
|
|
391
390
|
return this.localeService.getActiveLocale() || this.localeService.getDefaultLocale();
|
|
392
391
|
}
|
|
393
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
394
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
392
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: LanguageMenuComponent, deps: [{ token: LocaleService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
393
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: LanguageMenuComponent, isStandalone: true, selector: "mnl-language-menu", inputs: { showLocaleKeyAsLabel: "showLocaleKeyAsLabel", showLocaleAsLabel: "showLocaleAsLabel" }, ngImport: i0, template: "<button id=\"mnl-locale-button\" mat-menu-item [matMenuTriggerFor]=\"languageMenu\">\n @if(showLocaleKeyAsLabel || showLocaleAsLabel){\n @if(showLocaleKeyAsLabel){\n <div>{{ locale.key | uppercase }}</div>\n }\n @if(showLocaleAsLabel){\n <div>{{ locale.label }}</div>\n } \n }\n @else{\n <ng-container>\n <div class=\"flex items-center\">\n <mat-icon>language</mat-icon>\n {{ \"MNL.LANGUAGE-SELECTOR.LANGUAGES\" | translate }}\n </div>\n </ng-container>\n } \n</button>\n<mat-menu #languageMenu=\"matMenu\">\n <button\n mat-menu-item\n *ngFor=\"let language of languages\"\n (click)=\"onChangeLanguage(language)\"\n id=\"langMenu\"\n >\n {{ language.label }}\n </button>\n</mat-menu>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i3$1.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i3$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i3$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: i1$1.UpperCasePipe, name: "uppercase" }] }); }
|
|
395
394
|
}
|
|
396
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
395
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: LanguageMenuComponent, decorators: [{
|
|
397
396
|
type: Component,
|
|
398
397
|
args: [{ selector: 'mnl-language-menu', standalone: true, imports: [MatIconModule, MatMenuModule, MatButtonModule, TranslateModule, CommonModule], template: "<button id=\"mnl-locale-button\" mat-menu-item [matMenuTriggerFor]=\"languageMenu\">\n @if(showLocaleKeyAsLabel || showLocaleAsLabel){\n @if(showLocaleKeyAsLabel){\n <div>{{ locale.key | uppercase }}</div>\n }\n @if(showLocaleAsLabel){\n <div>{{ locale.label }}</div>\n } \n }\n @else{\n <ng-container>\n <div class=\"flex items-center\">\n <mat-icon>language</mat-icon>\n {{ \"MNL.LANGUAGE-SELECTOR.LANGUAGES\" | translate }}\n </div>\n </ng-container>\n } \n</button>\n<mat-menu #languageMenu=\"matMenu\">\n <button\n mat-menu-item\n *ngFor=\"let language of languages\"\n (click)=\"onChangeLanguage(language)\"\n id=\"langMenu\"\n >\n {{ language.label }}\n </button>\n</mat-menu>\n" }]
|
|
399
398
|
}], ctorParameters: () => [{ type: LocaleService }], propDecorators: { showLocaleKeyAsLabel: [{
|
|
@@ -428,10 +427,10 @@ class LoginComponent {
|
|
|
428
427
|
getBackgroundImageUrl() {
|
|
429
428
|
return this.sanitizer.bypassSecurityTrustStyle(`url(${this.backgroundImageUrl})`);
|
|
430
429
|
}
|
|
431
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
432
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
430
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: LoginComponent, deps: [{ token: i1$3.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
431
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: LoginComponent, isStandalone: true, selector: "mnl-login", inputs: { title: "title", logoImageUrl: "logoImageUrl", backgroundImageUrl: "backgroundImageUrl", disabled: "disabled" }, outputs: { login: "login" }, ngImport: i0, template: "<div class=\"flex justify-center items-center min-h-full bg-cover\" [style.background-image]=\"getBackgroundImageUrl()\">\n <mat-card class=\"min-w-[260px]\">\n <form class=\"flex items-stretch flex-col\" [formGroup]=\"formGroup\" (ngSubmit)=\"onSubmit()\">\n <mat-card-header class=\"flex justify-center items-center\">\n <mat-card-title>\n @if(logoImageUrl){ \n <img src=\"{{logoImageUrl}}\">\n }\n </mat-card-title>\n </mat-card-header>\n @if(title){\n <h3 class=\"flex justify-center items-center opacity-60\">{{title | translate}}</h3>\n }\n <mat-form-field class=\"grow max-w-100\">\n <input id=\"username\" matInput placeholder=\"{{'MNL.LOGIN.USERNAME' | translate}}\"\n formControlName=\"username\">\n </mat-form-field>\n\n <mat-form-field class=\"grow max-w-100\">\n <input id=\"password\" matInput type=\"password\" placeholder=\"{{'MNL.LOGIN.PASSWORD' | translate}}\"\n formControlName=\"password\">\n </mat-form-field>\n <mat-card-actions class=\"flex justify-center items-center\">\n <button id=\"loginButton\" mat-raised-button color=\"accent\" [disabled]=\"disabled || !formGroup.valid\"\n type=\"submit\"> {{'MNL.LOGIN.LOGIN_BUTTON' | translate}}</button>\n </mat-card-actions>\n\n </form>\n </mat-card>\n</div>", styles: [""], dependencies: [{ kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i2$1.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i2$1.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }, { kind: "component", type: i2$1.MatCardHeader, selector: "mat-card-header" }, { kind: "directive", type: i2$1.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i5.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i6.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }] }); }
|
|
433
432
|
}
|
|
434
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
433
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: LoginComponent, decorators: [{
|
|
435
434
|
type: Component,
|
|
436
435
|
args: [{ selector: 'mnl-login', standalone: true, imports: [MatCardModule, TranslateModule, MatFormFieldModule, ReactiveFormsModule, MatInputModule, MatButtonModule], template: "<div class=\"flex justify-center items-center min-h-full bg-cover\" [style.background-image]=\"getBackgroundImageUrl()\">\n <mat-card class=\"min-w-[260px]\">\n <form class=\"flex items-stretch flex-col\" [formGroup]=\"formGroup\" (ngSubmit)=\"onSubmit()\">\n <mat-card-header class=\"flex justify-center items-center\">\n <mat-card-title>\n @if(logoImageUrl){ \n <img src=\"{{logoImageUrl}}\">\n }\n </mat-card-title>\n </mat-card-header>\n @if(title){\n <h3 class=\"flex justify-center items-center opacity-60\">{{title | translate}}</h3>\n }\n <mat-form-field class=\"grow max-w-100\">\n <input id=\"username\" matInput placeholder=\"{{'MNL.LOGIN.USERNAME' | translate}}\"\n formControlName=\"username\">\n </mat-form-field>\n\n <mat-form-field class=\"grow max-w-100\">\n <input id=\"password\" matInput type=\"password\" placeholder=\"{{'MNL.LOGIN.PASSWORD' | translate}}\"\n formControlName=\"password\">\n </mat-form-field>\n <mat-card-actions class=\"flex justify-center items-center\">\n <button id=\"loginButton\" mat-raised-button color=\"accent\" [disabled]=\"disabled || !formGroup.valid\"\n type=\"submit\"> {{'MNL.LOGIN.LOGIN_BUTTON' | translate}}</button>\n </mat-card-actions>\n\n </form>\n </mat-card>\n</div>" }]
|
|
437
436
|
}], ctorParameters: () => [{ type: i1$3.DomSanitizer }], propDecorators: { title: [{
|
|
@@ -447,12 +446,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
447
446
|
}] } });
|
|
448
447
|
|
|
449
448
|
class MenuComponent {
|
|
450
|
-
constructor() {
|
|
449
|
+
constructor(cdr) {
|
|
450
|
+
this.cdr = cdr;
|
|
451
451
|
this.isCollapsed = false;
|
|
452
452
|
this.menuClick = new EventEmitter();
|
|
453
453
|
}
|
|
454
454
|
ngAfterViewInit() {
|
|
455
455
|
this.calculateSubMenuWidth();
|
|
456
|
+
this.cdr.detectChanges();
|
|
456
457
|
}
|
|
457
458
|
onMenuClick(menu) {
|
|
458
459
|
if (this.hasSubMenu(menu)) {
|
|
@@ -502,13 +503,13 @@ class MenuComponent {
|
|
|
502
503
|
const navListWidths = this.navLists.toArray().map(navList => navList.nativeElement.offsetWidth);
|
|
503
504
|
this.subMenuWidth = Math.max(...navListWidths) - 85;
|
|
504
505
|
}
|
|
505
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
506
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
506
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: MenuComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
507
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: MenuComponent, isStandalone: true, selector: "mnl-menu", inputs: { menuData: "menuData", highlighterColor: "highlighterColor", isCollapsed: "isCollapsed" }, outputs: { menuClick: "menuClick" }, viewQueries: [{ propertyName: "navLists", predicate: ["navList"], descendants: true, read: ElementRef }], ngImport: i0, template: "<mat-nav-list #navList *ngFor=\"let menu of menuData\">\n @if(!isCollapsed){\n <a\n mat-list-item\n (click)=\"onMenuClick(menu)\"\n id=\"mnl-menu-anchor\"\n matTooltip=\"{{ menu?.toolTip | translate }}\"\n [ngClass]=\"menu.selected && !menu.expanded ? 'mnl-menu-active' : ''\"\n >\n <div class=\"flex items-center\">\n @if(menu.icon){\n <mat-icon\n [ngStyle]=\"{\n color: menu.selected && highlighterColor ? highlighterColor : ''\n }\"\n [class.mnl-color-primary]=\"menu.selected && !highlighterColor\"\n >{{ menu.icon }}</mat-icon\n >\n } @else{\n <mat-icon\n svgIcon=\"{{ menu.svgIcon }}\"\n [ngStyle]=\"{\n color: menu.selected && highlighterColor ? highlighterColor : ''\n }\"\n [class.mnl-color-primary]=\"menu.selected && !highlighterColor\"\n >\n </mat-icon>\n }\n <span\n class=\"mnl-menu\"\n id=\"mnl-menu\"\n [ngStyle]=\"{\n color: menu.selected && highlighterColor ? highlighterColor : ''\n }\"\n [class.mnl-color-primary]=\"menu.selected && !highlighterColor\"\n >{{ menu.name | translate }}</span\n >\n @if(menu.subMenus && menu.subMenus.length > 0){\n <span class=\"ml-5\"></span>\n <mat-icon\n class=\"mnl-menu-button flex ml-auto\" \n (click)=\"toggleMenu(menu, $event)\"\n [ngStyle]=\"{\n color: menu.selected && highlighterColor ? highlighterColor : ''\n }\"\n [class.mnl-color-primary]=\"menu.selected && !highlighterColor\"\n [ngClass]=\"{ 'mnl-rotated': menu.expanded }\"\n >expand_more</mat-icon\n >\n }\n </div>\n </a>\n } @else if(isCollapsed) {\n @if(menu.subMenus){\n <a\n mat-list-item\n id=\"mnl-menu-anchor\"\n [matMenuTriggerFor]=\"sidenavMenu\"\n [ngClass]=\"menu.selected ? 'mnl-menu-active' : ''\"\n >\n <div class=\"flex items-center\">\n @if(menu.icon){\n <mat-icon\n [ngStyle]=\"{\n color: menu.selected && highlighterColor ? highlighterColor : ''\n }\"\n [class.mnl-color-primary]=\"menu.selected && !highlighterColor\"\n >{{ menu.icon }}</mat-icon\n >\n } @else{\n <mat-icon\n svgIcon=\"{{ menu.svgIcon }}\"\n [ngStyle]=\"{\n color: menu.selected && highlighterColor ? highlighterColor : ''\n }\"\n [class.mnl-color-primary]=\"menu.selected && !highlighterColor\"\n >\n </mat-icon>\n }\n </div>\n </a>\n <mat-menu #sidenavMenu=\"matMenu\" class=\"ml-5\">\n <button\n mat-menu-item\n *ngFor=\"let sub of menu.subMenus\"\n (click)=\"onSubMenuClick(sub, menu)\"\n matTooltip=\"{{ sub?.toolTip | translate }}\"\n [ngClass]=\"sub.selected ? 'mnl-menu-active' : ''\"\n >\n <span\n [ngStyle]=\"{\n color: sub.selected && highlighterColor ? highlighterColor : ''\n }\"\n [class.mnl-color-primary]=\"sub.selected && !highlighterColor\"\n >{{ sub.name | translate }}</span\n >\n </button>\n </mat-menu>\n } @else{\n <a\n mat-list-item\n (click)=\"onMenuClick(menu)\"\n id=\"mnl-menu-anchor\"\n matTooltip=\"{{ menu?.toolTip | translate }}\"\n [ngClass]=\"menu.selected ? 'mnl-menu-active' : ''\"\n >\n <div class=\"flex items-center\">\n @if(menu.icon){\n <mat-icon\n [ngStyle]=\"{\n color: menu.selected && highlighterColor ? highlighterColor : ''\n }\"\n [class.mnl-color-primary]=\"menu.selected && !highlighterColor\"\n >{{ menu.icon }}</mat-icon\n >\n } @else{\n <mat-icon\n svgIcon=\"{{ menu.svgIcon }}\"\n [ngStyle]=\"{\n color: menu.selected && highlighterColor ? highlighterColor : ''\n }\"\n [class.mnl-color-primary]=\"menu.selected && !highlighterColor\"\n >\n </mat-icon>\n }\n </div>\n </a>\n } }\n\n <ng-container *ngFor=\"let sub of menu.subMenus\">\n @if(menu.expanded && !isCollapsed){\n <a\n mat-list-item\n class=\"mnl-submenu flex flex-row ml-6 truncate\"\n [class.mnl-expanded]=\"menu.expanded\"\n (click)=\"onSubMenuClick(sub, menu)\"\n id=\"mnl-submenu-anchor\"\n matTooltip=\"{{ sub?.toolTip | translate }}\"\n [ngClass]=\"sub.selected ? 'mnl-menu-active' : ''\"\n >\n <div class=\"flex items-center\">\n @if(sub.icon){\n <mat-icon\n [ngStyle]=\"{\n color: sub.selected && highlighterColor ? highlighterColor : ''\n }\"\n [class.mnl-color-primary]=\"sub.selected && !highlighterColor\"\n >{{ sub.icon }}</mat-icon\n >\n }\n <span\n [style.width.px]=\"subMenuWidth\" \n [ngStyle]=\"{\n color: sub.selected && highlighterColor ? highlighterColor : ''\n }\"\n [class.mnl-color-primary]=\"sub.selected && !highlighterColor\"\n class=\"mnl-menu truncate\"\n id=\"mnl-submenu\"\n >{{ sub.name | translate }}</span\n >\n </div>\n </a>\n }\n </ng-container>\n</mat-nav-list>\n", styles: [".mnl-submenu{overflow-y:hidden;transition:transform .3s ease;transform:scaleY(0);transform-origin:top;padding-left:15px!important;width:calc(100% - 24px)}.mnl-submenu.mnl-expanded{transform:scaleY(1)}.mnl-menu{margin-left:10px;margin-right:10px}.mnl-menu-button{transition:.3s ease-in-out;transform:rotate(0);margin-top:3px}.mnl-menu-button.mnl-rotated{transform:rotate(180deg)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: MatNavList, selector: "mat-nav-list", exportAs: ["matNavList"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i3$1.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i3$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i3$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i5$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }] }); }
|
|
507
508
|
}
|
|
508
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
509
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: MenuComponent, decorators: [{
|
|
509
510
|
type: Component,
|
|
510
|
-
args: [{ selector: 'mnl-menu', standalone: true, imports: [CommonModule, MatNavList, MatIconModule, TranslateModule, MatMenuModule,
|
|
511
|
-
}], propDecorators: { navLists: [{
|
|
511
|
+
args: [{ selector: 'mnl-menu', standalone: true, imports: [CommonModule, MatNavList, MatIconModule, TranslateModule, MatMenuModule, MatListItem, MatTooltipModule], template: "<mat-nav-list #navList *ngFor=\"let menu of menuData\">\n @if(!isCollapsed){\n <a\n mat-list-item\n (click)=\"onMenuClick(menu)\"\n id=\"mnl-menu-anchor\"\n matTooltip=\"{{ menu?.toolTip | translate }}\"\n [ngClass]=\"menu.selected && !menu.expanded ? 'mnl-menu-active' : ''\"\n >\n <div class=\"flex items-center\">\n @if(menu.icon){\n <mat-icon\n [ngStyle]=\"{\n color: menu.selected && highlighterColor ? highlighterColor : ''\n }\"\n [class.mnl-color-primary]=\"menu.selected && !highlighterColor\"\n >{{ menu.icon }}</mat-icon\n >\n } @else{\n <mat-icon\n svgIcon=\"{{ menu.svgIcon }}\"\n [ngStyle]=\"{\n color: menu.selected && highlighterColor ? highlighterColor : ''\n }\"\n [class.mnl-color-primary]=\"menu.selected && !highlighterColor\"\n >\n </mat-icon>\n }\n <span\n class=\"mnl-menu\"\n id=\"mnl-menu\"\n [ngStyle]=\"{\n color: menu.selected && highlighterColor ? highlighterColor : ''\n }\"\n [class.mnl-color-primary]=\"menu.selected && !highlighterColor\"\n >{{ menu.name | translate }}</span\n >\n @if(menu.subMenus && menu.subMenus.length > 0){\n <span class=\"ml-5\"></span>\n <mat-icon\n class=\"mnl-menu-button flex ml-auto\" \n (click)=\"toggleMenu(menu, $event)\"\n [ngStyle]=\"{\n color: menu.selected && highlighterColor ? highlighterColor : ''\n }\"\n [class.mnl-color-primary]=\"menu.selected && !highlighterColor\"\n [ngClass]=\"{ 'mnl-rotated': menu.expanded }\"\n >expand_more</mat-icon\n >\n }\n </div>\n </a>\n } @else if(isCollapsed) {\n @if(menu.subMenus){\n <a\n mat-list-item\n id=\"mnl-menu-anchor\"\n [matMenuTriggerFor]=\"sidenavMenu\"\n [ngClass]=\"menu.selected ? 'mnl-menu-active' : ''\"\n >\n <div class=\"flex items-center\">\n @if(menu.icon){\n <mat-icon\n [ngStyle]=\"{\n color: menu.selected && highlighterColor ? highlighterColor : ''\n }\"\n [class.mnl-color-primary]=\"menu.selected && !highlighterColor\"\n >{{ menu.icon }}</mat-icon\n >\n } @else{\n <mat-icon\n svgIcon=\"{{ menu.svgIcon }}\"\n [ngStyle]=\"{\n color: menu.selected && highlighterColor ? highlighterColor : ''\n }\"\n [class.mnl-color-primary]=\"menu.selected && !highlighterColor\"\n >\n </mat-icon>\n }\n </div>\n </a>\n <mat-menu #sidenavMenu=\"matMenu\" class=\"ml-5\">\n <button\n mat-menu-item\n *ngFor=\"let sub of menu.subMenus\"\n (click)=\"onSubMenuClick(sub, menu)\"\n matTooltip=\"{{ sub?.toolTip | translate }}\"\n [ngClass]=\"sub.selected ? 'mnl-menu-active' : ''\"\n >\n <span\n [ngStyle]=\"{\n color: sub.selected && highlighterColor ? highlighterColor : ''\n }\"\n [class.mnl-color-primary]=\"sub.selected && !highlighterColor\"\n >{{ sub.name | translate }}</span\n >\n </button>\n </mat-menu>\n } @else{\n <a\n mat-list-item\n (click)=\"onMenuClick(menu)\"\n id=\"mnl-menu-anchor\"\n matTooltip=\"{{ menu?.toolTip | translate }}\"\n [ngClass]=\"menu.selected ? 'mnl-menu-active' : ''\"\n >\n <div class=\"flex items-center\">\n @if(menu.icon){\n <mat-icon\n [ngStyle]=\"{\n color: menu.selected && highlighterColor ? highlighterColor : ''\n }\"\n [class.mnl-color-primary]=\"menu.selected && !highlighterColor\"\n >{{ menu.icon }}</mat-icon\n >\n } @else{\n <mat-icon\n svgIcon=\"{{ menu.svgIcon }}\"\n [ngStyle]=\"{\n color: menu.selected && highlighterColor ? highlighterColor : ''\n }\"\n [class.mnl-color-primary]=\"menu.selected && !highlighterColor\"\n >\n </mat-icon>\n }\n </div>\n </a>\n } }\n\n <ng-container *ngFor=\"let sub of menu.subMenus\">\n @if(menu.expanded && !isCollapsed){\n <a\n mat-list-item\n class=\"mnl-submenu flex flex-row ml-6 truncate\"\n [class.mnl-expanded]=\"menu.expanded\"\n (click)=\"onSubMenuClick(sub, menu)\"\n id=\"mnl-submenu-anchor\"\n matTooltip=\"{{ sub?.toolTip | translate }}\"\n [ngClass]=\"sub.selected ? 'mnl-menu-active' : ''\"\n >\n <div class=\"flex items-center\">\n @if(sub.icon){\n <mat-icon\n [ngStyle]=\"{\n color: sub.selected && highlighterColor ? highlighterColor : ''\n }\"\n [class.mnl-color-primary]=\"sub.selected && !highlighterColor\"\n >{{ sub.icon }}</mat-icon\n >\n }\n <span\n [style.width.px]=\"subMenuWidth\" \n [ngStyle]=\"{\n color: sub.selected && highlighterColor ? highlighterColor : ''\n }\"\n [class.mnl-color-primary]=\"sub.selected && !highlighterColor\"\n class=\"mnl-menu truncate\"\n id=\"mnl-submenu\"\n >{{ sub.name | translate }}</span\n >\n </div>\n </a>\n }\n </ng-container>\n</mat-nav-list>\n", styles: [".mnl-submenu{overflow-y:hidden;transition:transform .3s ease;transform:scaleY(0);transform-origin:top;padding-left:15px!important;width:calc(100% - 24px)}.mnl-submenu.mnl-expanded{transform:scaleY(1)}.mnl-menu{margin-left:10px;margin-right:10px}.mnl-menu-button{transition:.3s ease-in-out;transform:rotate(0);margin-top:3px}.mnl-menu-button.mnl-rotated{transform:rotate(180deg)}\n"] }]
|
|
512
|
+
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { navLists: [{
|
|
512
513
|
type: ViewChildren,
|
|
513
514
|
args: ['navList', { read: ElementRef }]
|
|
514
515
|
}], menuData: [{
|
|
@@ -543,10 +544,10 @@ class UserFullnamePipe {
|
|
|
543
544
|
isEmptyObject(data) {
|
|
544
545
|
return (data && (Object.keys(data).length === 0));
|
|
545
546
|
}
|
|
546
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
547
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
547
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: UserFullnamePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
548
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.17", ngImport: i0, type: UserFullnamePipe, isStandalone: true, name: "mnlUserFullName" }); }
|
|
548
549
|
}
|
|
549
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
550
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: UserFullnamePipe, decorators: [{
|
|
550
551
|
type: Pipe,
|
|
551
552
|
args: [{
|
|
552
553
|
name: 'mnlUserFullName',
|
|
@@ -590,10 +591,10 @@ class UserInitialPipe {
|
|
|
590
591
|
hasWhiteSpace(data) {
|
|
591
592
|
return /\s/g.test(data);
|
|
592
593
|
}
|
|
593
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
594
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
594
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: UserInitialPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
595
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.17", ngImport: i0, type: UserInitialPipe, isStandalone: true, name: "mnlUserInitialPipe" }); }
|
|
595
596
|
}
|
|
596
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
597
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: UserInitialPipe, decorators: [{
|
|
597
598
|
type: Pipe,
|
|
598
599
|
args: [{
|
|
599
600
|
name: 'mnlUserInitialPipe',
|
|
@@ -611,19 +612,13 @@ class ProfileComponent {
|
|
|
611
612
|
this.userInitialClick.emit(event);
|
|
612
613
|
}
|
|
613
614
|
ngOnChanges(changes) {
|
|
614
|
-
|
|
615
|
-
|
|
616
|
-
&& changes.userProfileDetails.currentValue.email) {
|
|
617
|
-
this.hasUserDetails = true;
|
|
618
|
-
}
|
|
619
|
-
else {
|
|
620
|
-
this.hasUserDetails = false;
|
|
621
|
-
}
|
|
615
|
+
const user = this.userProfileDetails;
|
|
616
|
+
this.hasUserDetails = !!(user && (user.firstName || user.lastName || user.email));
|
|
622
617
|
}
|
|
623
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
624
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
618
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: ProfileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
619
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: ProfileComponent, isStandalone: true, selector: "mnl-user-profile", inputs: { userProfileDetails: "userProfileDetails", showDisplayName: "showDisplayName" }, outputs: { userInitialClick: "userInitialClick", profileMenuClick: "profileMenuClick" }, usesOnChanges: true, ngImport: i0, template: "<div id=\"mnl-profile-container\" class=\"flex gap-[10px] justify-content: items-center\">\n @if(showDisplayName && hasUserDetails){\n <div class=\"flex flex-col\">\n <span\n id=\"mnl-userinfo-name\"\n class=\" hidden md:inline\"\n >{{ userProfileDetails | mnlUserFullName }}\n </span>\n @if (userProfileDetails?.userRole) {\n <span id=\"mnl-userinfo-role\" class=\"text-center leading-3 md:inline hidden\">\n {{ userProfileDetails?.userRole | translate }}\n </span>\n }\n </div>\n }\n @if(hasUserDetails){\n <button\n id=\"mnl-initials-button\"\n (click)=\"onUserInitialClick($event)\"\n mat-mini-fab\n >\n {{ userProfileDetails | mnlUserInitialPipe }}\n </button>\n }\n \n @if(!hasUserDetails){\n <button\n id=\"mnl-user-icon-button\"\n mat-raised-button\n (click)=\"onUserInitialClick($event)\"\n >\n <mat-icon mat-icon-button>person</mat-icon>\n </button>\n }\n </div>", styles: ["#mnl-initials-button{border-radius:20px}:host ::ng-deep .mat-mdc-mini-fab{background-color:#fff!important;color:#000!important}#mnl-userinfo-role{font-size:1rem}\n"], dependencies: [{ kind: "pipe", type: UserFullnamePipe, name: "mnlUserFullName" }, { kind: "pipe", type: UserInitialPipe, name: "mnlUserInitialPipe" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i2$2.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i2$2.MatMiniFabButton, selector: "button[mat-mini-fab]", exportAs: ["matButton"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] }); }
|
|
625
620
|
}
|
|
626
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
621
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: ProfileComponent, decorators: [{
|
|
627
622
|
type: Component,
|
|
628
623
|
args: [{ selector: 'mnl-user-profile', standalone: true, imports: [UserFullnamePipe, UserInitialPipe, MatIconModule, MatButtonModule, TranslateModule], template: "<div id=\"mnl-profile-container\" class=\"flex gap-[10px] justify-content: items-center\">\n @if(showDisplayName && hasUserDetails){\n <div class=\"flex flex-col\">\n <span\n id=\"mnl-userinfo-name\"\n class=\" hidden md:inline\"\n >{{ userProfileDetails | mnlUserFullName }}\n </span>\n @if (userProfileDetails?.userRole) {\n <span id=\"mnl-userinfo-role\" class=\"text-center leading-3 md:inline hidden\">\n {{ userProfileDetails?.userRole | translate }}\n </span>\n }\n </div>\n }\n @if(hasUserDetails){\n <button\n id=\"mnl-initials-button\"\n (click)=\"onUserInitialClick($event)\"\n mat-mini-fab\n >\n {{ userProfileDetails | mnlUserInitialPipe }}\n </button>\n }\n \n @if(!hasUserDetails){\n <button\n id=\"mnl-user-icon-button\"\n mat-raised-button\n (click)=\"onUserInitialClick($event)\"\n >\n <mat-icon mat-icon-button>person</mat-icon>\n </button>\n }\n </div>", styles: ["#mnl-initials-button{border-radius:20px}:host ::ng-deep .mat-mdc-mini-fab{background-color:#fff!important;color:#000!important}#mnl-userinfo-role{font-size:1rem}\n"] }]
|
|
629
624
|
}], propDecorators: { userProfileDetails: [{
|
|
@@ -636,18 +631,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
636
631
|
type: Output
|
|
637
632
|
}] } });
|
|
638
633
|
|
|
639
|
-
const MNL_TRANSLATION_RESOURCE = new InjectionToken('Translation Resource');
|
|
640
|
-
function httpLoaderFactory(http, resources) {
|
|
641
|
-
if (!resources) {
|
|
642
|
-
resources = [];
|
|
643
|
-
}
|
|
644
|
-
else if (!resources.length) {
|
|
645
|
-
resources = [resources];
|
|
646
|
-
}
|
|
647
|
-
resources.push({ prefix: './assets/mnl-commons/i18n/', suffix: '.json' });
|
|
648
|
-
return new MultiTranslateHttpLoader(http, resources);
|
|
649
|
-
}
|
|
650
|
-
|
|
651
634
|
class AppConfigPipe {
|
|
652
635
|
constructor(config) {
|
|
653
636
|
this.config = config;
|
|
@@ -655,10 +638,10 @@ class AppConfigPipe {
|
|
|
655
638
|
transform(value, defaultValue) {
|
|
656
639
|
return this.config.get(value) || defaultValue || '';
|
|
657
640
|
}
|
|
658
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
659
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
641
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: AppConfigPipe, deps: [{ token: AppConfigService }], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
642
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.17", ngImport: i0, type: AppConfigPipe, isStandalone: true, name: "mnlAppConfig" }); }
|
|
660
643
|
}
|
|
661
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
644
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: AppConfigPipe, decorators: [{
|
|
662
645
|
type: Pipe,
|
|
663
646
|
args: [{
|
|
664
647
|
name: 'mnlAppConfig',
|
|
@@ -692,10 +675,10 @@ class TimeAgoPipe {
|
|
|
692
675
|
}
|
|
693
676
|
return '';
|
|
694
677
|
}
|
|
695
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
696
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
678
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TimeAgoPipe, deps: [{ token: AppConfigService }, { token: UserProfileService }], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
679
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.17", ngImport: i0, type: TimeAgoPipe, isStandalone: true, name: "mnlTimeAgo" }); }
|
|
697
680
|
}
|
|
698
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
681
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TimeAgoPipe, decorators: [{
|
|
699
682
|
type: Pipe,
|
|
700
683
|
args: [{
|
|
701
684
|
name: 'mnlTimeAgo',
|
|
@@ -794,10 +777,10 @@ class LogService {
|
|
|
794
777
|
messageBus(message, logLevel) {
|
|
795
778
|
this.onMessage.next({ text: message, type: logLevel });
|
|
796
779
|
}
|
|
797
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
798
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
780
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: LogService, deps: [{ token: AppConfigService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
781
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: LogService, providedIn: 'root' }); }
|
|
799
782
|
}
|
|
800
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
783
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: LogService, decorators: [{
|
|
801
784
|
type: Injectable,
|
|
802
785
|
args: [{
|
|
803
786
|
providedIn: 'root'
|
|
@@ -805,10 +788,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
805
788
|
}], ctorParameters: () => [{ type: AppConfigService }] });
|
|
806
789
|
|
|
807
790
|
class PlaceholderComponent {
|
|
808
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
809
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
791
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: PlaceholderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
792
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: PlaceholderComponent, isStandalone: true, selector: "mnl-placeholder", inputs: { icon: "icon", message: "message" }, ngImport: i0, template: "@if(icon){\n <div class=\"container\">\n <mat-icon>{{ icon }}</mat-icon>\n <h4>{{ message|translate }}</h4>\n </div>\n}", styles: [":host{height:100%}mat-icon{font-size:45px;height:45px;width:45px;opacity:.75}.container{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;inset:0;margin:auto}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] }); }
|
|
810
793
|
}
|
|
811
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
794
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: PlaceholderComponent, decorators: [{
|
|
812
795
|
type: Component,
|
|
813
796
|
args: [{ selector: 'mnl-placeholder', standalone: true, imports: [MatIconModule, TranslateModule], template: "@if(icon){\n <div class=\"container\">\n <mat-icon>{{ icon }}</mat-icon>\n <h4>{{ message|translate }}</h4>\n </div>\n}", styles: [":host{height:100%}mat-icon{font-size:45px;height:45px;width:45px;opacity:.75}.container{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;inset:0;margin:auto}\n"] }]
|
|
814
797
|
}], propDecorators: { icon: [{
|
|
@@ -845,8 +828,8 @@ class CommonsModule {
|
|
|
845
828
|
ngModule: CommonsModule,
|
|
846
829
|
};
|
|
847
830
|
}
|
|
848
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
849
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
831
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: CommonsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
832
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.17", ngImport: i0, type: CommonsModule, imports: [CommonModule,
|
|
850
833
|
MaterialModule,
|
|
851
834
|
PlaceholderComponent,
|
|
852
835
|
HeaderComponent,
|
|
@@ -859,7 +842,8 @@ class CommonsModule {
|
|
|
859
842
|
MenuComponent,
|
|
860
843
|
AppConfigPipe,
|
|
861
844
|
TimeAgoPipe,
|
|
862
|
-
MatToolbarModule,
|
|
845
|
+
MatToolbarModule,
|
|
846
|
+
TranslateModule], exports: [HeaderComponent,
|
|
863
847
|
MenuComponent,
|
|
864
848
|
HighlighterComponent,
|
|
865
849
|
AppConfigPipe,
|
|
@@ -871,7 +855,7 @@ class CommonsModule {
|
|
|
871
855
|
UserFullnamePipe,
|
|
872
856
|
TranslateModule,
|
|
873
857
|
PlaceholderComponent] }); }
|
|
874
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
858
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: CommonsModule, imports: [CommonModule,
|
|
875
859
|
MaterialModule,
|
|
876
860
|
PlaceholderComponent,
|
|
877
861
|
HeaderComponent,
|
|
@@ -881,15 +865,9 @@ class CommonsModule {
|
|
|
881
865
|
LanguageMenuComponent,
|
|
882
866
|
MenuComponent,
|
|
883
867
|
MatToolbarModule,
|
|
884
|
-
TranslateModule
|
|
885
|
-
loader: {
|
|
886
|
-
provide: TranslateLoader,
|
|
887
|
-
useFactory: httpLoaderFactory,
|
|
888
|
-
deps: [HttpBackend, MNL_TRANSLATION_RESOURCE],
|
|
889
|
-
},
|
|
890
|
-
}), TranslateModule] }); }
|
|
868
|
+
TranslateModule, TranslateModule] }); }
|
|
891
869
|
}
|
|
892
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
870
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: CommonsModule, decorators: [{
|
|
893
871
|
type: NgModule,
|
|
894
872
|
args: [{
|
|
895
873
|
declarations: [],
|
|
@@ -908,13 +886,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImpo
|
|
|
908
886
|
AppConfigPipe,
|
|
909
887
|
TimeAgoPipe,
|
|
910
888
|
MatToolbarModule,
|
|
911
|
-
TranslateModule
|
|
912
|
-
loader: {
|
|
913
|
-
provide: TranslateLoader,
|
|
914
|
-
useFactory: httpLoaderFactory,
|
|
915
|
-
deps: [HttpBackend, MNL_TRANSLATION_RESOURCE],
|
|
916
|
-
},
|
|
917
|
-
}),
|
|
889
|
+
TranslateModule,
|
|
918
890
|
],
|
|
919
891
|
exports: [
|
|
920
892
|
HeaderComponent,
|
|
@@ -937,6 +909,18 @@ function loadConfig(config) {
|
|
|
937
909
|
return conf;
|
|
938
910
|
}
|
|
939
911
|
|
|
912
|
+
const MNL_TRANSLATION_RESOURCE = new InjectionToken('Translation Resource');
|
|
913
|
+
function httpLoaderFactory(http, resources) {
|
|
914
|
+
if (!resources) {
|
|
915
|
+
resources = [];
|
|
916
|
+
}
|
|
917
|
+
else if (!resources.length) {
|
|
918
|
+
resources = [resources];
|
|
919
|
+
}
|
|
920
|
+
resources.push({ prefix: './assets/mnl-commons/i18n/', suffix: '.json' });
|
|
921
|
+
return new MultiTranslateHttpLoader(http, resources);
|
|
922
|
+
}
|
|
923
|
+
|
|
940
924
|
/*
|
|
941
925
|
* Public API Surface of mnl-commons
|
|
942
926
|
*/
|