@mediusinc/mng-commons-layout 5.0.0-rc.1 → 5.0.0-rc.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/components/breadcrumb.component.mjs +10 -8
- package/esm2022/lib/components/footer.component.mjs +5 -5
- package/esm2022/lib/components/main-layout.component.mjs +4 -4
- package/esm2022/lib/components/menu-item.component.mjs +3 -3
- package/esm2022/lib/components/menu.component.mjs +3 -3
- package/esm2022/lib/components/sidebar.component.mjs +5 -5
- package/esm2022/lib/components/topbar-user.component.mjs +8 -13
- package/esm2022/lib/components/topbar.component.mjs +11 -11
- package/esm2022/lib/components/version.component.mjs +3 -3
- package/esm2022/lib/helpers/route-builder.mjs +10 -9
- package/esm2022/lib/services/main-layout.component.service.mjs +3 -3
- package/esm2022/lib/services/menu.service.mjs +10 -6
- package/esm2022/lib/services/version.service.mjs +3 -3
- package/fesm2022/mediusinc-mng-commons-layout.mjs +69 -66
- package/fesm2022/mediusinc-mng-commons-layout.mjs.map +1 -1
- package/lib/components/breadcrumb.component.d.ts +2 -3
- package/lib/components/topbar-user.component.d.ts +3 -6
- package/lib/components/topbar.component.d.ts +3 -3
- package/lib/helpers/route-builder.d.ts +7 -5
- package/lib/services/menu.service.d.ts +1 -0
- package/package.json +2 -2
- package/version-info.json +11 -0
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
import { AsyncPipe, NgOptimizedImage, NgClass, NgTemplateOutlet } from '@angular/common';
|
|
2
2
|
import * as i0 from '@angular/core';
|
|
3
|
-
import { InjectionToken, inject, Injectable, Component, ChangeDetectionStrategy, Input,
|
|
3
|
+
import { InjectionToken, inject, Injectable, Component, ChangeDetectionStrategy, Input, computed, signal, DestroyRef, Injector, EventEmitter, effect, runInInjectionContext, HostBinding, Output, ViewChild, ElementRef, Renderer2 } from '@angular/core';
|
|
4
4
|
import * as i1$1 from '@ngx-translate/core';
|
|
5
5
|
import { TranslateModule } from '@ngx-translate/core';
|
|
6
6
|
import * as i2 from '@mediusinc/mng-commons/core';
|
|
7
|
-
import { LoggerService, JsonPathPipe, CommonsService, ComponentDirective, CommonsRouterService, adjustRouteMenuLazyChildrenRouterLinks, doesUrlMatchRouterLink, PermissionService, EnumerateAsyncPipe, COMMONS_MODULE_CONFIG_IT, NotificationWrapperComponent,
|
|
7
|
+
import { LoggerService, JsonPathPipe, CommonsService, ComponentDirective, CommonsRouterService, adjustRouteMenuLazyChildrenRouterLinks, doesUrlMatchRouterLink, PermissionService, EnumerateAsyncPipe, COMMONS_MODULE_CONFIG_IT, NotificationWrapperComponent, createRoute, CommonsFeatureTypeEnum } from '@mediusinc/mng-commons/core';
|
|
8
8
|
import { ReplaySubject, BehaviorSubject, take, Subject, Observable, from, of, combineLatest, distinctUntilChanged } from 'rxjs';
|
|
9
9
|
import * as i1 from '@angular/common/http';
|
|
10
10
|
import { ButtonModule } from 'primeng/button';
|
|
11
11
|
import { InputTextModule } from 'primeng/inputtext';
|
|
12
|
-
import { map, filter, first } from 'rxjs/operators';
|
|
13
12
|
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
14
13
|
import * as i1$3 from '@angular/router';
|
|
15
14
|
import { Router, NavigationEnd, ActivatedRoute, GuardsCheckEnd, RouterModule } from '@angular/router';
|
|
15
|
+
import { filter, first, map } from 'rxjs/operators';
|
|
16
16
|
import * as i2$1 from '@angular/forms';
|
|
17
17
|
import { FormsModule } from '@angular/forms';
|
|
18
18
|
import * as i1$4 from 'primeng/dropdown';
|
|
@@ -58,10 +58,10 @@ class VersionService {
|
|
|
58
58
|
}
|
|
59
59
|
return this.cache[url].asObservable();
|
|
60
60
|
}
|
|
61
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
62
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.
|
|
61
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: VersionService, deps: [{ token: i1.HttpClient }, { token: i2.CommonsConfigurationService }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
62
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: VersionService }); }
|
|
63
63
|
}
|
|
64
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
64
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: VersionService, decorators: [{
|
|
65
65
|
type: Injectable
|
|
66
66
|
}], ctorParameters: () => [{ type: i1.HttpClient }, { type: i2.CommonsConfigurationService }] });
|
|
67
67
|
|
|
@@ -109,10 +109,10 @@ class VersionComponent {
|
|
|
109
109
|
}
|
|
110
110
|
}
|
|
111
111
|
}
|
|
112
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
113
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
112
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: VersionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
113
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: VersionComponent, isStandalone: true, selector: "mng-version", inputs: { initVersion: ["version", "initVersion"] }, ngImport: i0, template: "@if (versions) {\n @for (v of versions; track v; let last = $last) {\n <mng-version [version]=\"v\"></mng-version>\n @if (!last) {\n <br />\n }\n }\n} @else {\n @if (displayName) {\n {{ displayName }}:\n }\n @if ((loading$ | async) === false) {\n {{ displayVersion }}\n }\n}\n", dependencies: [{ kind: "component", type: VersionComponent, selector: "mng-version", inputs: ["version"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
114
114
|
}
|
|
115
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
115
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: VersionComponent, decorators: [{
|
|
116
116
|
type: Component,
|
|
117
117
|
args: [{ standalone: true, selector: 'mng-version', imports: [AsyncPipe], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (versions) {\n @for (v of versions; track v; let last = $last) {\n <mng-version [version]=\"v\"></mng-version>\n @if (!last) {\n <br />\n }\n }\n} @else {\n @if (displayName) {\n {{ displayName }}:\n }\n @if ((loading$ | async) === false) {\n {{ displayVersion }}\n }\n}\n" }]
|
|
118
118
|
}], propDecorators: { initVersion: [{
|
|
@@ -132,18 +132,21 @@ class FooterComponent {
|
|
|
132
132
|
this.versionComponent = this.config?.components?.version;
|
|
133
133
|
}
|
|
134
134
|
}
|
|
135
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
136
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
135
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
136
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: FooterComponent, isStandalone: true, selector: "mng-footer", ngImport: i0, template: "<div class=\"layout-footer\">\n <div class=\"footer-logo-container\">\n <img id=\"footer-logo\" [src]=\"commons.appLogo()\" alt=\"atlantis-layout\" />\n <span class=\"app-name\">{{ commons.appName() | translate }}</span>\n </div>\n <div class=\"flex flex-column\">\n <div>\n <span class=\"copyright\">© {{ commons.appOwner() | translate }} - {{ currentYear }}</span>\n </div>\n @if (versionComponent) {\n <div class=\"version\" [mngComponent]=\"versionComponent\" [inputs]=\"{version: commons.appVersion()}\" [attachToHost]=\"true\"></div>\n }\n </div>\n</div>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "directive", type: ComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "injectionToken", "inputs", "attachToHost", "parentInjector"], outputs: ["instanceCreated"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
137
137
|
}
|
|
138
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
138
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: FooterComponent, decorators: [{
|
|
139
139
|
type: Component,
|
|
140
|
-
args: [{ standalone: true, selector: 'mng-footer', imports: [TranslateModule, NgOptimizedImage, VersionComponent, ComponentDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-footer\">\n <div class=\"footer-logo-container\">\n <img id=\"footer-logo\" [src]=\"commons.
|
|
140
|
+
args: [{ standalone: true, selector: 'mng-footer', imports: [TranslateModule, NgOptimizedImage, VersionComponent, ComponentDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-footer\">\n <div class=\"footer-logo-container\">\n <img id=\"footer-logo\" [src]=\"commons.appLogo()\" alt=\"atlantis-layout\" />\n <span class=\"app-name\">{{ commons.appName() | translate }}</span>\n </div>\n <div class=\"flex flex-column\">\n <div>\n <span class=\"copyright\">© {{ commons.appOwner() | translate }} - {{ currentYear }}</span>\n </div>\n @if (versionComponent) {\n <div class=\"version\" [mngComponent]=\"versionComponent\" [inputs]=\"{version: commons.appVersion()}\" [attachToHost]=\"true\"></div>\n }\n </div>\n</div>\n" }]
|
|
141
141
|
}] });
|
|
142
142
|
|
|
143
143
|
class BreadcrumbComponent {
|
|
144
144
|
constructor() {
|
|
145
145
|
this.commons = inject(CommonsService);
|
|
146
|
-
this.mappedBreadcrumbs
|
|
146
|
+
this.mappedBreadcrumbs = computed(() => {
|
|
147
|
+
const items = this.commons.breadcrumbs();
|
|
148
|
+
return items.map(el => this.mapMenuItem(el));
|
|
149
|
+
});
|
|
147
150
|
}
|
|
148
151
|
mapMenuItem(item) {
|
|
149
152
|
return {
|
|
@@ -153,12 +156,12 @@ class BreadcrumbComponent {
|
|
|
153
156
|
styleClass: item.className
|
|
154
157
|
};
|
|
155
158
|
}
|
|
156
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
157
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
159
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: BreadcrumbComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
160
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: BreadcrumbComponent, isStandalone: true, selector: "mng-breadcrumb", ngImport: i0, template: "<div class=\"layout-breadcrumb flex align-items-center relative h-3rem\">\n <nav>\n <ol class=\"relative z-2\">\n @for (item of mappedBreadcrumbs(); track item; let last = $last) {\n <li>{{ item.label! | translate }}</li>\n @if (!last) {\n <li class=\"layout-breadcrumb-chevron\">/</li>\n }\n }\n </ol>\n </nav>\n</div>\n", dependencies: [{ kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
158
161
|
}
|
|
159
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
162
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: BreadcrumbComponent, decorators: [{
|
|
160
163
|
type: Component,
|
|
161
|
-
args: [{ standalone: true, selector: 'mng-breadcrumb', imports: [NgClass, InputTextModule, ButtonModule, AsyncPipe, TranslateModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-breadcrumb flex align-items-center relative h-3rem\">\n <nav>\n <ol class=\"relative z-2\">\n @for (item of mappedBreadcrumbs
|
|
164
|
+
args: [{ standalone: true, selector: 'mng-breadcrumb', imports: [NgClass, InputTextModule, ButtonModule, AsyncPipe, TranslateModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-breadcrumb flex align-items-center relative h-3rem\">\n <nav>\n <ol class=\"relative z-2\">\n @for (item of mappedBreadcrumbs(); track item; let last = $last) {\n <li>{{ item.label! | translate }}</li>\n @if (!last) {\n <li class=\"layout-breadcrumb-chevron\">/</li>\n }\n }\n </ol>\n </nav>\n</div>\n" }]
|
|
162
165
|
}] });
|
|
163
166
|
|
|
164
167
|
class MainLayoutComponentService {
|
|
@@ -221,15 +224,16 @@ class MainLayoutComponentService {
|
|
|
221
224
|
isMobile() {
|
|
222
225
|
return !this.isDesktop();
|
|
223
226
|
}
|
|
224
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
225
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.
|
|
227
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: MainLayoutComponentService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
228
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: MainLayoutComponentService }); }
|
|
226
229
|
}
|
|
227
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
230
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: MainLayoutComponentService, decorators: [{
|
|
228
231
|
type: Injectable
|
|
229
232
|
}] });
|
|
230
233
|
|
|
231
234
|
class MenuService {
|
|
232
235
|
constructor() {
|
|
236
|
+
this.destroyRef = inject(DestroyRef);
|
|
233
237
|
this.logger = LoggerService.create('MenuService');
|
|
234
238
|
this.router = inject(Router);
|
|
235
239
|
this.commonsRouter = inject(CommonsRouterService);
|
|
@@ -245,7 +249,9 @@ class MenuService {
|
|
|
245
249
|
this.routeLoadedChildrenSubscriptions.forEach(s => s.unsubscribe());
|
|
246
250
|
this.routeLoadedChildrenSubscriptions = [];
|
|
247
251
|
this.generateMenuItemKeys(menuItems);
|
|
248
|
-
this.router.events
|
|
252
|
+
this.router.events
|
|
253
|
+
.pipe(filter(event => event instanceof NavigationEnd), takeUntilDestroyed(this.destroyRef))
|
|
254
|
+
.subscribe(e => {
|
|
249
255
|
this.findAndSetActiveMenuItem(e.urlAfterRedirects);
|
|
250
256
|
});
|
|
251
257
|
this.findAndSetActiveMenuItem(this.router.url);
|
|
@@ -335,10 +341,10 @@ class MenuService {
|
|
|
335
341
|
reset() {
|
|
336
342
|
this.resetSource.next(true);
|
|
337
343
|
}
|
|
338
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
339
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.
|
|
344
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: MenuService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
345
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: MenuService }); }
|
|
340
346
|
}
|
|
341
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
347
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: MenuService, decorators: [{
|
|
342
348
|
type: Injectable
|
|
343
349
|
}] });
|
|
344
350
|
|
|
@@ -543,8 +549,8 @@ class MenuItemComponent {
|
|
|
543
549
|
});
|
|
544
550
|
}
|
|
545
551
|
}
|
|
546
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
547
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
552
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: MenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
553
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: MenuItemComponent, isStandalone: true, selector: "[mng-menuitem]", inputs: { item: "item", root: "root" }, outputs: { visibleChangeEventEmitter: "visibleChange" }, host: { properties: { "class.layout-root-menuitem": "this.root", "class.active-menuitem": "this.activeClass" } }, viewQueries: [{ propertyName: "submenu", first: true, predicate: ["submenu"], descendants: true }], ngImport: i0, template: "@if (visible()) {\n @if (root) {\n <div class=\"layout-menuitem-root-text\">\n {{ item.label! | translate }}\n </div>\n }\n @if (!item.href) {\n @if (!item.routerLink || item.items) {\n <a\n [attr.href]=\"item.href\"\n (click)=\"itemClick($event)\"\n (keydown.enter)=\"itemClick($event)\"\n [routerLink]=\"item.routerLink\"\n [attr.target]=\"item.target\"\n [attr.tabindex]=\"0\"\n [ngClass]=\"item.className ?? ''\"\n pRipple>\n <i [ngClass]=\"item.icon ?? ''\" class=\"layout-menuitem-icon\"></i>\n <span class=\"layout-menuitem-text\">{{ item.label! | translate }}</span>\n @if (item.items || item.lazyChildren) {\n <i class=\"pi pi-fw pi-angle-down layout-submenu-toggler\"></i>\n }\n @if (item.badge) {\n <span class=\"menuitem-badge\">{{ item.badge }}</span>\n }\n </a>\n } @else if (item.routerLink && !item.items) {\n <a\n (click)=\"itemClick($event)\"\n [routerLink]=\"item.routerLink\"\n [attr.target]=\"item.target\"\n [attr.tabindex]=\"0\"\n [ngClass]=\"item.className ?? '' + (this.active() ? ' active-route' : '')\"\n [preserveFragment]=\"item.preserveFragment\"\n [skipLocationChange]=\"item.skipLocationChange\"\n [replaceUrl]=\"item.replaceUrl\"\n [queryParams]=\"item.queryParams\"\n pRipple>\n <i [ngClass]=\"item.icon ?? ''\" class=\"layout-menuitem-icon\"></i>\n <span class=\"layout-menuitem-text\">{{ item.label! | translate }}</span>\n @if (item.items || item.lazyChildren) {\n <i class=\"pi pi-fw pi-angle-down layout-submenu-toggler\"></i>\n }\n @if (item.badge) {\n <span class=\"menuitem-badge\">{{ item.badge }}</span>\n }\n </a>\n }\n } @else {\n @if (!item.items) {\n <a (click)=\"itemClick($event)\" [attr.href]=\"item.href\" [attr.target]=\"item.target\" [attr.tabindex]=\"0\" [ngClass]=\"item.className ?? ''\" pRipple>\n <i [ngClass]=\"item.icon ?? ''\" class=\"layout-menuitem-icon\"></i>\n <span class=\"layout-menuitem-text\">{{ item.label! | translate }}</span>\n @if (item.items || item.lazyChildren) {\n <i class=\"pi pi-fw pi-angle-down layout-submenu-toggler\"></i>\n }\n @if (item.badge) {\n <span class=\"menuitem-badge\">{{ item.badge }}</span>\n }\n </a>\n }\n }\n @if (item.items) {\n <ul #submenu [@children]=\"submenuAnimation\" (@children.done)=\"onSubmenuAnimated($event)\">\n @for (child of item.items; track child; let i = $index) {\n <li mng-menuitem [item]=\"child\" [class]=\"child.badgeClassName\" (visibleChange)=\"onChildVisibleChange($event, item, i)\"></li>\n }\n </ul>\n }\n}\n", dependencies: [{ kind: "component", type: MenuItemComponent, selector: "[mng-menuitem]", inputs: ["item", "root"], outputs: ["visibleChange"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i1$2.Ripple, selector: "[pRipple]" }, { kind: "ngmodule", type: TooltipModule }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], animations: [
|
|
548
554
|
trigger('children', [
|
|
549
555
|
state('collapsed', style({
|
|
550
556
|
height: '0'
|
|
@@ -562,7 +568,7 @@ class MenuItemComponent {
|
|
|
562
568
|
])
|
|
563
569
|
], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
564
570
|
}
|
|
565
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
571
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: MenuItemComponent, decorators: [{
|
|
566
572
|
type: Component,
|
|
567
573
|
args: [{ standalone: true, selector: '[mng-menuitem]', imports: [NgClass, RippleModule, TooltipModule, RouterModule, TranslateModule, AsyncPipe], changeDetection: ChangeDetectionStrategy.OnPush, animations: [
|
|
568
574
|
trigger('children', [
|
|
@@ -625,10 +631,10 @@ class MenuComponent {
|
|
|
625
631
|
return [{ items: menuItems }];
|
|
626
632
|
}
|
|
627
633
|
}
|
|
628
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
629
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
634
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: MenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
635
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: MenuComponent, isStandalone: true, selector: "mng-menu", ngImport: i0, template: "<ul class=\"layout-menu\">\n @for (item of menuItems; track item) {\n @if (!item.separator) {\n <li mng-menuitem [item]=\"item\" [root]=\"true\"></li>\n }\n @if (item.separator) {\n <li class=\"menu-separator\"></li>\n }\n }\n</ul>\n", dependencies: [{ kind: "component", type: MenuItemComponent, selector: "[mng-menuitem]", inputs: ["item", "root"], outputs: ["visibleChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
630
636
|
}
|
|
631
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
637
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: MenuComponent, decorators: [{
|
|
632
638
|
type: Component,
|
|
633
639
|
args: [{ standalone: true, selector: 'mng-menu', imports: [MenuItemComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ul class=\"layout-menu\">\n @for (item of menuItems; track item) {\n @if (!item.separator) {\n <li mng-menuitem [item]=\"item\" [root]=\"true\"></li>\n }\n @if (item.separator) {\n <li class=\"menu-separator\"></li>\n }\n }\n</ul>\n" }]
|
|
634
640
|
}] });
|
|
@@ -675,12 +681,12 @@ class SidebarComponent {
|
|
|
675
681
|
anchored: !state.anchored
|
|
676
682
|
}));
|
|
677
683
|
}
|
|
678
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
679
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
684
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SidebarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
685
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: SidebarComponent, isStandalone: true, selector: "mng-sidebar", viewQueries: [{ propertyName: "menuContainer", first: true, predicate: ["menuContainer"], descendants: true }], ngImport: i0, template: "<div class=\"layout-sidebar\" (mouseenter)=\"onMouseEnter()\" (mouseleave)=\"onMouseLeave()\">\n <div class=\"sidebar-header\">\n <a [routerLink]=\"['/']\" class=\"app-logo\">\n <div class=\"app-logo-small h-2rem\">\n <img [src]=\"commons.appLogo()\" [alt]=\"'App logo'\" />\n </div>\n <div class=\"app-logo-normal\">\n <img class=\"h-2rem\" [src]=\"commons.appLogo()\" [alt]=\"'App logo'\" />\n <img class=\"h-2rem ml-3\" [src]=\"commons.appLogoName()\" [alt]=\"'App name'\" />\n </div>\n </a>\n <button class=\"layout-sidebar-anchor p-link z-2\" type=\"button\" (click)=\"anchor()\"></button>\n </div>\n\n @if (menuComponent) {\n <div #menuContainer class=\"layout-menu-container\">\n <div [mngComponent]=\"menuComponent\" [attachToHost]=\"true\"></div>\n </div>\n }\n</div>\n", dependencies: [{ kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: ComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "injectionToken", "inputs", "attachToHost", "parentInjector"], outputs: ["instanceCreated"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
680
686
|
}
|
|
681
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
687
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: SidebarComponent, decorators: [{
|
|
682
688
|
type: Component,
|
|
683
|
-
args: [{ standalone: true, selector: 'mng-sidebar', imports: [RouterModule, MenuComponent, ComponentDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-sidebar\" (mouseenter)=\"onMouseEnter()\" (mouseleave)=\"onMouseLeave()\">\n <div class=\"sidebar-header\">\n <a [routerLink]=\"['/']\" class=\"app-logo\">\n <div class=\"app-logo-small h-2rem\">\n <img [src]=\"commons.
|
|
689
|
+
args: [{ standalone: true, selector: 'mng-sidebar', imports: [RouterModule, MenuComponent, ComponentDirective], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-sidebar\" (mouseenter)=\"onMouseEnter()\" (mouseleave)=\"onMouseLeave()\">\n <div class=\"sidebar-header\">\n <a [routerLink]=\"['/']\" class=\"app-logo\">\n <div class=\"app-logo-small h-2rem\">\n <img [src]=\"commons.appLogo()\" [alt]=\"'App logo'\" />\n </div>\n <div class=\"app-logo-normal\">\n <img class=\"h-2rem\" [src]=\"commons.appLogo()\" [alt]=\"'App logo'\" />\n <img class=\"h-2rem ml-3\" [src]=\"commons.appLogoName()\" [alt]=\"'App name'\" />\n </div>\n </a>\n <button class=\"layout-sidebar-anchor p-link z-2\" type=\"button\" (click)=\"anchor()\"></button>\n </div>\n\n @if (menuComponent) {\n <div #menuContainer class=\"layout-menu-container\">\n <div [mngComponent]=\"menuComponent\" [attachToHost]=\"true\"></div>\n </div>\n }\n</div>\n" }]
|
|
684
690
|
}], propDecorators: { menuContainer: [{
|
|
685
691
|
type: ViewChild,
|
|
686
692
|
args: ['menuContainer']
|
|
@@ -690,14 +696,10 @@ class TopbarUserComponent {
|
|
|
690
696
|
constructor() {
|
|
691
697
|
this.destroyRef = inject(DestroyRef);
|
|
692
698
|
this.commons = inject(CommonsService);
|
|
699
|
+
this.user = computed(() => this.commons.user());
|
|
700
|
+
this.userRoles = computed(() => this.commons.userRoles());
|
|
693
701
|
this.hrefJsVoid = inject(DomSanitizer).bypassSecurityTrustUrl('javascript:void(0)');
|
|
694
702
|
}
|
|
695
|
-
ngOnInit() {
|
|
696
|
-
this.commons.user$.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(u => {
|
|
697
|
-
this.user = u;
|
|
698
|
-
});
|
|
699
|
-
this.userRoles$ = this.commons.userRoles$;
|
|
700
|
-
}
|
|
701
703
|
logout(user, event) {
|
|
702
704
|
if (typeof user?.logout === 'function') {
|
|
703
705
|
event.preventDefault();
|
|
@@ -705,12 +707,12 @@ class TopbarUserComponent {
|
|
|
705
707
|
user.logout();
|
|
706
708
|
}
|
|
707
709
|
}
|
|
708
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
709
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
710
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: TopbarUserComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
711
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: TopbarUserComponent, isStandalone: true, selector: "mng-topbar-user-component", ngImport: i0, template: "<a\n class=\"cursor-pointer lg:pr-4\"\n pStyleClass=\"@next\"\n enterFromClass=\"ng-hidden\"\n enterActiveClass=\"px-scalein\"\n leaveToClass=\"ng-hidden\"\n leaveActiveClass=\"px-fadeout\"\n [hideOnOutsideClick]=\"true\"\n pRipple>\n <i class=\"pi pi-fw pi-user text-2xl\"></i>\n <span class=\"hidden sm:inline-block\"> {{ user()?.displayName ?? user()?.username }}</span>\n</a>\n<ul class=\"topbar-menu active-topbar-menu w-15rem z-5 ng-hidden border-round\">\n <li role=\"menuitem\">\n <a\n class=\"flex align-items-center transition-duration-200\"\n pStyleClass=\"@grandparent\"\n enterFromClass=\"ng-hidden\"\n enterActiveClass=\"px-scalein\"\n leaveToClass=\"ng-hidden\"\n leaveActiveClass=\"px-fadeout\">\n <i class=\"pi pi-fw pi-user text-base mr-2\"></i>\n <div>\n <strong>{{ user()?.displayName ?? user()?.username }}</strong>\n @if (userRoles().length > 0) {\n <small>\n <br />\n {{ userRoles() }}\n </small>\n }\n </div>\n </a>\n </li>\n @if (user()?.logout || user()?.logoutUrl) {\n <li role=\"menuitem\">\n <a\n [href]=\"user()?.logoutUrl ?? hrefJsVoid\"\n (click)=\"logout(user(), $event)\"\n class=\"flex align-items-center hover:text-primary-500 transition-duration-200\"\n pStyleClass=\"@grandparent\"\n enterFromClass=\"ng-hidden\"\n enterActiveClass=\"px-scalein\"\n leaveToClass=\"ng-hidden\"\n leaveActiveClass=\"px-fadeout\">\n <i class=\"pi pi-fw pi-sign-out text-base mr-2\"></i>\n <span>{{ 'mngTopbar.logout' | translate }}</span>\n </a>\n </li>\n }\n</ul>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i1$2.Ripple, selector: "[pRipple]" }, { kind: "ngmodule", type: StyleClassModule }, { kind: "directive", type: i3.StyleClass, selector: "[pStyleClass]", inputs: ["pStyleClass", "enterClass", "enterFromClass", "enterActiveClass", "enterToClass", "leaveClass", "leaveFromClass", "leaveActiveClass", "leaveToClass", "hideOnOutsideClick", "toggleClass", "hideOnEscape"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
710
712
|
}
|
|
711
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
713
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: TopbarUserComponent, decorators: [{
|
|
712
714
|
type: Component,
|
|
713
|
-
args: [{ standalone: true, selector: 'mng-topbar-user-component', imports: [AsyncPipe, EnumerateAsyncPipe, TranslateModule, RippleModule, StyleClassModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<a\n class=\"cursor-pointer lg:pr-4\"\n pStyleClass=\"@next\"\n enterFromClass=\"ng-hidden\"\n enterActiveClass=\"px-scalein\"\n leaveToClass=\"ng-hidden\"\n leaveActiveClass=\"px-fadeout\"\n [hideOnOutsideClick]=\"true\"\n pRipple>\n <i class=\"pi pi-fw pi-user text-2xl\"></i>\n <span class=\"hidden sm:inline-block\"> {{ user?.displayName ?? user?.username }}</span>\n</a>\n<ul class=\"topbar-menu active-topbar-menu w-15rem z-5 ng-hidden border-round\">\n <li role=\"menuitem\">\n <a\n class=\"flex align-items-center transition-duration-200\"\n pStyleClass=\"@grandparent\"\n enterFromClass=\"ng-hidden\"\n enterActiveClass=\"px-scalein\"\n leaveToClass=\"ng-hidden\"\n leaveActiveClass=\"px-fadeout\">\n <i class=\"pi pi-fw pi-user text-base mr-2\"></i>\n <div>\n <strong>{{ user?.displayName ?? user?.username }}</strong>\n @if ((
|
|
715
|
+
args: [{ standalone: true, selector: 'mng-topbar-user-component', imports: [AsyncPipe, EnumerateAsyncPipe, TranslateModule, RippleModule, StyleClassModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<a\n class=\"cursor-pointer lg:pr-4\"\n pStyleClass=\"@next\"\n enterFromClass=\"ng-hidden\"\n enterActiveClass=\"px-scalein\"\n leaveToClass=\"ng-hidden\"\n leaveActiveClass=\"px-fadeout\"\n [hideOnOutsideClick]=\"true\"\n pRipple>\n <i class=\"pi pi-fw pi-user text-2xl\"></i>\n <span class=\"hidden sm:inline-block\"> {{ user()?.displayName ?? user()?.username }}</span>\n</a>\n<ul class=\"topbar-menu active-topbar-menu w-15rem z-5 ng-hidden border-round\">\n <li role=\"menuitem\">\n <a\n class=\"flex align-items-center transition-duration-200\"\n pStyleClass=\"@grandparent\"\n enterFromClass=\"ng-hidden\"\n enterActiveClass=\"px-scalein\"\n leaveToClass=\"ng-hidden\"\n leaveActiveClass=\"px-fadeout\">\n <i class=\"pi pi-fw pi-user text-base mr-2\"></i>\n <div>\n <strong>{{ user()?.displayName ?? user()?.username }}</strong>\n @if (userRoles().length > 0) {\n <small>\n <br />\n {{ userRoles() }}\n </small>\n }\n </div>\n </a>\n </li>\n @if (user()?.logout || user()?.logoutUrl) {\n <li role=\"menuitem\">\n <a\n [href]=\"user()?.logoutUrl ?? hrefJsVoid\"\n (click)=\"logout(user(), $event)\"\n class=\"flex align-items-center hover:text-primary-500 transition-duration-200\"\n pStyleClass=\"@grandparent\"\n enterFromClass=\"ng-hidden\"\n enterActiveClass=\"px-scalein\"\n leaveToClass=\"ng-hidden\"\n leaveActiveClass=\"px-fadeout\">\n <i class=\"pi pi-fw pi-sign-out text-base mr-2\"></i>\n <span>{{ 'mngTopbar.logout' | translate }}</span>\n </a>\n </li>\n }\n</ul>\n" }]
|
|
714
716
|
}] });
|
|
715
717
|
|
|
716
718
|
class TopbarComponent {
|
|
@@ -721,8 +723,8 @@ class TopbarComponent {
|
|
|
721
723
|
this.config = inject(COMMONS_LAYOUT_FEATURE_CONFIG_IT, { optional: true });
|
|
722
724
|
this.breadcrumbComponent = BreadcrumbComponent;
|
|
723
725
|
this.topbarUserComponent = TopbarUserComponent;
|
|
724
|
-
this.
|
|
725
|
-
this.
|
|
726
|
+
this.locales = ['en'];
|
|
727
|
+
this.selectedLocale = 'en';
|
|
726
728
|
}
|
|
727
729
|
ngOnInit() {
|
|
728
730
|
if (this.config?.components?.topbarUser !== undefined) {
|
|
@@ -731,21 +733,21 @@ class TopbarComponent {
|
|
|
731
733
|
if (this.config?.components?.breadcrumb !== undefined) {
|
|
732
734
|
this.breadcrumbComponent = this.config.components.breadcrumb;
|
|
733
735
|
}
|
|
734
|
-
this.
|
|
735
|
-
this.
|
|
736
|
+
this.locales = this.commons.appLocales();
|
|
737
|
+
this.selectedLocale = this.commons.appLocale();
|
|
736
738
|
}
|
|
737
739
|
onMenuButtonClick() {
|
|
738
740
|
this.mainLayoutService.onMenuToggle();
|
|
739
741
|
}
|
|
740
|
-
|
|
741
|
-
this.commons.
|
|
742
|
+
switchLocale(language) {
|
|
743
|
+
this.commons.setAppLocale(language);
|
|
742
744
|
}
|
|
743
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
744
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
745
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: TopbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
746
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: TopbarComponent, isStandalone: true, selector: "mng-topbar", viewQueries: [{ propertyName: "menuButton", first: true, predicate: ["menubutton"], descendants: true }, { propertyName: "appSidebar", first: true, predicate: SidebarComponent, descendants: true }], ngImport: i0, template: "<div class=\"layout-topbar\">\n <div class=\"topbar-start\">\n <button #menubutton type=\"button\" class=\"topbar-menubutton p-link p-trigger\" (click)=\"onMenuButtonClick()\">\n <i class=\"pi pi-bars\"></i>\n </button>\n\n @if (breadcrumbComponent) {\n <div class=\"topbar-breadcrumb\">\n <div [mngComponent]=\"breadcrumbComponent\" [attachToHost]=\"true\"></div>\n </div>\n }\n </div>\n <div class=\"layout-topbar-menu-section\">\n <mng-sidebar></mng-sidebar>\n </div>\n <div class=\"topbar-end\">\n <ul class=\"topbar-menu\">\n @if (locales.length > 1) {\n <li class=\"profile-item\">\n <i class=\"pi pi-fw pi-globe\"></i>\n <p-dropdown [ngModel]=\"selectedLocale\" [options]=\"locales\" (onChange)=\"switchLocale($event.value)\"></p-dropdown>\n </li>\n }\n @if (topbarUserComponent) {\n <li #userMenuItem class=\"profile-item topbar-item mr-3\" [mngComponent]=\"topbarUserComponent\" [attachToHost]=\"true\"></li>\n }\n </ul>\n </div>\n</div>\n", dependencies: [{ kind: "component", type: SidebarComponent, selector: "mng-sidebar" }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: StyleClassModule }, { kind: "ngmodule", type: RippleModule }, { kind: "ngmodule", type: DropdownModule }, { kind: "component", type: i1$4.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: ComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "injectionToken", "inputs", "attachToHost", "parentInjector"], outputs: ["instanceCreated"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
745
747
|
}
|
|
746
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
748
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: TopbarComponent, decorators: [{
|
|
747
749
|
type: Component,
|
|
748
|
-
args: [{ standalone: true, selector: 'mng-topbar', imports: [SidebarComponent, NgClass, ButtonModule, StyleClassModule, RippleModule, BreadcrumbComponent, AsyncPipe, DropdownModule, ComponentDirective, FormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-topbar\">\n <div class=\"topbar-start\">\n <button #menubutton type=\"button\" class=\"topbar-menubutton p-link p-trigger\" (click)=\"onMenuButtonClick()\">\n <i class=\"pi pi-bars\"></i>\n </button>\n\n @if (breadcrumbComponent) {\n <div class=\"topbar-breadcrumb\">\n <div [mngComponent]=\"breadcrumbComponent\" [attachToHost]=\"true\"></div>\n </div>\n }\n </div>\n <div class=\"layout-topbar-menu-section\">\n <mng-sidebar></mng-sidebar>\n </div>\n <div class=\"topbar-end\">\n <ul class=\"topbar-menu\">\n @if (
|
|
750
|
+
args: [{ standalone: true, selector: 'mng-topbar', imports: [SidebarComponent, NgClass, ButtonModule, StyleClassModule, RippleModule, BreadcrumbComponent, AsyncPipe, DropdownModule, ComponentDirective, FormsModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"layout-topbar\">\n <div class=\"topbar-start\">\n <button #menubutton type=\"button\" class=\"topbar-menubutton p-link p-trigger\" (click)=\"onMenuButtonClick()\">\n <i class=\"pi pi-bars\"></i>\n </button>\n\n @if (breadcrumbComponent) {\n <div class=\"topbar-breadcrumb\">\n <div [mngComponent]=\"breadcrumbComponent\" [attachToHost]=\"true\"></div>\n </div>\n }\n </div>\n <div class=\"layout-topbar-menu-section\">\n <mng-sidebar></mng-sidebar>\n </div>\n <div class=\"topbar-end\">\n <ul class=\"topbar-menu\">\n @if (locales.length > 1) {\n <li class=\"profile-item\">\n <i class=\"pi pi-fw pi-globe\"></i>\n <p-dropdown [ngModel]=\"selectedLocale\" [options]=\"locales\" (onChange)=\"switchLocale($event.value)\"></p-dropdown>\n </li>\n }\n @if (topbarUserComponent) {\n <li #userMenuItem class=\"profile-item topbar-item mr-3\" [mngComponent]=\"topbarUserComponent\" [attachToHost]=\"true\"></li>\n }\n </ul>\n </div>\n</div>\n" }]
|
|
749
751
|
}], propDecorators: { menuButton: [{
|
|
750
752
|
type: ViewChild,
|
|
751
753
|
args: ['menubutton']
|
|
@@ -829,10 +831,10 @@ class MainLayoutComponent {
|
|
|
829
831
|
this.menuOutsideClickListener();
|
|
830
832
|
}
|
|
831
833
|
}
|
|
832
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
833
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
834
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: MainLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
835
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.4", type: MainLayoutComponent, isStandalone: true, selector: "mng-main-layout", providers: [MainLayoutComponentService], viewQueries: [{ propertyName: "appTopbar", first: true, predicate: ["topbarCmp"], descendants: true }], ngImport: i0, template: "@if (useNotificationWrapper) {\n <mng-notification-wrapper>\n <ng-template [ngTemplateOutlet]=\"content\"></ng-template>\n </mng-notification-wrapper>\n} @else {\n <ng-template [ngTemplateOutlet]=\"content\"></ng-template>\n}\n\n<ng-template #content>\n <div\n class=\"layout-container\"\n [ngClass]=\"{\n 'layout-light': colorScheme() === 'light',\n 'layout-dark': colorScheme() === 'dark',\n 'layout-overlay': menuMode() === 'overlay',\n 'layout-static': menuMode() === 'static',\n 'layout-reveal': menuMode() === 'reveal',\n 'layout-drawer': menuMode() === 'drawer',\n 'layout-slim': menuMode() === 'slim',\n 'layout-slim-plus': menuMode() === 'slim-plus',\n 'layout-static-inactive': layoutService.state().staticMenuDesktopInactive && menuMode() === 'static',\n 'layout-overlay-active': layoutService.state().overlayMenuActive,\n 'layout-mobile-active': layoutService.state().staticMenuMobileActive,\n 'p-ripple-disabled': !ripple(),\n 'layout-sidebar-active': layoutService.state().sidebarActive,\n 'layout-sidebar-anchored': layoutService.state().anchored\n }\">\n <div class=\"layout-content-wrapper\">\n @if (topbarComponent) {\n <div #topbarCmp class=\"layout-topbar-wrapper\" [mngComponent]=\"topbarComponent\" [attachToHost]=\"true\"></div>\n }\n @if (breadcrumbsComponent) {\n <div class=\"content-breadcrumb\">\n <div [mngComponent]=\"breadcrumbsComponent\" [attachToHost]=\"true\"></div>\n </div>\n }\n <div class=\"layout-content\">\n <router-outlet></router-outlet>\n </div>\n <div class=\"layout-mask\"></div>\n @if (footerComponent) {\n <div [mngComponent]=\"footerComponent\" [attachToHost]=\"true\"></div>\n }\n </div>\n </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i1$3.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "directive", type: ComponentDirective, selector: "[mngComponent]", inputs: ["mngComponent", "injectionToken", "inputs", "attachToHost", "parentInjector"], outputs: ["instanceCreated"] }, { kind: "component", type: NotificationWrapperComponent, selector: "mng-notification-wrapper" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
834
836
|
}
|
|
835
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
837
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.4", ngImport: i0, type: MainLayoutComponent, decorators: [{
|
|
836
838
|
type: Component,
|
|
837
839
|
args: [{ standalone: true, selector: 'mng-main-layout', imports: [NgClass, RouterModule, TopbarComponent, BreadcrumbComponent, ComponentDirective, AsyncPipe, NotificationWrapperComponent, NgTemplateOutlet], providers: [MainLayoutComponentService], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (useNotificationWrapper) {\n <mng-notification-wrapper>\n <ng-template [ngTemplateOutlet]=\"content\"></ng-template>\n </mng-notification-wrapper>\n} @else {\n <ng-template [ngTemplateOutlet]=\"content\"></ng-template>\n}\n\n<ng-template #content>\n <div\n class=\"layout-container\"\n [ngClass]=\"{\n 'layout-light': colorScheme() === 'light',\n 'layout-dark': colorScheme() === 'dark',\n 'layout-overlay': menuMode() === 'overlay',\n 'layout-static': menuMode() === 'static',\n 'layout-reveal': menuMode() === 'reveal',\n 'layout-drawer': menuMode() === 'drawer',\n 'layout-slim': menuMode() === 'slim',\n 'layout-slim-plus': menuMode() === 'slim-plus',\n 'layout-static-inactive': layoutService.state().staticMenuDesktopInactive && menuMode() === 'static',\n 'layout-overlay-active': layoutService.state().overlayMenuActive,\n 'layout-mobile-active': layoutService.state().staticMenuMobileActive,\n 'p-ripple-disabled': !ripple(),\n 'layout-sidebar-active': layoutService.state().sidebarActive,\n 'layout-sidebar-anchored': layoutService.state().anchored\n }\">\n <div class=\"layout-content-wrapper\">\n @if (topbarComponent) {\n <div #topbarCmp class=\"layout-topbar-wrapper\" [mngComponent]=\"topbarComponent\" [attachToHost]=\"true\"></div>\n }\n @if (breadcrumbsComponent) {\n <div class=\"content-breadcrumb\">\n <div [mngComponent]=\"breadcrumbsComponent\" [attachToHost]=\"true\"></div>\n </div>\n }\n <div class=\"layout-content\">\n <router-outlet></router-outlet>\n </div>\n <div class=\"layout-mask\"></div>\n @if (footerComponent) {\n <div [mngComponent]=\"footerComponent\" [attachToHost]=\"true\"></div>\n }\n </div>\n </div>\n</ng-template>\n" }]
|
|
838
840
|
}], ctorParameters: () => [], propDecorators: { appTopbar: [{
|
|
@@ -840,13 +842,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImpor
|
|
|
840
842
|
args: ['topbarCmp']
|
|
841
843
|
}] } });
|
|
842
844
|
|
|
843
|
-
|
|
844
|
-
|
|
845
|
-
|
|
846
|
-
|
|
847
|
-
|
|
848
|
-
|
|
849
|
-
|
|
845
|
+
/**
|
|
846
|
+
* Creates a layout route on the specified path.
|
|
847
|
+
*
|
|
848
|
+
* @param {String} path - The path of the route.
|
|
849
|
+
* @return {RouteBuilder} - The route builder for the layout route.
|
|
850
|
+
*/
|
|
851
|
+
function createLayoutRoute(path) {
|
|
852
|
+
return createRoute(path, MainLayoutComponent);
|
|
850
853
|
}
|
|
851
854
|
|
|
852
855
|
/**
|
|
@@ -874,5 +877,5 @@ function withLayout(config) {
|
|
|
874
877
|
* Generated bundle index. Do not edit.
|
|
875
878
|
*/
|
|
876
879
|
|
|
877
|
-
export { BreadcrumbComponent, COMMONS_LAYOUT_FEATURE_CONFIG_IT, FooterComponent,
|
|
880
|
+
export { BreadcrumbComponent, COMMONS_LAYOUT_FEATURE_CONFIG_IT, FooterComponent, MainLayoutComponent, MainLayoutComponentService, MenuComponent, MenuItemComponent, MenuService, SidebarComponent, TopbarComponent, TopbarUserComponent, VersionComponent, VersionService, createLayoutRoute, withLayout };
|
|
878
881
|
//# sourceMappingURL=mediusinc-mng-commons-layout.mjs.map
|