@onemrvapublic/design-system 20.5.1-develop.1 → 20.5.1-develop.3

package/fesm2022/onemrvapublic-design-system.mjs

@@ -1,41 +1,41 @@
 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, ElementRef, Renderer2, HostListener, ViewEncapsulation, forwardRef, ChangeDetectionStrategy, InjectionToken, input, QueryList, output, ComponentFactoryResolver, HostAttributeToken, NgZone, RendererFactory2, ErrorHandler } from '@angular/core';
-import { Router, RouterLink, RouterLinkActive, NavigationEnd, RouterModule, ActivatedRoute } from '@angular/router';
+import { signal, Injectable, inject, effect, HostBinding, Input, Component, ChangeDetectorRef, TemplateRef, ContentChildren, ViewChild, Pipe, DestroyRef, ViewContainerRef, DOCUMENT, Directive, EventEmitter, isDevMode, Output, ContentChild, NgModule, ElementRef, Renderer2, HostListener, ViewEncapsulation, forwardRef, ChangeDetectionStrategy, InjectionToken, input, QueryList, output, ComponentFactoryResolver, HostAttributeToken, NgZone, RendererFactory2, ErrorHandler } from '@angular/core';
+import { Subject, takeUntil, startWith, BehaviorSubject, of, interval, take, map, catchError, tap, mergeMap, withLatestFrom, filter as filter$1, throttle, takeWhile, switchMap, forkJoin, merge, debounceTime, combineLatest, combineLatestWith, zip, pairwise, distinctUntilChanged, ReplaySubject, Subscription, timer, NEVER, shareReplay, finalize, skip, from } from 'rxjs';
+import { BreakpointObserver, Breakpoints, LayoutModule } from '@angular/cdk/layout';
 import * as i1$2 from '@angular/common';
 import { NgTemplateOutlet, NgClass, DOCUMENT as DOCUMENT$1, NgStyle, CommonModule, NgOptimizedImage, AsyncPipe, Location } from '@angular/common';
+import * as i2$1 from '@angular/material/sidenav';
+import { MatDrawer, MatDrawerContainer, MatSidenavModule } from '@angular/material/sidenav';
+import { ONEMRVA_THEME_CLASS as ONEMRVA_THEME_CLASS$1, OnemRvaCDNService as OnemRvaCDNService$1, OnemRvaSizeDirective as OnemRvaSizeDirective$1, OnemRvaColorDirective as OnemRvaColorDirective$1, OnemRvaCDNMimeService as OnemRvaCDNMimeService$1, OnemRvaOSMService as OnemRvaOSMService$1, CommonCountryLookupService as CommonCountryLookupService$1, OnemRvaCDNCountryService as OnemRvaCDNCountryService$1, IBAN_SUPPORTED_COUNTRIES as IBAN_SUPPORTED_COUNTRIES$1, SEPA_ONLY_SUPPORTED_COUNTRIES as SEPA_ONLY_SUPPORTED_COUNTRIES$1 } from '@onemrvapublic/design-system/shared';
+import { Router, RouterLink, RouterLinkActive, RouterModule, NavigationEnd, ActivatedRoute } from '@angular/router';
+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 as OnemrvaMatAvatarModule$1 } from '@onemrvapublic/design-system/mat-avatar';
+import { MatMenu, MatMenuTrigger, MatMenuItem, MatMenuModule } from '@angular/material/menu';
 import * as i1$3 from '@angular/material/icon';
 import { MatIcon, MatIconModule } from '@angular/material/icon';
-import { MatMenu, MatMenuTrigger, MatMenuItem, MatMenuModule } from '@angular/material/menu';
+import * as i1$4 from '@angular/material/button';
+import { MatIconButton, MatFabButton, MatButtonModule, MatButton, MatMiniFabButton } from '@angular/material/button';
+import * as i2$2 from '@angular/material/tooltip';
+import { MatTooltip, MatTooltipModule } from '@angular/material/tooltip';
+import { MatRipple, DateAdapter, MAT_DATE_FORMATS, MatOption, ErrorStateMatcher, NativeDateAdapter, MAT_DATE_LOCALE } from '@angular/material/core';
+import { OnemrvaMatNavigationComponent as OnemrvaMatNavigationComponent$1 } from '@onemrvapublic/design-system/mat-navigation';
 import * as i6 from '@ngx-translate/core';
 import { TranslateService, TranslatePipe, TranslateModule } from '@ngx-translate/core';
