@onemrvapublic/design-system 1.0.0-beta.4 → 1.0.0-develop.1

package/fesm2022/onemrvapublic-design-system-layout.mjs

@@ -0,0 +1,948 @@
+import * as i0 from '@angular/core';
+import { inject, ChangeDetectorRef, TemplateRef, ContentChildren, Input, ViewChild, Component, DestroyRef, ViewContainerRef, DOCUMENT, Directive, signal, Injectable, effect, HostBinding, EventEmitter, isDevMode, Output, ContentChild, Pipe, NgModule } from '@angular/core';
+import { Router, RouterLink, RouterLinkActive, NavigationEnd, RouterModule } from '@angular/router';
+import { NgTemplateOutlet, NgClass, DOCUMENT as DOCUMENT$1, NgStyle, CommonModule } from '@angular/common';
+import { MatIcon, MatIconModule } from '@angular/material/icon';
+import { MatMenu, MatMenuTrigger, MatMenuItem, MatMenuModule } from '@angular/material/menu';
+import { TranslateService, TranslatePipe, TranslateModule } from '@ngx-translate/core';
+import { Subject, takeUntil, startWith, BehaviorSubject } from 'rxjs';
+import { BreakpointObserver, Breakpoints, LayoutModule } from '@angular/cdk/layout';
+import * as i2$1 from '@angular/material/sidenav';
+import { MatDrawer, MatDrawerContainer, MatSidenavModule } from '@angular/material/sidenav';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { filter } from 'rxjs/operators';
+import { trigger, state, transition, style, animate } from '@angular/animations';
+import { MatIconButton, MatFabButton, MatButtonModule } from '@angular/material/button';
+import { OnemrvaMatNavigationComponent } from '@onemrvapublic/design-system/mat-navigation';
+import * as i1 from '@angular/material/form-field';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import * as i2 from '@angular/material/select';
+import { MatSelectModule } from '@angular/material/select';
+import * as i3 from '@angular/forms';
+import { FormsModule } from '@angular/forms';
+import { ONEMRVA_THEME_CLASS, OnemRvaCDNService, OnemRvaSizeDirective, OnemRvaColorDirective } from '@onemrvapublic/design-system/shared';
+import { MatToolbar, MatToolbarModule } from '@angular/material/toolbar';
+import { MatTabNav, MatTabLink, MatTabNavPanel, MatTabsModule } from '@angular/material/tabs';
+import { MatDivider, MatDividerModule } from '@angular/material/divider';
+import * as i1$1 from '@onemrvapublic/design-system/mat-avatar';
+import { OnemrvaMatAvatarModule } from '@onemrvapublic/design-system/mat-avatar';
+import { MatTooltip, MatTooltipModule } from '@angular/material/tooltip';
+import { MatRipple } from '@angular/material/core';
+import { coerceBooleanProperty } from '@angular/cdk/coercion';
+import { MAT_SNACK_BAR_DEFAULT_OPTIONS } from '@angular/material/snack-bar';
+
+class LayoutSubrouteComponent {
+    constructor() {
+        this.cd = inject(ChangeDetectorRef);
+        this.router = inject(Router);
+    }
+    ngAfterViewInit() {
+        if (this.label === undefined) {
+            console.error('ONEM/RVA DESIGN SYSTEM ERROR : Since 20.1.0 , you must add a label attribute to the onemrva-layout-route', this.routerLink);
+        }
+        this.cd.detectChanges();
+    }
+    hasSubroutes() {
+        return this.subroutes !== undefined && this.subroutes.length > 0;
+    }
+    hasActiveSubroute() {
+        return this.subroutes?.some(x => this.isActiveRoute(x)) ?? false;
+    }
+    isActiveRoute(subroute) {
+        if (subroute.routerLink) {
+            const routerLink = Array.isArray(subroute.routerLink)
+                ? this.router.createUrlTree(subroute.routerLink)
+                : this.router.createUrlTree([subroute.routerLink]);
+            return this.router.isActive(routerLink, {
+                paths: 'exact',
+                queryParams: 'exact',
+                fragment: 'ignored',
+                matrixParams: 'ignored',
+            });
+        }
+        else {
+            return false;
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutSubrouteComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: LayoutSubrouteComponent, isStandalone: true, selector: "onemrva-layout-subroute", inputs: { customNgClass: "customNgClass", routerLink: "routerLink", routerLinkActiveOptions: "routerLinkActiveOptions", dataCy: "dataCy", label: "label", icon: "icon" }, queries: [{ propertyName: "subroutes", predicate: LayoutSubrouteComponent }], viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: "<ng-template>\n  {{ label }}\n</ng-template>\n" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutSubrouteComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'onemrva-layout-subroute', standalone: true, template: "<ng-template>\n  {{ label }}\n</ng-template>\n" }]
+        }], propDecorators: { customNgClass: [{
+                type: Input
+            }], template: [{
+                type: ViewChild,
+                args: [TemplateRef]
+            }], routerLink: [{
+                type: Input
+            }], routerLinkActiveOptions: [{
+                type: Input
+            }], dataCy: [{
+                type: Input
+            }], label: [{
+                type: Input
+            }], icon: [{
+                type: Input
+            }], subroutes: [{
+                type: ContentChildren,
+                args: [LayoutSubrouteComponent]
+            }] } });
+
+class LayoutRouteComponent {
+    constructor() {
+        this.template = null;
+        this.cd = inject(ChangeDetectorRef);
+        this.router = inject(Router);
+    }
+    hasSubroutes() {
+        return this.subroutes !== undefined && this.subroutes.length > 0;
+    }
+    ngAfterViewInit() {
+        this.cd.detectChanges();
+        if (this.label === undefined) {
+            console.error('ONEM/RVA DESIGN SYSTEM ERROR : Since 20.1.0 , you must add a label attribute to the onemrva-layout-route', this.routerLink);
+        }
+    }
+    isRouteActive() {
+        if (this.routerLink === null || this.routerLink === undefined) {
+            if (this.baseRouteForActiveMenu) {
+                const currentRoute = this.router.url;
+                const isParentRoutePresent = new RegExp(this.baseRouteForActiveMenu + '/').test(currentRoute);
+                const isExactRoutePresent = new RegExp(this.baseRouteForActiveMenu + '$').test(currentRoute);
+                return isParentRoutePresent || isExactRoutePresent;
+            }
+        }
+        return false;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutRouteComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: LayoutRouteComponent, isStandalone: true, selector: "onemrva-layout-route", inputs: { customNgClass: "customNgClass", routerLink: "routerLink", routerLinkActiveOptions: "routerLinkActiveOptions", dataCy: "dataCy", baseRouteForActiveMenu: "baseRouteForActiveMenu", label: "label", icon: "icon" }, queries: [{ propertyName: "subroutes", predicate: LayoutSubrouteComponent }], viewQueries: [{ propertyName: "template", first: true, predicate: ["navTpl"], descendants: true }], ngImport: i0, template: "<ng-template #navTpl>\n  @if (!hasSubroutes()) {\n    {{ label }}\n  } @else if (hasSubroutes()) {\n    <span role=\"button\" [matMenuTriggerFor]=\"menu\">\n      {{ label }}\n    </span>\n    <mat-icon [matMenuTriggerFor]=\"menu\">expand_more</mat-icon>\n    <mat-menu #menu>\n      @for (e of subroutes?.toArray(); track e.routerLink) {\n        @if (!e.hasSubroutes()) {\n          <button\n            mat-menu-item\n            [routerLink]=\"e.routerLink\"\n            routerLinkActive=\"active\"\n            [attr.data-cy]=\"e.dataCy\"\n          >\n            @if (e.template; as routeTemplate) {\n              <ng-container *ngTemplateOutlet=\"routeTemplate\"></ng-container>\n            }\n          </button>\n        }\n        @if (e.hasSubroutes()) {\n          <button\n            mat-menu-item\n            [matMenuTriggerFor]=\"submenu\"\n            [ngClass]=\"{ active: e.hasActiveSubroute() }\"\n            [attr.data-cy]=\"e.dataCy\"\n          >\n            @if (e.template; as routeTemplate) {\n              <ng-container *ngTemplateOutlet=\"routeTemplate\"></ng-container>\n            }\n          </button>\n          <mat-menu #submenu>\n            @for (es of e.subroutes?.toArray(); track es.routerLink) {\n              <button\n                mat-menu-item\n                [routerLink]=\"es.routerLink\"\n                routerLinkActive=\"active\"\n              >\n                @if (es.template; as routeTemplate) {\n                  <ng-container *ngTemplateOutlet=\"routeTemplate\">\n                  </ng-container>\n                }\n              </button>\n            }\n          </mat-menu>\n        }\n      }\n    </mat-menu>\n  }\n</ng-template>\n", dependencies: [{ kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "directive", type: MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutRouteComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'onemrva-layout-route', standalone: true, imports: [
+                        MatIcon,
+                        MatMenu,
+                        MatMenuTrigger,
+                        RouterLink,
+                        MatMenuItem,
+                        RouterLinkActive,
+                        NgTemplateOutlet,
+                        NgClass,
+                    ], template: "<ng-template #navTpl>\n  @if (!hasSubroutes()) {\n    {{ label }}\n  } @else if (hasSubroutes()) {\n    <span role=\"button\" [matMenuTriggerFor]=\"menu\">\n      {{ label }}\n    </span>\n    <mat-icon [matMenuTriggerFor]=\"menu\">expand_more</mat-icon>\n    <mat-menu #menu>\n      @for (e of subroutes?.toArray(); track e.routerLink) {\n        @if (!e.hasSubroutes()) {\n          <button\n            mat-menu-item\n            [routerLink]=\"e.routerLink\"\n            routerLinkActive=\"active\"\n            [attr.data-cy]=\"e.dataCy\"\n          >\n            @if (e.template; as routeTemplate) {\n              <ng-container *ngTemplateOutlet=\"routeTemplate\"></ng-container>\n            }\n          </button>\n        }\n        @if (e.hasSubroutes()) {\n          <button\n            mat-menu-item\n            [matMenuTriggerFor]=\"submenu\"\n            [ngClass]=\"{ active: e.hasActiveSubroute() }\"\n            [attr.data-cy]=\"e.dataCy\"\n          >\n            @if (e.template; as routeTemplate) {\n              <ng-container *ngTemplateOutlet=\"routeTemplate\"></ng-container>\n            }\n          </button>\n          <mat-menu #submenu>\n            @for (es of e.subroutes?.toArray(); track es.routerLink) {\n              <button\n                mat-menu-item\n                [routerLink]=\"es.routerLink\"\n                routerLinkActive=\"active\"\n              >\n                @if (es.template; as routeTemplate) {\n                  <ng-container *ngTemplateOutlet=\"routeTemplate\">\n                  </ng-container>\n                }\n              </button>\n            }\n          </mat-menu>\n        }\n      }\n    </mat-menu>\n  }\n</ng-template>\n" }]
+        }], propDecorators: { customNgClass: [{
+                type: Input
+            }], template: [{
+                type: ViewChild,
+                args: ['navTpl']
+            }], routerLink: [{
+                type: Input
+            }], routerLinkActiveOptions: [{
+                type: Input
+            }], dataCy: [{
+                type: Input
+            }], baseRouteForActiveMenu: [{
+                type: Input
+            }], label: [{
+                type: Input
+            }], icon: [{
+                type: Input
+            }], subroutes: [{
+                type: ContentChildren,
+                args: [LayoutSubrouteComponent]
+            }] } });
+
+class LayoutContentComponent {
+    constructor() {
+        this.cd = inject(ChangeDetectorRef);
+    }
+    ngAfterViewInit() {
+        this.cd.detectChanges();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: LayoutContentComponent, isStandalone: true, selector: "onemrva-layout-content", inputs: { customNgClass: "customNgClass" }, viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: '<ng-template><ng-content></ng-content></ng-template>', isInline: true }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutContentComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'onemrva-layout-content',
+                    template: '<ng-template><ng-content></ng-content></ng-template>',
+                    standalone: true,
+                }]
+        }], propDecorators: { customNgClass: [{
+                type: Input
+            }], template: [{
+                type: ViewChild,
+                args: [TemplateRef]
+            }] } });
+
+class LayoutTitleComponent {
+    constructor() {
+        this.cd = inject(ChangeDetectorRef);
+    }
+    ngAfterViewInit() {
+        this.cd.detectChanges();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: LayoutTitleComponent, isStandalone: true, selector: "onemrva-layout-title", inputs: { customNgClass: "customNgClass" }, viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: '<ng-template><ng-content></ng-content></ng-template>', isInline: true }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutTitleComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'onemrva-layout-title',
+                    template: '<ng-template><ng-content></ng-content></ng-template>',
+                    standalone: true,
+                }]
+        }], propDecorators: { customNgClass: [{
+                type: Input
+            }], template: [{
+                type: ViewChild,
+                args: [TemplateRef]
+            }] } });
+
+var Environment;
+(function (Environment) {
+    Environment["LOCAL"] = "LOCAL";
+    Environment["TEST"] = "TEST";
+    Environment["VAL"] = "VAL";
+    Environment["PROD"] = "PROD";
+})(Environment || (Environment = {}));
+
+class LayoutFooterComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: LayoutFooterComponent, isStandalone: true, selector: "onemrva-layout-footer", viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: '<ng-template><ng-content></ng-content></ng-template>', isInline: true }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutFooterComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'onemrva-layout-footer',
+                    template: '<ng-template><ng-content></ng-content></ng-template>',
+                    standalone: true,
+                }]
+        }], propDecorators: { template: [{
+                type: ViewChild,
+                args: [TemplateRef]
+            }] } });
+
+class LayoutLoginMenuComponent {
+    constructor() {
+        this.cd = inject(ChangeDetectorRef);
+    }
+    ngAfterViewInit() {
+        this.cd.detectChanges();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutLoginMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: LayoutLoginMenuComponent, isStandalone: true, selector: "onemrva-layout-login-menu", inputs: { customNgClass: "customNgClass" }, viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: '<ng-template><ng-content></ng-content></ng-template>', isInline: true }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutLoginMenuComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'onemrva-layout-login-menu',
+                    template: '<ng-template><ng-content></ng-content></ng-template>',
+                    standalone: true,
+                }]
+        }], propDecorators: { customNgClass: [{
+                type: Input
+            }], template: [{
+                type: ViewChild,
+                args: [TemplateRef]
+            }] } });
+
+// Command to generate ng g d <Directive name>
+class DrawerHostDirective {
+    constructor() {
+        this.destroyRef = inject(DestroyRef);
+        this.drawer = inject(MatDrawer);
+        this.viewContainerRef = inject(ViewContainerRef);
+        this.document = inject(DOCUMENT);
+    }
+    createComponent(component) {
+        this.viewContainerRef.clear();
+        return this.viewContainerRef.createComponent(component);
+    }
+    bodyClass() {
+        if (this.drawer?.opened) {
+            this.document.body.style.overflow = 'hidden';
+        }
+        else {
+            this.document.body.style.overflow = 'inherit';
+        }
+    }
+    ngAfterViewInit() {
+        this.drawer?.openedChange
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe(() => {
+            this.bodyClass();
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: DrawerHostDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.1.7", type: DrawerHostDirective, isStandalone: true, selector: "[drawerhost]", ngImport: i0 }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: DrawerHostDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[drawerhost]',
+                    standalone: true,
+                }]
+        }] });
+
+class OnemrvaDrawerService {
+    constructor() {
+        this.hasBackdrop = signal(true, ...(ngDevMode ? [{ debugName: "hasBackdrop" }] : []));
+        this.size = signal('', ...(ngDevMode ? [{ debugName: "size" }] : []));
+        this.isSide = false;
+    }
+    toggle(isSide = false) {
+        if (!this.drawer)
+            return;
+        this.isSide = isSide;
+        this.drawer?.toggle();
+    }
+    open(isSide = false) {
+        if (!this.drawer)
+            return;
+        this.isSide = isSide;
+        this.drawer?.open();
+    }
+    close() {
+        if (!this.drawer)
+            return;
+        this.drawer?.close();
+    }
+    classes() {
+        if (this.isSide) {
+            return [this.size(), 'side-menu'];
+        }
+        return [this.size()];
+    }
+    setDrawer(drawer) {
+        this.drawer = drawer;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: OnemrvaDrawerService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: OnemrvaDrawerService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: OnemrvaDrawerService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
+
+class OnemrvaLeftSidenavService {
+    constructor() {
+        this.originalItems = [];
+        this.items = signal([], ...(ngDevMode ? [{ debugName: "items" }] : []));
+        this.router = inject(Router);
+        this.router.events
+            .pipe(filter((e) => e instanceof NavigationEnd))
+            .subscribe(() => this.reset());
+    }
+    setOriginal(items) {
+        this.originalItems = items ?? [];
+        this.items.set(this.originalItems);
+    }
+    updateItems(items) {
+        this.items.set(items ?? []);
+        this.items(); // ??
+    }
+    reset() {
+        this.items.set(this.originalItems);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: OnemrvaLeftSidenavService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: OnemrvaLeftSidenavService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: OnemrvaLeftSidenavService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: () => [] });
+
+class LayoutSidenavComponent {
+    constructor() {
+        this.languages = [];
+        this.items = [];
+        this.translateService = inject(TranslateService);
+        this.document = inject(DOCUMENT$1);
+        this.drawerService = inject(OnemrvaDrawerService);
+    }
+    ngOnInit() {
+        this.currentLanguage = this.languages.filter(l => l.code == this.translateService.currentLang)[0];
+        if (this.routes)
+            this.helpMenuOpen = this.routes.map(route => route.hasSubroutes()
+                ? ['out', ...route.subroutes.map(() => 'out')]
+                : ['in']);
+        // Replace your existing items population with:
+        this.items = this.populateItemsRecursively(this.routes);
+    }
+    changeLanguage(event) {
+        this.translateService.use(event.value.code);
+        this.document.documentElement.lang = event.value.code;
+    }
+    close() {
+        this.drawerService.close();
+    }
+    populateItemsRecursively(routes) {
+        const items = [];
+        if (routes === undefined)
+            routes = [];
+        const routeArray = Array.isArray(routes) ? routes : routes.toArray();
+        for (const route of routeArray) {
+            const navItem = {
+                routerLink: typeof route.routerLink === 'string' ? route.routerLink : undefined,
+                label: this.getRouteLabel(route),
+                icon: route.icon, // LayoutSubrouteComponent doesn't have icon, so cast to any
+                dataCy: route.dataCy,
+            };
+            // Recursively populate children if subroutes exist
+            if (route.hasSubroutes() && route.subroutes) {
+                navItem.children = this.populateItemsRecursively(route.subroutes);
+            }
+            items.push(navItem);
+        }
+        return items;
+    }
+    getRouteLabel(route) {
+        // Check if it's a LayoutRouteComponent with label property
+        if ('label' in route && route.label) {
+            return route.label;
+        }
+        return 'Unnamed Route';
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutSidenavComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: LayoutSidenavComponent, isStandalone: true, selector: "onemrva-layout-sidenav", inputs: { isSmall: "isSmall", routes: "routes", languages: "languages" }, ngImport: i0, template: "@if (\n  isSmall && (routes?.toArray()?.length || (languages && languages.length > 1))\n) {\n  <div class=\"sidebar\">\n    @if (isSmall && routes?.toArray()?.length) {\n      <div class=\"navigation\">\n        <div class=\"close-button\">\n          <button\n            type=\"button\"\n            mat-icon-button\n            (click)=\"close()\"\n            data-cy=\"smallDeviceMenu\"\n            attr.aria-label=\"{{ 'layout.menu' | translate }}\"\n          >\n            <mat-icon>close</mat-icon>\n          </button>\n        </div>\n        <onemrva-mat-navigation [items]=\"items\"></onemrva-mat-navigation>\n      </div>\n      @if (languages && languages.length > 1) {\n        <div class=\"language-selector\">\n          <mat-form-field>\n            <mat-select\n              [ngModel]=\"currentLanguage\"\n              (selectionChange)=\"changeLanguage($event)\"\n            >\n              @for (lang of languages; track lang.code) {\n                <mat-option\n                  [value]=\"lang\"\n                  [attr.data-cy]=\"'language_' + lang.code\"\n                >\n                  {{ lang.label }}\n                </mat-option>\n              }\n            </mat-select>\n          </mat-form-field>\n        </div>\n      }\n    }\n  </div>\n}\n", styles: [":host{min-width:250px}:host .close-button{display:flex;justify-content:flex-end;padding:var(--spacer)}:host .mobile-menu-item{display:flex;width:100%;background:var(--mat-sys-background);padding:var(--spacer);border:none;box-shadow:none;font-size:1.2rem;align-items:center;text-align:left}:host .mobile-menu-item:active,:host .mobile-menu-item.active{border-right:4px solid var(--mat-sys-secondary);font-weight:700!important}:host .mobile-menu-item mat-icon{margin-left:4px}:host .sidebar{overflow:scroll;display:flex;flex-direction:column;justify-content:space-between;height:100vh}:host .sidebar .language-selector{margin:var(--double-spacer);bottom:0}:host .sidebar .language-selector mat-form-field{width:100%}\n"], dependencies: [{ kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: OnemrvaMatNavigationComponent, selector: "onemrva-mat-navigation", inputs: ["items", "level", "translate"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], animations: [
+            trigger('slideInOut', [
+                state('in', style({
+                    overflow: 'hidden',
+                    height: '*',
+                })),
+                state('out', style({
+                    opacity: '0',
+                    overflow: 'hidden',
+                    height: '0px',
+                })),
+                transition('in => out', animate('400ms ease-in-out')),
+                transition('out => in', animate('400ms ease-in-out')),
+            ]),
+        ] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutSidenavComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'onemrva-layout-sidenav', animations: [
+                        trigger('slideInOut', [
+                            state('in', style({
+                                overflow: 'hidden',
+                                height: '*',
+                            })),
+                            state('out', style({
+                                opacity: '0',
+                                overflow: 'hidden',
+                                height: '0px',
+                            })),
+                            transition('in => out', animate('400ms ease-in-out')),
+                            transition('out => in', animate('400ms ease-in-out')),
+                        ]),
+                    ], standalone: true, imports: [
+                        MatIconButton,
+                        MatIcon,
+                        TranslatePipe,
+                        OnemrvaMatNavigationComponent,
+                        MatFormFieldModule,
+                        MatSelectModule,
+                        FormsModule,
+                    ], template: "@if (\n  isSmall && (routes?.toArray()?.length || (languages && languages.length > 1))\n) {\n  <div class=\"sidebar\">\n    @if (isSmall && routes?.toArray()?.length) {\n      <div class=\"navigation\">\n        <div class=\"close-button\">\n          <button\n            type=\"button\"\n            mat-icon-button\n            (click)=\"close()\"\n            data-cy=\"smallDeviceMenu\"\n            attr.aria-label=\"{{ 'layout.menu' | translate }}\"\n          >\n            <mat-icon>close</mat-icon>\n          </button>\n        </div>\n        <onemrva-mat-navigation [items]=\"items\"></onemrva-mat-navigation>\n      </div>\n      @if (languages && languages.length > 1) {\n        <div class=\"language-selector\">\n          <mat-form-field>\n            <mat-select\n              [ngModel]=\"currentLanguage\"\n              (selectionChange)=\"changeLanguage($event)\"\n            >\n              @for (lang of languages; track lang.code) {\n                <mat-option\n                  [value]=\"lang\"\n                  [attr.data-cy]=\"'language_' + lang.code\"\n                >\n                  {{ lang.label }}\n                </mat-option>\n              }\n            </mat-select>\n          </mat-form-field>\n        </div>\n      }\n    }\n  </div>\n}\n", styles: [":host{min-width:250px}:host .close-button{display:flex;justify-content:flex-end;padding:var(--spacer)}:host .mobile-menu-item{display:flex;width:100%;background:var(--mat-sys-background);padding:var(--spacer);border:none;box-shadow:none;font-size:1.2rem;align-items:center;text-align:left}:host .mobile-menu-item:active,:host .mobile-menu-item.active{border-right:4px solid var(--mat-sys-secondary);font-weight:700!important}:host .mobile-menu-item mat-icon{margin-left:4px}:host .sidebar{overflow:scroll;display:flex;flex-direction:column;justify-content:space-between;height:100vh}:host .sidebar .language-selector{margin:var(--double-spacer);bottom:0}:host .sidebar .language-selector mat-form-field{width:100%}\n"] }]
+        }], propDecorators: { isSmall: [{
+                type: Input
+            }], routes: [{
+                type: Input
+            }], languages: [{
+                type: Input
+            }] } });
+
+class LayoutAfterNavComponent {
+    constructor() {
+        this.cd = inject(ChangeDetectorRef);
+    }
+    ngAfterViewInit() {
+        this.cd.detectChanges();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutAfterNavComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: LayoutAfterNavComponent, isStandalone: true, selector: "onemrva-layout-after-nav", inputs: { customNgClass: "customNgClass" }, viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: '<ng-template><ng-content></ng-content></ng-template>', isInline: true }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutAfterNavComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'onemrva-layout-after-nav',
+                    template: '<ng-template><ng-content></ng-content></ng-template>',
+                    standalone: true,
+                }]
+        }], propDecorators: { customNgClass: [{
+                type: Input
+            }], template: [{
+                type: ViewChild,
+                args: [TemplateRef]
+            }] } });
+
+class LayoutLeftSidenavComponent {
+    set items(value) {
+        this._items = value ?? [];
+        this.leftSidenavService.setOriginal(this._items);
+    }
+    get items() {
+        return this._items;
+    }
+    constructor() {
+        this._items = [];
+        this._isHidden = false;
+        this.leftSidenavService = inject(OnemrvaLeftSidenavService);
+        effect(() => {
+            this._isHidden = this.leftSidenavService.items().length === 0;
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutLeftSidenavComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: LayoutLeftSidenavComponent, isStandalone: true, selector: "onemrva-layout-left-sidenav", inputs: { items: "items" }, host: { properties: { "class.hidden": "this._isHidden" } }, ngImport: i0, template: "@if (leftSidenavService.items().length > 0) {\n  <onemrva-mat-navigation\n    [items]=\"leftSidenavService.items()\"\n  ></onemrva-mat-navigation>\n} @else {\n  <ng-content></ng-content>\n}\n", styles: [":host{width:240px;margin-right:40px;border-right:1px solid var(--mat-sys-outline-variant)}\n"], dependencies: [{ kind: "component", type: OnemrvaMatNavigationComponent, selector: "onemrva-mat-navigation", inputs: ["items", "level", "translate"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutLeftSidenavComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'onemrva-layout-left-sidenav', imports: [OnemrvaMatNavigationComponent], standalone: true, template: "@if (leftSidenavService.items().length > 0) {\n  <onemrva-mat-navigation\n    [items]=\"leftSidenavService.items()\"\n  ></onemrva-mat-navigation>\n} @else {\n  <ng-content></ng-content>\n}\n", styles: [":host{width:240px;margin-right:40px;border-right:1px solid var(--mat-sys-outline-variant)}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { items: [{
+                type: Input
+            }], _isHidden: [{
+                type: HostBinding,
+                args: ['class.hidden']
+            }] } });
+
+class LayoutComponent {
+    toggleTheme(newTheme) {
+        this.activeTheme.set(newTheme);
+        // Find all elements with onemrva-theme class
+        const overlayThemeDivs = document.querySelectorAll('.' + this.onemrvaClass);
+        overlayThemeDivs.forEach(div => {
+            // Remove existing theme classes
+            div.classList.remove('light-theme', 'dark-theme');
+            // Add new theme class if not system
+            if (newTheme !== 'system') {
+                div.classList.add(`${newTheme}-theme`);
+            }
+        });
+    }
+    constructor() {
+        this.logo = ''; // custom logo, empty string will show default onem/rva/neo/lfa localised logo
+        this.languages = []; // list of languages
+        this.logoRedictionUrl = ''; // value for routerLink from logo. "" by default. Deactivated when set to null
+        this.selectedIndex = 0;
+        this.destroyNotifier$ = new Subject();
+        this.profile = null; // To be defined for application with authentication
+        this.login = new EventEmitter();
+        this.logout = new EventEmitter();
+        //    isLogoutUsed: boolean = false;
+        this.env = Environment;
+        this.isSmall = true;
+        this.id = 'main';
+        this.role = 'main';
+        this.showThemeSwitcher = true;
+        this.onemrvaClass = inject(ONEMRVA_THEME_CLASS);
+        this.activeTheme = signal('system', ...(ngDevMode ? [{ debugName: "activeTheme" }] : []));
+        this.translateService = inject(TranslateService);
+        this.cdn = inject(OnemRvaCDNService);
+        this.cd = inject(ChangeDetectorRef);
+        this.breakpointObserver = inject(BreakpointObserver);
+        this.document = inject(DOCUMENT$1);
+        this.drawerService = inject(OnemrvaDrawerService);
+        this.leftSidenavService = inject(OnemrvaLeftSidenavService);
+        if (this.languages.length === 0) {
+            this.translateService.getLangs().forEach(value => {
+                this.languages.push({
+                    code: value,
+                    label: value.toUpperCase(),
+                });
+            });
+        }
+    }
+    ngOnInit() {
+        this.selectedIndex = this.languages.findIndex(l => l.code === this.translateService.currentLang);
+        this.document.documentElement.lang = this.translateService.currentLang;
+        this.breakpointObserver
+            .observe([Breakpoints.XSmall, Breakpoints.Small])
+            .pipe(takeUntil(this.destroyNotifier$))
+            .subscribe((state) => {
+            if (state.matches) {
+                this.isSmall = true;
+            }
+            else {
+                this.drawerService.close();
+                this.isSmall = false;
+            }
+        });
+        if (this.logo === '') {
+            this.translateService.onLangChange
+                .pipe(startWith({ lang: this.translateService.currentLang }), takeUntil(this.destroyNotifier$))
+                .subscribe(lang => {
+                this.logo = this.cdn.getImg(`logo/logo_${lang.lang?.toLocaleLowerCase()}.svg`);
+            });
+        }
+        this.translateService.onLangChange
+            .pipe(takeUntil(this.destroyNotifier$))
+            .subscribe(event => {
+            this.selectedIndex = this.languages.findIndex(lang => lang.code === event.lang);
+        });
+        this.drawerService.host = this.drawerHost;
+        this.drawerService.setDrawer(this.drawer);
+    }
+    get currentLanguage() {
+        return this.translateService.currentLang || '';
+    }
+    ngAfterViewInit() {
+        if (isDevMode()) {
+            this.cd.detectChanges();
+        }
+        // this.drawer.closedStart
+        //   .pipe(takeUntil(this.destroyNotifier$))
+        //   .subscribe(() => {
+        //   });
+    }
+    ngOnDestroy() {
+        this.destroyNotifier$.next();
+        this.destroyNotifier$.complete();
+    }
+    doLogout() {
+        this.logout.next();
+    }
+    doLogin() {
+        this.login.next();
+    }
+    changeLanguage(langCode) {
+        this.translateService.use(langCode);
+        this.document.documentElement.lang = langCode;
+    }
+    toggleSideNav() {
+        const componentRef = this.drawerHost.createComponent(LayoutSidenavComponent);
+        this.drawerService.size.set('');
+        componentRef.instance.isSmall = this.isSmall;
+        componentRef.instance.languages = this.languages;
+        componentRef.instance.routes = this.routes;
+        this.drawerService.toggle(true);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: LayoutComponent, isStandalone: true, selector: "onemrva-layout", inputs: { logo: "logo", languages: "languages", environment: "environment", logoRedictionUrl: "logoRedictionUrl", profile: "profile", id: "id", role: "role", showThemeSwitcher: "showThemeSwitcher" }, outputs: { login: "login", logout: "logout" }, queries: [{ propertyName: "title", first: true, predicate: LayoutTitleComponent, descendants: true }, { propertyName: "loginMenu", first: true, predicate: LayoutLoginMenuComponent, descendants: true }, { propertyName: "content", first: true, predicate: LayoutContentComponent, descendants: true }, { propertyName: "afterNav", first: true, predicate: LayoutAfterNavComponent, descendants: true }, { propertyName: "footer", first: true, predicate: LayoutFooterComponent, descendants: true }, { propertyName: "routes", predicate: LayoutRouteComponent }], viewQueries: [{ propertyName: "drawer", first: true, predicate: MatDrawer, descendants: true, static: true }, { propertyName: "drawerHost", first: true, predicate: DrawerHostDirective, descendants: true, static: true }], ngImport: i0, template: "<mat-drawer-container\n  id=\"onemrva-drawer-container\"\n  [hasBackdrop]=\"drawerService.hasBackdrop()\"\n  autosize\n>\n  <mat-drawer\n    #mainDrawer\n    [class]=\"drawerService.classes()\"\n    mode=\"over\"\n    position=\"end\"\n  >\n    <ng-template drawerhost></ng-template>\n  </mat-drawer>\n  <mat-drawer-content>\n    <div class=\"app-content\">\n      <header>\n        <mat-toolbar class=\"mat-elevation-z4\">\n          <div class=\"environment\" [class]=\"environment\">\n            {{ environment }}\n          </div>\n          <div class=\"nav-container onemrva-layout-container flex-center g-m\">\n            {{ logoRedictionUrl }}\n            <img\n              class=\"logo align-center clickable\"\n              [src]=\"logo\"\n              [attr.data-cy]=\"\n                'onemrva_logo_' + currentLanguage.toLocaleLowerCase()\n              \"\n              alt=\"Logo ONEM/RVA\"\n              [routerLink]=\"\n                logoRedictionUrl !== null ? logoRedictionUrl : undefined\n              \"\n              [ngStyle]=\"{\n                cursor: logoRedictionUrl !== null ? 'pointer' : 'default',\n              }\"\n            />\n            <div\n              class=\"application-title\"\n              [ngClass]=\"{ 'small-screen': isSmall }\"\n            >\n              @if (title?.template; as titleTpl) {\n                <ng-container *ngTemplateOutlet=\"titleTpl\"></ng-container>\n              }\n            </div>\n\n            <div style=\"flex: 1\"></div>\n\n            @if (!isSmall) {\n              <div\n                class=\"flex-center topMenu\"\n                mat-tab-nav-bar\n                [tabPanel]=\"tabPanel\"\n              >\n                @for (e of routes?.toArray(); track $index) {\n                  <a\n                    mat-tab-link\n                    [routerLink]=\"e.routerLink\"\n                    [attr.data-ci]=\"e.dataCy\"\n                    [attr.data-cy]=\"e.dataCy\"\n                    [routerLinkActiveOptions]=\"{\n                      fragment: 'exact',\n                      matrixParams: 'exact',\n                      paths: 'exact',\n                      queryParams: 'ignored',\n                    }\"\n                    #rla=\"routerLinkActive\"\n                    routerLinkActive=\"mdc-tab--active\"\n                    [active]=\"rla.isActive || e.isRouteActive()\"\n                  >\n                    @if (e.template; as routeTemplate) {\n                      <ng-container\n                        *ngTemplateOutlet=\"routeTemplate\"\n                      ></ng-container>\n                    }\n                  </a>\n                }\n              </div>\n            }\n            <mat-tab-nav-panel #tabPanel></mat-tab-nav-panel>\n\n            @if (showThemeSwitcher) {\n              <button\n                mat-icon-button\n                [matMenuTriggerFor]=\"themeSwitch\"\n                [matTooltip]=\"'layout.mode.select' | translate\"\n              >\n                <mat-icon>{{\n                  activeTheme() === 'dark'\n                    ? 'dark_mode'\n                    : activeTheme() === 'light'\n                      ? 'light_mode'\n                      : 'brightness_auto'\n                }}</mat-icon>\n              </button>\n              <mat-menu #themeSwitch>\n                <button\n                  mat-menu-item\n                  [attr.aria-label]=\"'layout.mode.dark' | translate\"\n                  (click)=\"toggleTheme('dark')\"\n                >\n                  <mat-icon>dark_mode</mat-icon>\n                  <span>{{ 'layout.mode.dark' | translate }}</span>\n                </button>\n                <button\n                  mat-menu-item\n                  [attr.aria-label]=\"'layout.mode.light' | translate\"\n                  (click)=\"toggleTheme('light')\"\n                >\n                  <mat-icon>light_mode</mat-icon>\n                  <span>{{ 'layout.mode.light' | translate }}</span>\n                </button>\n                <button\n                  mat-menu-item\n                  [attr.aria-label]=\"'layout.mode.system' | translate\"\n                  (click)=\"toggleTheme('system')\"\n                >\n                  <mat-icon>brightness_auto</mat-icon>\n                  <span>{{ 'layout.mode.system' | translate }}</span>\n                </button>\n              </mat-menu>\n            }\n            @if (afterNav?.template; as tpl) {\n              <ng-container *ngTemplateOutlet=\"tpl\"></ng-container>\n            }\n\n            @if (profile !== null) {\n              @if (!isSmall) {\n                <mat-divider\n                  vertical\n                  style=\"height: 1em; align-self: center\"\n                ></mat-divider>\n              }\n              @if (profile.isLoggedIn) {\n                <onemrva-mat-avatar\n                  matRipple\n                  [matMenuTriggerFor]=\"menu\"\n                  initials=\"{{ profile.initials() }}\"\n                  color=\"accent\"\n                  size=\"xsmall\"\n                  class=\"clickable\"\n                ></onemrva-mat-avatar>\n              }\n              @if (!profile.isLoggedIn) {\n                <onemrva-mat-avatar\n                  matRipple\n                  [matMenuTriggerFor]=\"menu\"\n                  icon=\"account_circle\"\n                  color=\"\"\n                  size=\"xsmall\"\n                  class=\"clickable\"\n                ></onemrva-mat-avatar>\n              }\n              <mat-menu #menu=\"matMenu\">\n                @if (profile.isLoggedIn) {\n                  <div class=\"menu-header m mb-m\">\n                    {{ profile.firstName }} {{ profile.lastName }}\n                  </div>\n                  <mat-divider style=\"align-self: stretch\"></mat-divider>\n\n                  @if (loginMenu?.template; as menuLoginTpl) {\n                    <ng-container\n                      *ngTemplateOutlet=\"menuLoginTpl\"\n                    ></ng-container>\n                  }\n\n                  <button\n                    type=\"button\"\n                    class=\"mat-mdc-menu-item\"\n                    mat-menu-item\n                    data-cy=\"logoutButton\"\n                    (click)=\"doLogout()\"\n                    [attr.aria-label]=\"'layout.logout' | translate\"\n                  >\n                    <mat-icon>logout</mat-icon>\n                    {{ 'layout.logout' | translate }}\n                  </button>\n                } @else {\n                  <button\n                    type=\"button\"\n                    mat-menu-item\n                    data-cy=\"loginButton\"\n                    (click)=\"doLogin()\"\n                    [attr.aria-label]=\"'layout.login' | translate\"\n                  >\n                    <mat-icon>login</mat-icon>\n                    {{ 'layout.login' | translate }}\n                  </button>\n                }\n              </mat-menu>\n            }\n\n            @if (\n              isSmall &&\n              (routes?.toArray()?.length || (languages && languages.length > 1))\n            ) {\n              <button\n                type=\"button\"\n                mat-icon-button\n                class=\"menu-button\"\n                data-cy=\"smallDeviceMenu\"\n                (click)=\"this.toggleSideNav()\"\n                [attr.aria-label]=\"'layout.menu' | translate\"\n              >\n                <mat-icon>menu</mat-icon>\n              </button>\n            }\n            @if (!isSmall) {\n              <div class=\"flex-center\" mat-tab-nav-bar [tabPanel]=\"tabPanel\">\n                <a\n                  [matMenuTriggerFor]=\"languageMenu\"\n                  data-cy=\"languageMenu\"\n                  [attr.aria-label]=\"'language.selection' | translate\"\n                  mat-tab-link\n                >\n                  {{ currentLanguage }}\n                  <mat-icon style=\"width: 16px\">expand_more</mat-icon>\n                </a>\n              </div>\n            }\n            <mat-menu #languageMenu>\n              @for (lang of languages; track lang.code) {\n                <button\n                  type=\"button\"\n                  class=\"mat-mdc-menu-item\"\n                  mat-menu-item\n                  [attr.data-cy]=\"'language_' + lang.code\"\n                  (click)=\"changeLanguage(lang.code)\"\n                  [attr.aria-label]=\"lang.label\"\n                >\n                  {{ lang.label }}\n                </button>\n              }\n            </mat-menu>\n          </div>\n        </mat-toolbar>\n      </header>\n      <ng-container>\n        @if (content?.template; as tpl) {\n          <div\n            [id]=\"id\"\n            [attr.role]=\"role\"\n            class=\"onemrva-layout-content onemrva-layout-container\"\n          >\n            @if (leftSidenavService.items().length > 0) {\n              <div class=\"container-with-nav\">\n                <div class=\"left-content\">\n                  <onemrva-layout-left-sidenav></onemrva-layout-left-sidenav>\n                </div>\n                <div class=\"right-content\">\n                  <ng-container *ngTemplateOutlet=\"tpl\"></ng-container>\n                </div>\n              </div>\n            } @else {\n              <ng-container *ngTemplateOutlet=\"tpl\"></ng-container>\n            }\n            @if (\n              environment &&\n              (environment === env.LOCAL || environment === env.TEST)\n            ) {\n              <button\n                id=\"accessibility_fab\"\n                mat-fab\n                color=\"accent\"\n                aria-label=\"Accessibility check\"\n                matTooltip=\"Accessibility check\"\n                onclick=\"(function() {var _p='//openfed.github.io/AccessibilityCheck/build/';var _i=function(s,cb) {var sc=document.createElement('script');sc.onload = function() {sc.onload = null;sc.onreadystatechange = null;cb.call(this);};sc.onreadystatechange = function(){if(/^(complete|loaded)$/.test(this.readyState) === true){sc.onreadystatechange = null;sc.onload();}};sc.src=s;if (document.head) {document.head.appendChild(sc);} else {document.getElementsByTagName('head')[0].appendChild(sc);}}; var options={path:_p};_i(_p+'HTMLCS.js',function(){HTMLCSAuditor.run('WCAG2AA',null,options);});})();\"\n              >\n                <mat-icon>accessibility</mat-icon>\n              </button>\n            }\n          </div>\n        }\n\n        <footer class=\"onemrva-footer p mb text-center\">\n          @if (footer?.template; as footerTpl) {\n            <div class=\"onemrva-layout-container\">\n              <ng-container *ngTemplateOutlet=\"footerTpl\"></ng-container>\n            </div>\n          }\n        </footer>\n      </ng-container>\n    </div>\n  </mat-drawer-content>\n</mat-drawer-container>\n", styles: [":host{position:relative}:host a:active{outline:none}:host router-outlet{display:block;margin-bottom:90px}:host header mat-toolbar{position:fixed;height:var(--layout-header-height);z-index:400;--mat-tab-divider-color: transparent}:host header mat-toolbar .topMenu .mat-mdc-tab-header-pagination-before,:host header mat-toolbar .topMenu .mat-mdc-tab-header-pagination-after{display:none!important}:host header mat-toolbar .logo{height:42px}:host header mat-toolbar .application-title{font-size:1.3rem;font-weight:700;height:42px;line-height:42px;color:var(--mat-sys-tertiary)}:host header mat-toolbar .mat-mdc-tab-nav-bar{text-transform:uppercase}:host .onemrva-layout-content{padding-top:var(--layout-content-padding-top);min-height:calc(100vh - 48px)}:host .onemrva-layout-content .container-with-nav{display:flex}:host .onemrva-layout-content .container-with-nav .left-content{flex:0 0 240px}:host .onemrva-layout-content .container-with-nav .right-content{flex:1}:host .mat-drawer-content{min-height:100vh}:host #accessibility_fab{position:fixed;bottom:16px;left:16px}:host .environment{position:fixed;top:0;left:0;z-index:24000;width:60px;height:50px;padding:15px 20px;font-weight:700;font-size:16px;border-radius:0 0 100%;color:#fff;display:none}:host .environment.LOCAL{background:transparent linear-gradient(90deg,#de2174,#eb142a) 0 0 no-repeat padding-box;display:block}:host .environment.TEST{background-color:#36c;display:block}:host .environment.VAL{background-color:#093;display:block}:host mat-drawer:not(.side-menu){padding:var(--double-spacer);background:var(--mat-sys-surface-container-high)}:host mat-drawer.xsmall{width:20%}:host mat-drawer.small{width:30%}:host mat-drawer.medium{width:50%}:host mat-drawer.large{width:60%}:host mat-drawer.xlarge{width:70%}:host mat-drawer.xxlarge{width:90%}@media screen and (max-width: 640px){:host mat-drawer{width:99%!important}}.mat-mdc-menu-content button.active>*{font-weight:700!important}.mat-mdc-menu-content button mat-icon{font-size:1.125rem!important;height:1.125rem;width:1.125rem}.mat-mdc-menu-content button span{font-size:14px!important}nav a.disabled{pointer-events:none}\n"], dependencies: [{ kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: MatDrawerContainer, selector: "mat-drawer-container", inputs: ["autosize", "hasBackdrop"], outputs: ["backdropClick"], exportAs: ["matDrawerContainer"] }, { kind: "component", type: MatTabNav, selector: "[mat-tab-nav-bar]", inputs: ["fitInkBarToContent", "mat-stretch-tabs", "animationDuration", "backgroundColor", "disableRipple", "color", "tabPanel"], exportAs: ["matTabNavBar", "matTabNav"] }, { kind: "component", type: MatTabLink, selector: "[mat-tab-link], [matTabLink]", inputs: ["active", "disabled", "disableRipple", "tabIndex", "id"], exportAs: ["matTabLink"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: MatTabNavPanel, selector: "mat-tab-nav-panel", inputs: ["id"], exportAs: ["matTabNavPanel"] }, { kind: "component", type: MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: OnemrvaMatAvatarModule }, { kind: "component", type: i1$1.OnemrvaMatAvatarComponent, selector: "onemrva-mat-avatar", inputs: ["id", "roundShape", "initials", "text", "icon", "src"] }, { kind: "directive", type: 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: 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: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: MatFabButton, selector: "button[mat-fab], a[mat-fab], button[matFab], a[matFab]", inputs: ["extended"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: MatDrawer, selector: "mat-drawer", inputs: ["position", "mode", "disableClose", "autoFocus", "opened"], outputs: ["openedChange", "opened", "openedStart", "closed", "closedStart", "positionChanged"], exportAs: ["matDrawer"] }, { kind: "directive", type: DrawerHostDirective, selector: "[drawerhost]" }, { kind: "directive", type: MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "directive", type: OnemRvaSizeDirective, selector: "mat-icon[size], onemrva-mat-skeleton[size], onemrva-mat-avatar[size], button[size]", inputs: ["size"] }, { kind: "directive", type: OnemRvaColorDirective, selector: "onemrva-mat-selectable-box[color],div[color],onemrva-mat-avatar[color],mat-card[color],mat-toolbar[color],onemrva-mat-spinner[color],onemrva-mat-notification[color],onemrva-mat-task-list[color],onemrva-mat-sticker[color],onemrva-mat-panel[color],onemrva-mat-task[color],onemrva-mat-choice-chip[color],mat-form-field[color],button[color],mat-icon[color],mat-chip[color],mat-chip-option[color]", inputs: ["color"] }, { kind: "ngmodule", type: MatSidenavModule }, { kind: "component", type: i2$1.MatDrawerContent, selector: "mat-drawer-content" }, { kind: "component", type: LayoutLeftSidenavComponent, selector: "onemrva-layout-left-sidenav", inputs: ["items"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'onemrva-layout', standalone: true, imports: [
+                        RouterLink,
+                        NgStyle,
+                        NgClass,
+                        MatToolbar,
+                        MatDrawerContainer,
+                        MatTabNav,
+                        MatTabLink,
+                        RouterLinkActive,
+                        MatTabNavPanel,
+                        MatDivider,
+                        OnemrvaMatAvatarModule,
+                        MatMenuTrigger,
+                        MatMenu,
+                        MatIcon,
+                        MatMenuItem,
+                        NgTemplateOutlet,
+                        TranslatePipe,
+                        MatIconButton,
+                        MatFabButton,
+                        MatTooltip,
+                        MatDrawer,
+                        DrawerHostDirective,
+                        MatRipple,
+                        OnemRvaSizeDirective,
+                        OnemRvaColorDirective,
+                        MatSidenavModule,
+                        LayoutLeftSidenavComponent,
+                    ], template: "<mat-drawer-container\n  id=\"onemrva-drawer-container\"\n  [hasBackdrop]=\"drawerService.hasBackdrop()\"\n  autosize\n>\n  <mat-drawer\n    #mainDrawer\n    [class]=\"drawerService.classes()\"\n    mode=\"over\"\n    position=\"end\"\n  >\n    <ng-template drawerhost></ng-template>\n  </mat-drawer>\n  <mat-drawer-content>\n    <div class=\"app-content\">\n      <header>\n        <mat-toolbar class=\"mat-elevation-z4\">\n          <div class=\"environment\" [class]=\"environment\">\n            {{ environment }}\n          </div>\n          <div class=\"nav-container onemrva-layout-container flex-center g-m\">\n            {{ logoRedictionUrl }}\n            <img\n              class=\"logo align-center clickable\"\n              [src]=\"logo\"\n              [attr.data-cy]=\"\n                'onemrva_logo_' + currentLanguage.toLocaleLowerCase()\n              \"\n              alt=\"Logo ONEM/RVA\"\n              [routerLink]=\"\n                logoRedictionUrl !== null ? logoRedictionUrl : undefined\n              \"\n              [ngStyle]=\"{\n                cursor: logoRedictionUrl !== null ? 'pointer' : 'default',\n              }\"\n            />\n            <div\n              class=\"application-title\"\n              [ngClass]=\"{ 'small-screen': isSmall }\"\n            >\n              @if (title?.template; as titleTpl) {\n                <ng-container *ngTemplateOutlet=\"titleTpl\"></ng-container>\n              }\n            </div>\n\n            <div style=\"flex: 1\"></div>\n\n            @if (!isSmall) {\n              <div\n                class=\"flex-center topMenu\"\n                mat-tab-nav-bar\n                [tabPanel]=\"tabPanel\"\n              >\n                @for (e of routes?.toArray(); track $index) {\n                  <a\n                    mat-tab-link\n                    [routerLink]=\"e.routerLink\"\n                    [attr.data-ci]=\"e.dataCy\"\n                    [attr.data-cy]=\"e.dataCy\"\n                    [routerLinkActiveOptions]=\"{\n                      fragment: 'exact',\n                      matrixParams: 'exact',\n                      paths: 'exact',\n                      queryParams: 'ignored',\n                    }\"\n                    #rla=\"routerLinkActive\"\n                    routerLinkActive=\"mdc-tab--active\"\n                    [active]=\"rla.isActive || e.isRouteActive()\"\n                  >\n                    @if (e.template; as routeTemplate) {\n                      <ng-container\n                        *ngTemplateOutlet=\"routeTemplate\"\n                      ></ng-container>\n                    }\n                  </a>\n                }\n              </div>\n            }\n            <mat-tab-nav-panel #tabPanel></mat-tab-nav-panel>\n\n            @if (showThemeSwitcher) {\n              <button\n                mat-icon-button\n                [matMenuTriggerFor]=\"themeSwitch\"\n                [matTooltip]=\"'layout.mode.select' | translate\"\n              >\n                <mat-icon>{{\n                  activeTheme() === 'dark'\n                    ? 'dark_mode'\n                    : activeTheme() === 'light'\n                      ? 'light_mode'\n                      : 'brightness_auto'\n                }}</mat-icon>\n              </button>\n              <mat-menu #themeSwitch>\n                <button\n                  mat-menu-item\n                  [attr.aria-label]=\"'layout.mode.dark' | translate\"\n                  (click)=\"toggleTheme('dark')\"\n                >\n                  <mat-icon>dark_mode</mat-icon>\n                  <span>{{ 'layout.mode.dark' | translate }}</span>\n                </button>\n                <button\n                  mat-menu-item\n                  [attr.aria-label]=\"'layout.mode.light' | translate\"\n                  (click)=\"toggleTheme('light')\"\n                >\n                  <mat-icon>light_mode</mat-icon>\n                  <span>{{ 'layout.mode.light' | translate }}</span>\n                </button>\n                <button\n                  mat-menu-item\n                  [attr.aria-label]=\"'layout.mode.system' | translate\"\n                  (click)=\"toggleTheme('system')\"\n                >\n                  <mat-icon>brightness_auto</mat-icon>\n                  <span>{{ 'layout.mode.system' | translate }}</span>\n                </button>\n              </mat-menu>\n            }\n            @if (afterNav?.template; as tpl) {\n              <ng-container *ngTemplateOutlet=\"tpl\"></ng-container>\n            }\n\n            @if (profile !== null) {\n              @if (!isSmall) {\n                <mat-divider\n                  vertical\n                  style=\"height: 1em; align-self: center\"\n                ></mat-divider>\n              }\n              @if (profile.isLoggedIn) {\n                <onemrva-mat-avatar\n                  matRipple\n                  [matMenuTriggerFor]=\"menu\"\n                  initials=\"{{ profile.initials() }}\"\n                  color=\"accent\"\n                  size=\"xsmall\"\n                  class=\"clickable\"\n                ></onemrva-mat-avatar>\n              }\n              @if (!profile.isLoggedIn) {\n                <onemrva-mat-avatar\n                  matRipple\n                  [matMenuTriggerFor]=\"menu\"\n                  icon=\"account_circle\"\n                  color=\"\"\n                  size=\"xsmall\"\n                  class=\"clickable\"\n                ></onemrva-mat-avatar>\n              }\n              <mat-menu #menu=\"matMenu\">\n                @if (profile.isLoggedIn) {\n                  <div class=\"menu-header m mb-m\">\n                    {{ profile.firstName }} {{ profile.lastName }}\n                  </div>\n                  <mat-divider style=\"align-self: stretch\"></mat-divider>\n\n                  @if (loginMenu?.template; as menuLoginTpl) {\n                    <ng-container\n                      *ngTemplateOutlet=\"menuLoginTpl\"\n                    ></ng-container>\n                  }\n\n                  <button\n                    type=\"button\"\n                    class=\"mat-mdc-menu-item\"\n                    mat-menu-item\n                    data-cy=\"logoutButton\"\n                    (click)=\"doLogout()\"\n                    [attr.aria-label]=\"'layout.logout' | translate\"\n                  >\n                    <mat-icon>logout</mat-icon>\n                    {{ 'layout.logout' | translate }}\n                  </button>\n                } @else {\n                  <button\n                    type=\"button\"\n                    mat-menu-item\n                    data-cy=\"loginButton\"\n                    (click)=\"doLogin()\"\n                    [attr.aria-label]=\"'layout.login' | translate\"\n                  >\n                    <mat-icon>login</mat-icon>\n                    {{ 'layout.login' | translate }}\n                  </button>\n                }\n              </mat-menu>\n            }\n\n            @if (\n              isSmall &&\n              (routes?.toArray()?.length || (languages && languages.length > 1))\n            ) {\n              <button\n                type=\"button\"\n                mat-icon-button\n                class=\"menu-button\"\n                data-cy=\"smallDeviceMenu\"\n                (click)=\"this.toggleSideNav()\"\n                [attr.aria-label]=\"'layout.menu' | translate\"\n              >\n                <mat-icon>menu</mat-icon>\n              </button>\n            }\n            @if (!isSmall) {\n              <div class=\"flex-center\" mat-tab-nav-bar [tabPanel]=\"tabPanel\">\n                <a\n                  [matMenuTriggerFor]=\"languageMenu\"\n                  data-cy=\"languageMenu\"\n                  [attr.aria-label]=\"'language.selection' | translate\"\n                  mat-tab-link\n                >\n                  {{ currentLanguage }}\n                  <mat-icon style=\"width: 16px\">expand_more</mat-icon>\n                </a>\n              </div>\n            }\n            <mat-menu #languageMenu>\n              @for (lang of languages; track lang.code) {\n                <button\n                  type=\"button\"\n                  class=\"mat-mdc-menu-item\"\n                  mat-menu-item\n                  [attr.data-cy]=\"'language_' + lang.code\"\n                  (click)=\"changeLanguage(lang.code)\"\n                  [attr.aria-label]=\"lang.label\"\n                >\n                  {{ lang.label }}\n                </button>\n              }\n            </mat-menu>\n          </div>\n        </mat-toolbar>\n      </header>\n      <ng-container>\n        @if (content?.template; as tpl) {\n          <div\n            [id]=\"id\"\n            [attr.role]=\"role\"\n            class=\"onemrva-layout-content onemrva-layout-container\"\n          >\n            @if (leftSidenavService.items().length > 0) {\n              <div class=\"container-with-nav\">\n                <div class=\"left-content\">\n                  <onemrva-layout-left-sidenav></onemrva-layout-left-sidenav>\n                </div>\n                <div class=\"right-content\">\n                  <ng-container *ngTemplateOutlet=\"tpl\"></ng-container>\n                </div>\n              </div>\n            } @else {\n              <ng-container *ngTemplateOutlet=\"tpl\"></ng-container>\n            }\n            @if (\n              environment &&\n              (environment === env.LOCAL || environment === env.TEST)\n            ) {\n              <button\n                id=\"accessibility_fab\"\n                mat-fab\n                color=\"accent\"\n                aria-label=\"Accessibility check\"\n                matTooltip=\"Accessibility check\"\n                onclick=\"(function() {var _p='//openfed.github.io/AccessibilityCheck/build/';var _i=function(s,cb) {var sc=document.createElement('script');sc.onload = function() {sc.onload = null;sc.onreadystatechange = null;cb.call(this);};sc.onreadystatechange = function(){if(/^(complete|loaded)$/.test(this.readyState) === true){sc.onreadystatechange = null;sc.onload();}};sc.src=s;if (document.head) {document.head.appendChild(sc);} else {document.getElementsByTagName('head')[0].appendChild(sc);}}; var options={path:_p};_i(_p+'HTMLCS.js',function(){HTMLCSAuditor.run('WCAG2AA',null,options);});})();\"\n              >\n                <mat-icon>accessibility</mat-icon>\n              </button>\n            }\n          </div>\n        }\n\n        <footer class=\"onemrva-footer p mb text-center\">\n          @if (footer?.template; as footerTpl) {\n            <div class=\"onemrva-layout-container\">\n              <ng-container *ngTemplateOutlet=\"footerTpl\"></ng-container>\n            </div>\n          }\n        </footer>\n      </ng-container>\n    </div>\n  </mat-drawer-content>\n</mat-drawer-container>\n", styles: [":host{position:relative}:host a:active{outline:none}:host router-outlet{display:block;margin-bottom:90px}:host header mat-toolbar{position:fixed;height:var(--layout-header-height);z-index:400;--mat-tab-divider-color: transparent}:host header mat-toolbar .topMenu .mat-mdc-tab-header-pagination-before,:host header mat-toolbar .topMenu .mat-mdc-tab-header-pagination-after{display:none!important}:host header mat-toolbar .logo{height:42px}:host header mat-toolbar .application-title{font-size:1.3rem;font-weight:700;height:42px;line-height:42px;color:var(--mat-sys-tertiary)}:host header mat-toolbar .mat-mdc-tab-nav-bar{text-transform:uppercase}:host .onemrva-layout-content{padding-top:var(--layout-content-padding-top);min-height:calc(100vh - 48px)}:host .onemrva-layout-content .container-with-nav{display:flex}:host .onemrva-layout-content .container-with-nav .left-content{flex:0 0 240px}:host .onemrva-layout-content .container-with-nav .right-content{flex:1}:host .mat-drawer-content{min-height:100vh}:host #accessibility_fab{position:fixed;bottom:16px;left:16px}:host .environment{position:fixed;top:0;left:0;z-index:24000;width:60px;height:50px;padding:15px 20px;font-weight:700;font-size:16px;border-radius:0 0 100%;color:#fff;display:none}:host .environment.LOCAL{background:transparent linear-gradient(90deg,#de2174,#eb142a) 0 0 no-repeat padding-box;display:block}:host .environment.TEST{background-color:#36c;display:block}:host .environment.VAL{background-color:#093;display:block}:host mat-drawer:not(.side-menu){padding:var(--double-spacer);background:var(--mat-sys-surface-container-high)}:host mat-drawer.xsmall{width:20%}:host mat-drawer.small{width:30%}:host mat-drawer.medium{width:50%}:host mat-drawer.large{width:60%}:host mat-drawer.xlarge{width:70%}:host mat-drawer.xxlarge{width:90%}@media screen and (max-width: 640px){:host mat-drawer{width:99%!important}}.mat-mdc-menu-content button.active>*{font-weight:700!important}.mat-mdc-menu-content button mat-icon{font-size:1.125rem!important;height:1.125rem;width:1.125rem}.mat-mdc-menu-content button span{font-size:14px!important}nav a.disabled{pointer-events:none}\n"] }]
+        }], ctorParameters: () => [], propDecorators: { routes: [{
+                type: ContentChildren,
+                args: [LayoutRouteComponent]
+            }], title: [{
+                type: ContentChild,
+                args: [LayoutTitleComponent]
+            }], loginMenu: [{
+                type: ContentChild,
+                args: [LayoutLoginMenuComponent]
+            }], content: [{
+                type: ContentChild,
+                args: [LayoutContentComponent]
+            }], afterNav: [{
+                type: ContentChild,
+                args: [LayoutAfterNavComponent]
+            }], footer: [{
+                type: ContentChild,
+                args: [LayoutFooterComponent]
+            }], logo: [{
+                type: Input
+            }], languages: [{
+                type: Input
+            }], environment: [{
+                type: Input
+            }], logoRedictionUrl: [{
+                type: Input
+            }], profile: [{
+                type: Input
+            }], login: [{
+                type: Output
+            }], logout: [{
+                type: Output
+            }], drawer: [{
+                type: ViewChild,
+                args: [MatDrawer, { static: true }]
+            }], drawerHost: [{
+                type: ViewChild,
+                args: [DrawerHostDirective, { static: true }]
+            }], id: [{
+                type: Input
+            }], role: [{
+                type: Input
+            }], showThemeSwitcher: [{
+                type: Input
+            }] } });
+
+class LayoutSidenavTitleComponent {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutSidenavTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: LayoutSidenavTitleComponent, isStandalone: true, selector: "onemrva-layout-sidenav-title", viewQueries: [{ propertyName: "template", first: true, predicate: TemplateRef, descendants: true }], ngImport: i0, template: `
+    <ng-template>
+      <ng-content></ng-content>
+    </ng-template>
+  `, isInline: true }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutSidenavTitleComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'onemrva-layout-sidenav-title',
+                    template: `
+    <ng-template>
+      <ng-content></ng-content>
+    </ng-template>
+  `,
+                    standalone: true,
+                }]
+        }], propDecorators: { template: [{
+                type: ViewChild,
+                args: [TemplateRef]
+            }] } });
+
+class LayoutDrawerActionsComponent {
+    constructor() {
+        this.drawerService = inject(OnemrvaDrawerService);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutDrawerActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: LayoutDrawerActionsComponent, isStandalone: true, selector: "onemrva-drawer-actions", ngImport: i0, template: "<ng-content></ng-content>\n", styles: [":host{width:calc(100% - var(--double-spacer));display:block;padding:var(--spacer);text-align:right}\n"] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutDrawerActionsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'onemrva-drawer-actions', standalone: true, template: "<ng-content></ng-content>\n", styles: [":host{width:calc(100% - var(--double-spacer));display:block;padding:var(--spacer);text-align:right}\n"] }]
+        }] });
+
+class LayoutDrawerContentComponent {
+    constructor() {
+        this.drawerService = inject(OnemrvaDrawerService);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutDrawerContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: LayoutDrawerContentComponent, isStandalone: true, selector: "onemrva-drawer-content", ngImport: i0, template: "<span><ng-content></ng-content></span>\n", styles: [":host{background-color:var(--mat-sys-surface);padding:23px 32px;margin:0 var(--spacer);border-radius:var(--border-radius);display:block;height:calc(100vh - 180px);overflow:auto}\n"] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutDrawerContentComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'onemrva-drawer-content', standalone: true, template: "<span><ng-content></ng-content></span>\n", styles: [":host{background-color:var(--mat-sys-surface);padding:23px 32px;margin:0 var(--spacer);border-radius:var(--border-radius);display:block;height:calc(100vh - 180px);overflow:auto}\n"] }]
+        }] });
+
+class LayoutDrawerTitleComponent {
+    constructor() {
+        this.showClose = true;
+        this.drawerService = inject(OnemrvaDrawerService);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutDrawerTitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: LayoutDrawerTitleComponent, isStandalone: true, selector: "onemrva-drawer-title", inputs: { showClose: "showClose" }, ngImport: i0, template: "<span><ng-content></ng-content></span>\n@if (showClose) {\n  <mat-icon\n    class=\"close-drawer clickable large float-right\"\n    (click)=\"drawerService.close()\"\n    >close</mat-icon\n  >\n}\n", styles: [":host{width:calc(100% - var(--double-spacer));display:block;padding:var(--spacer);margin:var(--spacer)}:host span:first-child{font:var(--mat-sys-title-large);color:var(--mat-sys-error)}\n"], dependencies: [{ kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: LayoutDrawerTitleComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'onemrva-drawer-title', standalone: true, imports: [MatIcon], template: "<span><ng-content></ng-content></span>\n@if (showClose) {\n  <mat-icon\n    class=\"close-drawer clickable large float-right\"\n    (click)=\"drawerService.close()\"\n    >close</mat-icon\n  >\n}\n", styles: [":host{width:calc(100% - var(--double-spacer));display:block;padding:var(--spacer);margin:var(--spacer)}:host span:first-child{font:var(--mat-sys-title-large);color:var(--mat-sys-error)}\n"] }]
+        }], propDecorators: { showClose: [{
+                type: Input
+            }] } });
+
+const layoutComponents = [
+    LayoutComponent,
+    LayoutContentComponent,
+    LayoutFooterComponent,
+    LayoutRouteComponent,
+    LayoutSubrouteComponent,
+    LayoutTitleComponent,
+    LayoutSidenavTitleComponent,
+    LayoutSidenavComponent,
+    LayoutLoginMenuComponent,
+    LayoutAfterNavComponent,
+    LayoutLeftSidenavComponent,
+];
+
+class StripHtmlPipe {
+    transform(value) {
+        return value.replace(/<.*?>/g, ''); // replace tags
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: StripHtmlPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.1.7", ngImport: i0, type: StripHtmlPipe, isStandalone: true, name: "striphtml" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: StripHtmlPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'striphtml',
+                    standalone: true,
+                }]
+        }] });
+
+function CoerceBooleanInput(defaultValue) {
+    return (target, propertyKey) => {
+        Object.defineProperty(target, propertyKey, {
+            get() {
+                return this[propertyKey.toString() + '__underlying_field'];
+            },
+            set(newValue) {
+                const v = newValue === '' || newValue === null || newValue === undefined
+                    ? defaultValue
+                    : coerceBooleanProperty(newValue);
+                this[propertyKey.toString() + '__underlying_field'] = v;
+            },
+        });
+    };
+}
+
+function ObservableContent() {
+    return (target, propertyKey) => {
+        const value = new BehaviorSubject(undefined);
+        Object.defineProperty(target, propertyKey, {
+            get: () => value,
+            set: (v) => {
+                value.next(v);
+            },
+        });
+    };
+}
+
+class OnemRvaProfile {
+    constructor(...args) {
+        this._isLoggedIn = false;
+        this._firstName = '';
+        this._lastName = '';
+        if (args.length === 2) {
+            this._firstName = args[0];
+            this._lastName = args[1];
+            this._isLoggedIn = true;
+        }
+    }
+    initials() {
+        if (this._firstName === '' || this._lastName === '')
+            return '';
+        return `${this._firstName.slice(0, 1)}${this._lastName.slice(0, 1)}`;
+    }
+    get firstName() {
+        return this._firstName;
+    }
+    set firstName(value) {
+        this._firstName = value;
+    }
+    get lastName() {
+        return this._lastName;
+    }
+    set lastName(value) {
+        this._lastName = value;
+    }
+    get isLoggedIn() {
+        return this._isLoggedIn;
+    }
+    set isLoggedIn(value) {
+        this._isLoggedIn = value;
+    }
+    login(firstName, lastName) {
+        this._firstName = firstName;
+        this._lastName = lastName;
+        this._isLoggedIn = true;
+    }
+    logout() {
+        this._firstName = '';
+        this._lastName = '';
+        this._isLoggedIn = false;
+    }
+}
+
+class OnemrvaLayoutModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: OnemrvaLayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.1.7", ngImport: i0, type: OnemrvaLayoutModule, imports: [LayoutComponent, LayoutContentComponent, LayoutFooterComponent, LayoutRouteComponent, LayoutSubrouteComponent, LayoutTitleComponent, LayoutSidenavTitleComponent, LayoutSidenavComponent, LayoutLoginMenuComponent, LayoutAfterNavComponent, LayoutLeftSidenavComponent, StripHtmlPipe,
+            DrawerHostDirective,
+            CommonModule,
+            RouterModule,
+            LayoutModule,
+            MatToolbarModule,
+            MatDividerModule,
+            MatSidenavModule,
+            MatTabsModule,
+            MatButtonModule,
+            MatMenuModule,
+            MatIconModule,
+            OnemrvaMatAvatarModule,
+            MatTooltipModule,
+            TranslateModule,
+            MatRipple], exports: [LayoutComponent, LayoutContentComponent, LayoutFooterComponent, LayoutRouteComponent, LayoutSubrouteComponent, LayoutTitleComponent, LayoutSidenavTitleComponent, LayoutSidenavComponent, LayoutLoginMenuComponent, LayoutAfterNavComponent, LayoutLeftSidenavComponent, LayoutModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: OnemrvaLayoutModule, providers: [
+            {
+                provide: MAT_SNACK_BAR_DEFAULT_OPTIONS,
+                useValue: { horizontalPosition: 'right' },
+            },
+        ], imports: [LayoutComponent, LayoutRouteComponent, LayoutSidenavComponent, LayoutLeftSidenavComponent, CommonModule,
+            RouterModule,
+            LayoutModule,
+            MatToolbarModule,
+            MatDividerModule,
+            MatSidenavModule,
+            MatTabsModule,
+            MatButtonModule,
+            MatMenuModule,
+            MatIconModule,
+            OnemrvaMatAvatarModule,
+            MatTooltipModule,
+            TranslateModule, LayoutModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: OnemrvaLayoutModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [],
+                    imports: [
+                        ...layoutComponents,
+                        StripHtmlPipe,
+                        DrawerHostDirective,
+                        CommonModule,
+                        RouterModule,
+                        LayoutModule,
+                        MatToolbarModule,
+                        MatDividerModule,
+                        MatSidenavModule,
+                        MatTabsModule,
+                        MatButtonModule,
+                        MatMenuModule,
+                        MatIconModule,
+                        OnemrvaMatAvatarModule,
+                        MatTooltipModule,
+                        TranslateModule,
+                        MatRipple,
+                    ],
+                    exports: [...layoutComponents, LayoutModule],
+                    providers: [
+                        {
+                            provide: MAT_SNACK_BAR_DEFAULT_OPTIONS,
+                            useValue: { horizontalPosition: 'right' },
+                        },
+                    ],
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { CoerceBooleanInput, DrawerHostDirective, Environment, LayoutAfterNavComponent, LayoutComponent, LayoutContentComponent, LayoutDrawerActionsComponent, LayoutDrawerContentComponent, LayoutDrawerTitleComponent, LayoutFooterComponent, LayoutLeftSidenavComponent, LayoutLoginMenuComponent, LayoutRouteComponent, LayoutSidenavComponent, LayoutSidenavTitleComponent, LayoutSubrouteComponent, LayoutTitleComponent, ObservableContent, OnemRvaProfile, OnemrvaDrawerService, OnemrvaLayoutModule, OnemrvaLeftSidenavService, StripHtmlPipe, layoutComponents };
+//# sourceMappingURL=onemrvapublic-design-system-layout.mjs.map