-import { Subject, takeUntil, startWith, BehaviorSubject, of, interval, take, map, catchError, tap, mergeMap, withLatestFrom, filter as filter$1, throttle, takeWhile, switchMap, forkJoin, merge, debounceTime, combineLatest, combineLatestWith, zip, pairwise, distinctUntilChanged, ReplaySubject, Subscription, timer, NEVER, shareReplay, finalize, skip, from } 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, map as map$1, switchMap as switchMap$1, startWith as startWith$1, delay, takeUntil as takeUntil$1, take as take$1, tap as tap$1, first, catchError as catchError$1 } from 'rxjs/operators';
 import { trigger, state, transition, style, animate, AnimationBuilder, keyframes } from '@angular/animations';
-import * as i1$4 from '@angular/material/button';
-import { MatIconButton, MatFabButton, MatButtonModule, MatButton, MatMiniFabButton } from '@angular/material/button';
-import { OnemrvaMatNavigationComponent as OnemrvaMatNavigationComponent$1 } from '@onemrvapublic/design-system/mat-navigation';
 import * as i1 from '@angular/material/form-field';
 import { MatFormFieldModule, MatFormFieldControl, MatError, MatFormField, MatLabel, MAT_FORM_FIELD_DEFAULT_OPTIONS } from '@angular/material/form-field';
 import * as i2 from '@angular/material/select';
 import { MatSelectModule, MatSelect, MatOption as MatOption$1 } from '@angular/material/select';
 import * as i4 from '@angular/forms';
 import { FormsModule, NG_VALUE_ACCESSOR, ReactiveFormsModule, FormGroup, FormControl, Validators, FormBuilder, NgControl, NgForm, FormGroupDirective } from '@angular/forms';
-import { ONEMRVA_THEME_CLASS as ONEMRVA_THEME_CLASS$1, OnemRvaCDNService as OnemRvaCDNService$1, OnemRvaSizeDirective as OnemRvaSizeDirective$1, OnemRvaColorDirective as OnemRvaColorDirective$1, OnemRvaCDNMimeService as OnemRvaCDNMimeService$1, OnemRvaOSMService as OnemRvaOSMService$1, CommonCountryLookupService as CommonCountryLookupService$1, OnemRvaCDNCountryService as OnemRvaCDNCountryService$1, IBAN_SUPPORTED_COUNTRIES as IBAN_SUPPORTED_COUNTRIES$1, SEPA_ONLY_SUPPORTED_COUNTRIES as SEPA_ONLY_SUPPORTED_COUNTRIES$1 } 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 as OnemrvaMatAvatarModule$1 } from '@onemrvapublic/design-system/mat-avatar';
-import * as i2$2 from '@angular/material/tooltip';
-import { MatTooltip, MatTooltipModule } from '@angular/material/tooltip';
-import { MatRipple, DateAdapter, MAT_DATE_FORMATS, MatOption, ErrorStateMatcher, NativeDateAdapter, MAT_DATE_LOCALE } from '@angular/material/core';
 import { coerceBooleanProperty } from '@angular/cdk/coercion';
 import { MAT_SNACK_BAR_DEFAULT_OPTIONS, MAT_SNACK_BAR_DATA, MatSnackBarModule } from '@angular/material/snack-bar';
 import { mkenum, OnemrvaMatColor, OnemrvaMatSize } from '@onemrvapublic/design-system/utils';
+import { filter, map as map$1, switchMap as switchMap$1, startWith as startWith$1, delay, takeUntil as takeUntil$1, take as take$1, tap as tap$1, first, catchError as catchError$1 } from 'rxjs/operators';
 import { MatCheckbox } from '@angular/material/checkbox';
 import { Clipboard } from '@angular/cdk/clipboard';
 import { FlagIconComponent as FlagIconComponent$1 } from '@onemrvapublic/design-system/flag-icon';
@@ -73,6 +73,61 @@ import { ComponentPortal } from '@angular/cdk/portal';
 import { Overlay, OverlayPositionBuilder, OverlayContainer } from '@angular/cdk/overlay';
 import { __decorate } from 'tslib';
 
+class OnemrvaLeftSidenavService {
+    constructor() {
+        this.originalItems = [];
+        this.items = signal([], ...(ngDevMode ? [{ debugName: "items" }] : []));
+    }
+    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',
+                }]
+        }] });
+
+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$1, 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$1], 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 LayoutSubrouteComponent {
     constructor() {
         this.cd = inject(ChangeDetectorRef);
@@ -291,6 +346,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
                 args: [TemplateRef]
             }] } });
 
+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,
+                }]
+        }] });
+
 // Command to generate ng g d <Directive name>
 class DrawerHostDirective {
     constructor() {
@@ -371,36 +441,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
                 }]
         }] });
 
-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 = [];
@@ -526,35 +566,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
                 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$1, 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$1], 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);
@@ -823,21 +834,6 @@ const layoutComponents = [
     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, {
@@ -4413,7 +4409,7 @@ class OnemrvaMatNavigationItemComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: OnemrvaMatNavigationItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: OnemrvaMatNavigationItemComponent, isStandalone: true, selector: "onemrva-mat-navigation-item", inputs: { routerLink: "routerLink", routerLinkActiveOptions: "routerLinkActiveOptions", dataCy: "dataCy", baseRouteForActiveMenu: "baseRouteForActiveMenu", label: "label", icon: "icon", level: "level", highlighted: "highlighted", opened: "opened", children: "children", customNgClass: "customNgClass", translate: "translate" }, host: { properties: { "class.highlighted": "this.isHighlighted", "class.highlighted2": "this.isHighlighted2" } }, viewQueries: [{ propertyName: "matExpansionPanel", first: true, predicate: MatExpansionPanel, descendants: true }], ngImport: i0, template: "@if (routerLink) {\n  <button\n    [routerLink]=\"routerLink\"\n    [attr.data-cy]=\"dataCy\"\n    [routerLinkActiveOptions]=\"{ exact: true }\"\n    routerLinkActive=\"active\"\n    class=\"mobile-menu-item\"\n  >\n    @for (indent of indentArray; track $index) {\n      <span class=\"indent-spacer\"></span>\n    }\n    @if (icon) {\n      <mat-icon>{{ icon }}</mat-icon>\n    }\n    @if (translate && label.trim() !== '') {\n      <span [innerHTML]=\"label | translate\"></span>\n    } @else {\n      <span [innerHTML]=\"label\"></span>\n    }\n  </button>\n} @else {\n  <button\n    [ngClass]=\"{ 'mobile-menu-item': true, highlighted: highlighted === true }\"\n    [attr.data-cy]=\"dataCy\"\n    (click)=\"subMenu.toggle()\"\n  >\n    @for (indent of indentArray; track $index) {\n      <span class=\"indent-spacer\"></span>\n    }\n\n    @if (icon) {\n      <mat-icon>{{ icon }}</mat-icon>\n    }\n\n    @if (translate && label.trim() !== '') {\n      <span [innerHTML]=\"label | translate\"></span>\n    } @else {\n      <span [innerHTML]=\"label\"></span>\n    }\n\n    <mat-icon [ngClass]=\"{ end: true, opened: subMenu.expanded }\"\n      >arrow_drop_down</mat-icon\n    >\n  </button>\n  <mat-expansion-panel #subMenu [expanded]=\"opened\">\n    <ng-content></ng-content>\n  </mat-expansion-panel>\n}\n", styles: [":host.highlighted2 .mobile-menu-item{transition:border-left .4s ease;border-left:.5rem solid var(--mat-sys-tertiary-container)}:host.highlighted .mobile-menu-item{transition:border-left .4s ease;border-left:.5rem solid var(--mat-sys-tertiary)}:host .mobile-menu-item{display:flex;width:100%;background:var(--mat-sys-background);padding:var(--double-spacer) var(--quad-spacer);border:none;box-shadow:none;align-items:center;text-align:left;cursor:pointer;font:var(--mat-sys-body-medium);text-decoration:none;color:var(--mat-sys-on-surface);border-left:.5rem solid transparent}:host .mobile-menu-item.active button{border-left:.5rem solid var(--mat-sys-tertiary);font-weight:600;background:var(--mat-sys-surface-container-low)}:host .mobile-menu-item.active button mat-icon{font-variation-settings:\"FILL\" 1,\"wght\" 600,\"GRAD\" 0,\"opsz\" 24}:host .mobile-menu-item:hover,:host .mobile-menu-item:focus{background:var(--mat-sys-surface-container-low)}:host .mobile-menu-item mat-icon{margin-left:-4px;margin-right:var(--spacer);transition:transform .3s ease}:host .mobile-menu-item mat-icon.opened{transform:rotate(180deg)}:host .mobile-menu-item mat-icon.end{margin-left:auto}:host .mobile-menu-item .indent-spacer{width:var(--double-spacer);flex-shrink:0}\n"], dependencies: [{ kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: OnemrvaMatNavigationItemComponent, isStandalone: true, selector: "onemrva-mat-navigation-item", inputs: { routerLink: "routerLink", routerLinkActiveOptions: "routerLinkActiveOptions", dataCy: "dataCy", baseRouteForActiveMenu: "baseRouteForActiveMenu", label: "label", icon: "icon", level: "level", highlighted: "highlighted", opened: "opened", children: "children", customNgClass: "customNgClass", translate: "translate" }, host: { properties: { "class.highlighted": "this.isHighlighted", "class.highlighted2": "this.isHighlighted2" } }, viewQueries: [{ propertyName: "matExpansionPanel", first: true, predicate: MatExpansionPanel, descendants: true }], ngImport: i0, template: "@if (routerLink) {\n  <button\n    [routerLink]=\"routerLink\"\n    [attr.data-cy]=\"dataCy\"\n    [routerLinkActiveOptions]=\"{ exact: true }\"\n    routerLinkActive=\"active\"\n    class=\"mobile-menu-item\"\n  >\n    @for (indent of indentArray; track $index) {\n      <span class=\"indent-spacer\"></span>\n    }\n    @if (icon) {\n      <mat-icon>{{ icon }}</mat-icon>\n    }\n    @if (translate && label.trim() !== '') {\n      <span [innerHTML]=\"label | translate\"></span>\n    } @else {\n      <span [innerHTML]=\"label\"></span>\n    }\n  </button>\n} @else {\n  <button\n    [ngClass]=\"{ 'mobile-menu-item': true, highlighted: highlighted === true }\"\n    [attr.data-cy]=\"dataCy\"\n    (click)=\"subMenu.toggle()\"\n  >\n    @for (indent of indentArray; track $index) {\n      <span class=\"indent-spacer\"></span>\n    }\n\n    @if (icon) {\n      <mat-icon>{{ icon }}</mat-icon>\n    }\n\n    @if (translate && label.trim() !== '') {\n      <span [innerHTML]=\"label | translate\"></span>\n    } @else {\n      <span [innerHTML]=\"label\"></span>\n    }\n\n    <mat-icon [ngClass]=\"{ end: true, opened: subMenu.expanded }\"\n      >arrow_drop_down</mat-icon\n    >\n  </button>\n  <mat-expansion-panel #subMenu [expanded]=\"opened\">\n    <ng-content></ng-content>\n  </mat-expansion-panel>\n}\n", styles: [":host.highlighted2 .mobile-menu-item{transition:border-left .4s ease;border-left:.5rem solid var(--mat-sys-tertiary-container)}:host.highlighted .mobile-menu-item{transition:border-left .4s ease;border-left:.5rem solid var(--mat-sys-tertiary)}:host .mobile-menu-item{display:flex;width:100%;background:var(--mat-sys-background);padding:var(--double-spacer) var(--quad-spacer);border:none;box-shadow:none;align-items:center;text-align:left;cursor:pointer;font:var(--mat-sys-body-medium);text-decoration:none;color:var(--mat-sys-on-surface);border-left:.5rem solid transparent}:host .mobile-menu-item.active{border-left:.5rem solid var(--mat-sys-tertiary);font-weight:600;background:var(--mat-sys-surface-container-low)}:host .mobile-menu-item.active mat-icon{font-variation-settings:\"FILL\" 1,\"wght\" 600,\"GRAD\" 0,\"opsz\" 24}:host .mobile-menu-item:hover,:host .mobile-menu-item:focus{background:var(--mat-sys-surface-container-low)}:host .mobile-menu-item mat-icon{margin-left:-4px;margin-right:var(--spacer);transition:transform .3s ease}:host .mobile-menu-item mat-icon.opened{transform:rotate(180deg)}:host .mobile-menu-item mat-icon.end{margin-left:auto}:host .mobile-menu-item .indent-spacer{width:var(--double-spacer);flex-shrink:0}\n"], dependencies: [{ kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: OnemrvaMatNavigationItemComponent, decorators: [{
             type: Component,
@@ -4424,7 +4420,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImpor
                         MatExpansionPanel,
                         NgClass,
                         TranslatePipe,
-                    ], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (routerLink) {\n  <button\n    [routerLink]=\"routerLink\"\n    [attr.data-cy]=\"dataCy\"\n    [routerLinkActiveOptions]=\"{ exact: true }\"\n    routerLinkActive=\"active\"\n    class=\"mobile-menu-item\"\n  >\n    @for (indent of indentArray; track $index) {\n      <span class=\"indent-spacer\"></span>\n    }\n    @if (icon) {\n      <mat-icon>{{ icon }}</mat-icon>\n    }\n    @if (translate && label.trim() !== '') {\n      <span [innerHTML]=\"label | translate\"></span>\n    } @else {\n      <span [innerHTML]=\"label\"></span>\n    }\n  </button>\n} @else {\n  <button\n    [ngClass]=\"{ 'mobile-menu-item': true, highlighted: highlighted === true }\"\n    [attr.data-cy]=\"dataCy\"\n    (click)=\"subMenu.toggle()\"\n  >\n    @for (indent of indentArray; track $index) {\n      <span class=\"indent-spacer\"></span>\n    }\n\n    @if (icon) {\n      <mat-icon>{{ icon }}</mat-icon>\n    }\n\n    @if (translate && label.trim() !== '') {\n      <span [innerHTML]=\"label | translate\"></span>\n    } @else {\n      <span [innerHTML]=\"label\"></span>\n    }\n\n    <mat-icon [ngClass]=\"{ end: true, opened: subMenu.expanded }\"\n      >arrow_drop_down</mat-icon\n    >\n  </button>\n  <mat-expansion-panel #subMenu [expanded]=\"opened\">\n    <ng-content></ng-content>\n  </mat-expansion-panel>\n}\n", styles: [":host.highlighted2 .mobile-menu-item{transition:border-left .4s ease;border-left:.5rem solid var(--mat-sys-tertiary-container)}:host.highlighted .mobile-menu-item{transition:border-left .4s ease;border-left:.5rem solid var(--mat-sys-tertiary)}:host .mobile-menu-item{display:flex;width:100%;background:var(--mat-sys-background);padding:var(--double-spacer) var(--quad-spacer);border:none;box-shadow:none;align-items:center;text-align:left;cursor:pointer;font:var(--mat-sys-body-medium);text-decoration:none;color:var(--mat-sys-on-surface);border-left:.5rem solid transparent}:host .mobile-menu-item.active button{border-left:.5rem solid var(--mat-sys-tertiary);font-weight:600;background:var(--mat-sys-surface-container-low)}:host .mobile-menu-item.active button mat-icon{font-variation-settings:\"FILL\" 1,\"wght\" 600,\"GRAD\" 0,\"opsz\" 24}:host .mobile-menu-item:hover,:host .mobile-menu-item:focus{background:var(--mat-sys-surface-container-low)}:host .mobile-menu-item mat-icon{margin-left:-4px;margin-right:var(--spacer);transition:transform .3s ease}:host .mobile-menu-item mat-icon.opened{transform:rotate(180deg)}:host .mobile-menu-item mat-icon.end{margin-left:auto}:host .mobile-menu-item .indent-spacer{width:var(--double-spacer);flex-shrink:0}\n"] }]
+                    ], standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (routerLink) {\n  <button\n    [routerLink]=\"routerLink\"\n    [attr.data-cy]=\"dataCy\"\n    [routerLinkActiveOptions]=\"{ exact: true }\"\n    routerLinkActive=\"active\"\n    class=\"mobile-menu-item\"\n  >\n    @for (indent of indentArray; track $index) {\n      <span class=\"indent-spacer\"></span>\n    }\n    @if (icon) {\n      <mat-icon>{{ icon }}</mat-icon>\n    }\n    @if (translate && label.trim() !== '') {\n      <span [innerHTML]=\"label | translate\"></span>\n    } @else {\n      <span [innerHTML]=\"label\"></span>\n    }\n  </button>\n} @else {\n  <button\n    [ngClass]=\"{ 'mobile-menu-item': true, highlighted: highlighted === true }\"\n    [attr.data-cy]=\"dataCy\"\n    (click)=\"subMenu.toggle()\"\n  >\n    @for (indent of indentArray; track $index) {\n      <span class=\"indent-spacer\"></span>\n    }\n\n    @if (icon) {\n      <mat-icon>{{ icon }}</mat-icon>\n    }\n\n    @if (translate && label.trim() !== '') {\n      <span [innerHTML]=\"label | translate\"></span>\n    } @else {\n      <span [innerHTML]=\"label\"></span>\n    }\n\n    <mat-icon [ngClass]=\"{ end: true, opened: subMenu.expanded }\"\n      >arrow_drop_down</mat-icon\n    >\n  </button>\n  <mat-expansion-panel #subMenu [expanded]=\"opened\">\n    <ng-content></ng-content>\n  </mat-expansion-panel>\n}\n", styles: [":host.highlighted2 .mobile-menu-item{transition:border-left .4s ease;border-left:.5rem solid var(--mat-sys-tertiary-container)}:host.highlighted .mobile-menu-item{transition:border-left .4s ease;border-left:.5rem solid var(--mat-sys-tertiary)}:host .mobile-menu-item{display:flex;width:100%;background:var(--mat-sys-background);padding:var(--double-spacer) var(--quad-spacer);border:none;box-shadow:none;align-items:center;text-align:left;cursor:pointer;font:var(--mat-sys-body-medium);text-decoration:none;color:var(--mat-sys-on-surface);border-left:.5rem solid transparent}:host .mobile-menu-item.active{border-left:.5rem solid var(--mat-sys-tertiary);font-weight:600;background:var(--mat-sys-surface-container-low)}:host .mobile-menu-item.active mat-icon{font-variation-settings:\"FILL\" 1,\"wght\" 600,\"GRAD\" 0,\"opsz\" 24}:host .mobile-menu-item:hover,:host .mobile-menu-item:focus{background:var(--mat-sys-surface-container-low)}:host .mobile-menu-item mat-icon{margin-left:-4px;margin-right:var(--spacer);transition:transform .3s ease}:host .mobile-menu-item mat-icon.opened{transform:rotate(180deg)}:host .mobile-menu-item mat-icon.end{margin-left:auto}:host .mobile-menu-item .indent-spacer{width:var(--double-spacer);flex-shrink:0}\n"] }]
         }], propDecorators: { routerLink: [{
                 type: Input
             }], routerLinkActiveOptions: [{