@recursyve/nice-ui-kit.v2 17.0.0-beta.140 → 18.0.0-beta.144

package/esm2022/lib/components/lottie/lottie.component.mjs

@@ -28,10 +28,10 @@ export class NiceLottieComponent {
         const anim = this._lottie.loadAnimation(this._options);
         this.animCreated.emit(anim);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceLottieComponent, deps: [{ token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.10", type: NiceLottieComponent, selector: "nice-lottie", inputs: { options: "options", width: "width", height: "height" }, outputs: { animCreated: "animCreated" }, viewQueries: [{ propertyName: "animationContainer", first: true, predicate: ["animationContainer"], descendants: true }], ngImport: i0, template: "<div #animationContainer\n     [ngStyle]=\"{'width': viewWidth, 'height': viewHeight, 'overflow':'hidden', 'margin': '0 auto'}\">\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceLottieComponent, deps: [{ token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: NiceLottieComponent, selector: "nice-lottie", inputs: { options: "options", width: "width", height: "height" }, outputs: { animCreated: "animCreated" }, viewQueries: [{ propertyName: "animationContainer", first: true, predicate: ["animationContainer"], descendants: true }], ngImport: i0, template: "<div #animationContainer\n     [ngStyle]=\"{'width': viewWidth, 'height': viewHeight, 'overflow':'hidden', 'margin': '0 auto'}\">\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceLottieComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceLottieComponent, decorators: [{
             type: Component,
             args: [{ selector: "nice-lottie", template: "<div #animationContainer\n     [ngStyle]=\"{'width': viewWidth, 'height': viewHeight, 'overflow':'hidden', 'margin': '0 auto'}\">\n</div>\n" }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{

package/esm2022/lib/components/lottie/lottie.module.mjs

@@ -3,11 +3,11 @@ import { NiceLottieComponent } from "./lottie.component";
 import { CommonModule } from "@angular/common";
 import * as i0 from "@angular/core";
 export class NiceLottieModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceLottieModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.10", ngImport: i0, type: NiceLottieModule, declarations: [NiceLottieComponent], imports: [CommonModule], exports: [NiceLottieComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceLottieModule, imports: [CommonModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceLottieModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: NiceLottieModule, declarations: [NiceLottieComponent], imports: [CommonModule], exports: [NiceLottieComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceLottieModule, imports: [CommonModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceLottieModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceLottieModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule],

package/esm2022/lib/components/navigation/components/hint-component-base.mjs

@@ -108,10 +108,10 @@ export class _HintComponentBase {
             this._onShow();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: _HintComponentBase, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.10", type: _HintComponentBase, host: { listeners: { "mouseleave": "_handleMouseLeave($event)" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _HintComponentBase, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: _HintComponentBase, host: { listeners: { "mouseleave": "_handleMouseLeave($event)" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: _HintComponentBase, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: _HintComponentBase, decorators: [{
             type: Directive
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { _handleMouseLeave: [{
                 type: HostListener,

package/esm2022/lib/components/navigation/directives/show-hint.directive.mjs

@@ -173,10 +173,10 @@ export class NiceShowHintDirective {
             this._elementRef.nativeElement.addEventListener(event, listener);
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceShowHintDirective, deps: [{ token: i1.Overlay }, { token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: i0.NgZone }, { token: i2.Platform }, { token: i3.FocusMonitor }, { token: i4.NiceNavigationHintService }], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.10", type: NiceShowHintDirective, selector: "[niceShowHint]", inputs: { shouldShow: "shouldShow", item: "item" }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceShowHintDirective, deps: [{ token: i1.Overlay }, { token: i0.ElementRef }, { token: i0.ViewContainerRef }, { token: i0.NgZone }, { token: i2.Platform }, { token: i3.FocusMonitor }, { token: i4.NiceNavigationHintService }], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: NiceShowHintDirective, selector: "[niceShowHint]", inputs: { shouldShow: "shouldShow", item: "item" }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceShowHintDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceShowHintDirective, decorators: [{
             type: Directive,
             args: [{ selector: "[niceShowHint]" }]
         }], ctorParameters: () => [{ type: i1.Overlay }, { type: i0.ElementRef }, { type: i0.ViewContainerRef }, { type: i0.NgZone }, { type: i2.Platform }, { type: i3.FocusMonitor }, { type: i4.NiceNavigationHintService }], propDecorators: { shouldShow: [{

package/esm2022/lib/components/navigation/horizontal/components/basic/basic.component.mjs

@@ -44,10 +44,10 @@ export class NiceHorizontalNavigationBasicItemComponent {
         this._unsubscribeAll.next(null);
         this._unsubscribeAll.complete();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceHorizontalNavigationBasicItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.NiceNavigationService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.10", type: NiceHorizontalNavigationBasicItemComponent, selector: "nice-horizontal-navigation-basic-item", inputs: { item: "item", name: "name", showTooltips: "showTooltips", tooltipPosition: "tooltipPosition" }, ngImport: i0, template: "<!-- Item wrapper -->\n<div\n    class=\"nice-horizontal-navigation-item-wrapper\"\n    [class.nice-horizontal-navigation-item-has-subtitle]=\"!!item.subtitle\"\n    [ngClass]=\"item.classes?.wrapper\"\n    [matTooltip]=\"item.tooltip | niceTranslateWithContext\"\n    [matTooltipDisabled]=\"!showTooltips\"\n    [matTooltipPosition]=\"tooltipPosition\"\n>\n    <!-- Item with an internal link -->\n    <div\n        class=\"nice-horizontal-navigation-item\"\n        *ngIf=\"item.link && !item.externalLink && !item.function && !item.disabled\"\n        [ngClass]=\"{ 'nice-horizontal-navigation-item-active-forced': item.active }\"\n        [routerLink]=\"[item.link]\"\n        [routerLinkActive]=\"'nice-horizontal-navigation-item-active'\"\n        [routerLinkActiveOptions]=\"{ exact: item.exactMatch || false }\"\n        [queryParams]=\"item?.queryParams\"\n        [state]=\"item?.state\"\n    >\n        <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n    </div>\n\n    <!-- Item with an external link -->\n    <a\n        class=\"nice-horizontal-navigation-item\"\n        *ngIf=\"item.link && item.externalLink && !item.function && !item.disabled\"\n        [href]=\"item.link\"\n    >\n        <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n    </a>\n\n    <!-- Item with a function -->\n    <div\n        class=\"nice-horizontal-navigation-item\"\n        *ngIf=\"!item.link && item.function && !item.disabled\"\n        [ngClass]=\"{ 'nice-horizontal-navigation-item-active-forced': item.active }\"\n        (click)=\"item.function(item)\">\n        <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n    </div>\n\n    <!-- Item with an internal link and function -->\n    <div\n        class=\"nice-horizontal-navigation-item\"\n        *ngIf=\"item.link && !item.externalLink && item.function && !item.disabled\"\n        [ngClass]=\"{ 'nice-horizontal-navigation-item-active-forced': item.active }\"\n        [routerLink]=\"[item.link]\"\n        [routerLinkActive]=\"'nice-horizontal-navigation-item-active'\"\n        [routerLinkActiveOptions]=\"{ exact: item.exactMatch || false }\"\n        [queryParams]=\"item?.queryParams\"\n        [state]=\"item?.state\"\n        (click)=\"item.function(item)\"\n    >\n        <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n    </div>\n\n    <!-- Item with an external link and function -->\n    <a\n        class=\"nice-horizontal-navigation-item\"\n        *ngIf=\"item.link && item.externalLink && item.function && !item.disabled\"\n        [href]=\"item.link\"\n        (click)=\"item.function(item)\"\n        mat-menu-item\n    >\n        <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n    </a>\n\n    <!-- Item with a no link and no function -->\n    <div\n        class=\"nice-horizontal-navigation-item\"\n        *ngIf=\"!item.link && !item.function && !item.disabled\"\n        [ngClass]=\"{'nice-horizontal-navigation-item-active-forced': item.active}\"\n    >\n        <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n    </div>\n\n    <!-- Item is disabled -->\n    <div\n        class=\"nice-horizontal-navigation-item nice-horizontal-navigation-item-disabled\"\n        *ngIf=\"item.disabled\"\n    >\n        <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n    </div>\n</div>\n\n<!-- Item template -->\n<ng-template #itemTemplate>\n    <!-- Icon -->\n    <mat-icon\n            class=\"nice-vertical-navigation-item-icon\"\n            [ngClass]=\"item.classes?.icon\"\n            *ngIf=\"item.icon && item.iconType === 'material'\"\n    >\n        {{ item.icon }}\n    </mat-icon>\n\n    <span class=\"nice-vertical-navigation-item-icon\" [ngClass]=\"item.icon\" *ngIf=\"item.icon && item.iconType == 'fontawesome'\"></span>\n\n    <mat-icon\n            class=\"nice-vertical-navigation-item-icon\"\n            [ngClass]=\"item.classes?.icon\"\n            [svgIcon]=\"item.icon\"\n            *ngIf=\"item.icon && item.iconType === 'svg'\"\n    ></mat-icon>\n\n    <!-- Title & Subtitle -->\n    <div class=\"nice-horizontal-navigation-item-title-wrapper\">\n        <div class=\"nice-horizontal-navigation-item-title\">\n            <span [ngClass]=\"item.classes?.title\">\n                {{ item.title | niceTranslateWithContext }}\n            </span>\n        </div>\n        <div\n            class=\"nice-horizontal-navigation-item-subtitle text-hint\"\n            *ngIf=\"item.subtitle\"\n        >\n            <span [ngClass]=\"item.classes?.subtitle\">\n                {{ item.subtitle | niceTranslateWithContext }}\n            </span>\n        </div>\n    </div>\n\n    <!-- Badge -->\n    <div\n        class=\"nice-horizontal-navigation-item-badge\"\n        *ngIf=\"item.badge\"\n    >\n        <div\n            class=\"nice-horizontal-navigation-item-badge-content\"\n            [ngClass]=\"item.badge.classes\">\n            {{ item.badge.title | niceTranslateWithContext }}\n        </div>\n    </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i5.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: i7.NiceTranslateWithContextPipe, name: "niceTranslateWithContext" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceHorizontalNavigationBasicItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.NiceNavigationService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: NiceHorizontalNavigationBasicItemComponent, selector: "nice-horizontal-navigation-basic-item", inputs: { item: "item", name: "name", showTooltips: "showTooltips", tooltipPosition: "tooltipPosition" }, ngImport: i0, template: "<!-- Item wrapper -->\n<div\n    class=\"nice-horizontal-navigation-item-wrapper\"\n    [class.nice-horizontal-navigation-item-has-subtitle]=\"!!item.subtitle\"\n    [ngClass]=\"item.classes?.wrapper\"\n    [matTooltip]=\"item.tooltip | niceTranslateWithContext\"\n    [matTooltipDisabled]=\"!showTooltips\"\n    [matTooltipPosition]=\"tooltipPosition\"\n>\n    <!-- Item with an internal link -->\n    <div\n        class=\"nice-horizontal-navigation-item\"\n        *ngIf=\"item.link && !item.externalLink && !item.function && !item.disabled\"\n        [ngClass]=\"{ 'nice-horizontal-navigation-item-active-forced': item.active }\"\n        [routerLink]=\"[item.link]\"\n        [routerLinkActive]=\"'nice-horizontal-navigation-item-active'\"\n        [routerLinkActiveOptions]=\"{ exact: item.exactMatch || false }\"\n        [queryParams]=\"item?.queryParams\"\n        [state]=\"item?.state\"\n    >\n        <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n    </div>\n\n    <!-- Item with an external link -->\n    <a\n        class=\"nice-horizontal-navigation-item\"\n        *ngIf=\"item.link && item.externalLink && !item.function && !item.disabled\"\n        [href]=\"item.link\"\n    >\n        <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n    </a>\n\n    <!-- Item with a function -->\n    <div\n        class=\"nice-horizontal-navigation-item\"\n        *ngIf=\"!item.link && item.function && !item.disabled\"\n        [ngClass]=\"{ 'nice-horizontal-navigation-item-active-forced': item.active }\"\n        (click)=\"item.function(item)\">\n        <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n    </div>\n\n    <!-- Item with an internal link and function -->\n    <div\n        class=\"nice-horizontal-navigation-item\"\n        *ngIf=\"item.link && !item.externalLink && item.function && !item.disabled\"\n        [ngClass]=\"{ 'nice-horizontal-navigation-item-active-forced': item.active }\"\n        [routerLink]=\"[item.link]\"\n        [routerLinkActive]=\"'nice-horizontal-navigation-item-active'\"\n        [routerLinkActiveOptions]=\"{ exact: item.exactMatch || false }\"\n        [queryParams]=\"item?.queryParams\"\n        [state]=\"item?.state\"\n        (click)=\"item.function(item)\"\n    >\n        <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n    </div>\n\n    <!-- Item with an external link and function -->\n    <a\n        class=\"nice-horizontal-navigation-item\"\n        *ngIf=\"item.link && item.externalLink && item.function && !item.disabled\"\n        [href]=\"item.link\"\n        (click)=\"item.function(item)\"\n        mat-menu-item\n    >\n        <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n    </a>\n\n    <!-- Item with a no link and no function -->\n    <div\n        class=\"nice-horizontal-navigation-item\"\n        *ngIf=\"!item.link && !item.function && !item.disabled\"\n        [ngClass]=\"{'nice-horizontal-navigation-item-active-forced': item.active}\"\n    >\n        <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n    </div>\n\n    <!-- Item is disabled -->\n    <div\n        class=\"nice-horizontal-navigation-item nice-horizontal-navigation-item-disabled\"\n        *ngIf=\"item.disabled\"\n    >\n        <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n    </div>\n</div>\n\n<!-- Item template -->\n<ng-template #itemTemplate>\n    <!-- Icon -->\n    <mat-icon\n            class=\"nice-vertical-navigation-item-icon\"\n            [ngClass]=\"item.classes?.icon\"\n            *ngIf=\"item.icon && item.iconType === 'material'\"\n    >\n        {{ item.icon }}\n    </mat-icon>\n\n    <span class=\"nice-vertical-navigation-item-icon\" [ngClass]=\"item.icon\" *ngIf=\"item.icon && item.iconType == 'fontawesome'\"></span>\n\n    <mat-icon\n            class=\"nice-vertical-navigation-item-icon\"\n            [ngClass]=\"item.classes?.icon\"\n            [svgIcon]=\"item.icon\"\n            *ngIf=\"item.icon && item.iconType === 'svg'\"\n    ></mat-icon>\n\n    <!-- Title & Subtitle -->\n    <div class=\"nice-horizontal-navigation-item-title-wrapper\">\n        <div class=\"nice-horizontal-navigation-item-title\">\n            <span [ngClass]=\"item.classes?.title\">\n                {{ item.title | niceTranslateWithContext }}\n            </span>\n        </div>\n        <div\n            class=\"nice-horizontal-navigation-item-subtitle text-hint\"\n            *ngIf=\"item.subtitle\"\n        >\n            <span [ngClass]=\"item.classes?.subtitle\">\n                {{ item.subtitle | niceTranslateWithContext }}\n            </span>\n        </div>\n    </div>\n\n    <!-- Badge -->\n    <div\n        class=\"nice-horizontal-navigation-item-badge\"\n        *ngIf=\"item.badge\"\n    >\n        <div\n            class=\"nice-horizontal-navigation-item-badge-content\"\n            [ngClass]=\"item.badge.classes\">\n            {{ item.badge.title | niceTranslateWithContext }}\n        </div>\n    </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i5.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: i7.NiceTranslateWithContextPipe, name: "niceTranslateWithContext" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceHorizontalNavigationBasicItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceHorizontalNavigationBasicItemComponent, decorators: [{
             type: Component,
             args: [{ selector: "nice-horizontal-navigation-basic-item", changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Item wrapper -->\n<div\n    class=\"nice-horizontal-navigation-item-wrapper\"\n    [class.nice-horizontal-navigation-item-has-subtitle]=\"!!item.subtitle\"\n    [ngClass]=\"item.classes?.wrapper\"\n    [matTooltip]=\"item.tooltip | niceTranslateWithContext\"\n    [matTooltipDisabled]=\"!showTooltips\"\n    [matTooltipPosition]=\"tooltipPosition\"\n>\n    <!-- Item with an internal link -->\n    <div\n        class=\"nice-horizontal-navigation-item\"\n        *ngIf=\"item.link && !item.externalLink && !item.function && !item.disabled\"\n        [ngClass]=\"{ 'nice-horizontal-navigation-item-active-forced': item.active }\"\n        [routerLink]=\"[item.link]\"\n        [routerLinkActive]=\"'nice-horizontal-navigation-item-active'\"\n        [routerLinkActiveOptions]=\"{ exact: item.exactMatch || false }\"\n        [queryParams]=\"item?.queryParams\"\n        [state]=\"item?.state\"\n    >\n        <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n    </div>\n\n    <!-- Item with an external link -->\n    <a\n        class=\"nice-horizontal-navigation-item\"\n        *ngIf=\"item.link && item.externalLink && !item.function && !item.disabled\"\n        [href]=\"item.link\"\n    >\n        <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n    </a>\n\n    <!-- Item with a function -->\n    <div\n        class=\"nice-horizontal-navigation-item\"\n        *ngIf=\"!item.link && item.function && !item.disabled\"\n        [ngClass]=\"{ 'nice-horizontal-navigation-item-active-forced': item.active }\"\n        (click)=\"item.function(item)\">\n        <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n    </div>\n\n    <!-- Item with an internal link and function -->\n    <div\n        class=\"nice-horizontal-navigation-item\"\n        *ngIf=\"item.link && !item.externalLink && item.function && !item.disabled\"\n        [ngClass]=\"{ 'nice-horizontal-navigation-item-active-forced': item.active }\"\n        [routerLink]=\"[item.link]\"\n        [routerLinkActive]=\"'nice-horizontal-navigation-item-active'\"\n        [routerLinkActiveOptions]=\"{ exact: item.exactMatch || false }\"\n        [queryParams]=\"item?.queryParams\"\n        [state]=\"item?.state\"\n        (click)=\"item.function(item)\"\n    >\n        <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n    </div>\n\n    <!-- Item with an external link and function -->\n    <a\n        class=\"nice-horizontal-navigation-item\"\n        *ngIf=\"item.link && item.externalLink && item.function && !item.disabled\"\n        [href]=\"item.link\"\n        (click)=\"item.function(item)\"\n        mat-menu-item\n    >\n        <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n    </a>\n\n    <!-- Item with a no link and no function -->\n    <div\n        class=\"nice-horizontal-navigation-item\"\n        *ngIf=\"!item.link && !item.function && !item.disabled\"\n        [ngClass]=\"{'nice-horizontal-navigation-item-active-forced': item.active}\"\n    >\n        <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n    </div>\n\n    <!-- Item is disabled -->\n    <div\n        class=\"nice-horizontal-navigation-item nice-horizontal-navigation-item-disabled\"\n        *ngIf=\"item.disabled\"\n    >\n        <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n    </div>\n</div>\n\n<!-- Item template -->\n<ng-template #itemTemplate>\n    <!-- Icon -->\n    <mat-icon\n            class=\"nice-vertical-navigation-item-icon\"\n            [ngClass]=\"item.classes?.icon\"\n            *ngIf=\"item.icon && item.iconType === 'material'\"\n    >\n        {{ item.icon }}\n    </mat-icon>\n\n    <span class=\"nice-vertical-navigation-item-icon\" [ngClass]=\"item.icon\" *ngIf=\"item.icon && item.iconType == 'fontawesome'\"></span>\n\n    <mat-icon\n            class=\"nice-vertical-navigation-item-icon\"\n            [ngClass]=\"item.classes?.icon\"\n            [svgIcon]=\"item.icon\"\n            *ngIf=\"item.icon && item.iconType === 'svg'\"\n    ></mat-icon>\n\n    <!-- Title & Subtitle -->\n    <div class=\"nice-horizontal-navigation-item-title-wrapper\">\n        <div class=\"nice-horizontal-navigation-item-title\">\n            <span [ngClass]=\"item.classes?.title\">\n                {{ item.title | niceTranslateWithContext }}\n            </span>\n        </div>\n        <div\n            class=\"nice-horizontal-navigation-item-subtitle text-hint\"\n            *ngIf=\"item.subtitle\"\n        >\n            <span [ngClass]=\"item.classes?.subtitle\">\n                {{ item.subtitle | niceTranslateWithContext }}\n            </span>\n        </div>\n    </div>\n\n    <!-- Badge -->\n    <div\n        class=\"nice-horizontal-navigation-item-badge\"\n        *ngIf=\"item.badge\"\n    >\n        <div\n            class=\"nice-horizontal-navigation-item-badge-content\"\n            [ngClass]=\"item.badge.classes\">\n            {{ item.badge.title | niceTranslateWithContext }}\n        </div>\n    </div>\n</ng-template>\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.NiceNavigationService }], propDecorators: { item: [{

package/esm2022/lib/components/navigation/horizontal/components/branch/branch.component.mjs

@@ -57,10 +57,10 @@ export class NiceHorizontalNavigationBranchItemComponent {
         // Mark for check
         this._changeDetectorRef.markForCheck();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceHorizontalNavigationBranchItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.NiceNavigationService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.10", type: NiceHorizontalNavigationBranchItemComponent, selector: "nice-horizontal-navigation-branch-item", inputs: { child: "child", item: "item", name: "name", showTooltips: "showTooltips", tooltipPosition: "tooltipPosition" }, viewQueries: [{ propertyName: "matMenu", first: true, predicate: ["matMenu"], descendants: true, static: true }], ngImport: i0, template: "<div\n    *ngIf=\"!child\"\n    [ngClass]=\"{\n        'nice-horizontal-navigation-menu-active': trigger.menuOpen,\n        'nice-horizontal-navigation-menu-active-forced': item.active\n    }\"\n    [matMenuTriggerFor]=\"matMenu\"\n    (onMenuOpen)=\"triggerChangeDetection()\"\n    (onMenuClose)=\"triggerChangeDetection()\"\n    #trigger=\"matMenuTrigger\"\n>\n    <ng-container *ngTemplateOutlet=\"itemTemplate; context: {$implicit: item}\"></ng-container>\n</div>\n\n<mat-menu\n    class=\"nice-horizontal-navigation-menu-panel\"\n    [overlapTrigger]=\"false\"\n    #matMenu=\"matMenu\"\n>\n    <ng-container *ngFor=\"let item of item.children\">\n        <!-- Skip the hidden items -->\n        <ng-container *ngIf=\"!(item | niceShouldHide | async)\">\n            <!-- Basic -->\n            <div\n                class=\"nice-horizontal-navigation-menu-item\"\n                *ngIf=\"item.type === 'basic'\"\n                [disabled]=\"item.disabled\"\n                mat-menu-item\n            >\n                <nice-horizontal-navigation-basic-item\n                    [item]=\"item\"\n                    [name]=\"name\"\n                    [showTooltips]=\"showTooltips\"\n                    [tooltipPosition]=\"tooltipPosition\"\n                ></nice-horizontal-navigation-basic-item>\n            </div>\n\n            <!-- Branch: aside, collapsable, group -->\n            <div\n                class=\"nice-horizontal-navigation-menu-item\"\n                *ngIf=\"item.type === 'aside' || item.type === 'collapsable' || item.type === 'group'\"\n                [disabled]=\"item.disabled\"\n                [matMenuTriggerFor]=\"branch.matMenu\"\n                mat-menu-item\n            >\n                <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n                <nice-horizontal-navigation-branch-item\n                    [child]=\"true\"\n                    [item]=\"item\"\n                    [name]=\"name\"\n                    [showTooltips]=\"showTooltips\"\n                    [tooltipPosition]=\"tooltipPosition\"\n                    #branch\n                ></nice-horizontal-navigation-branch-item>\n            </div>\n\n            <!-- Divider -->\n            <div\n                class=\"nice-horizontal-navigation-menu-item\"\n                *ngIf=\"item.type === 'divider'\"\n                mat-menu-item\n            >\n                <nice-horizontal-navigation-divider-item\n                    [item]=\"item\"\n                    [name]=\"name\"\n                ></nice-horizontal-navigation-divider-item>\n            </div>\n        </ng-container>\n    </ng-container>\n</mat-menu>\n\n<!-- Item template -->\n<ng-template\n    let-item\n    #itemTemplate\n>\n    <div\n        class=\"nice-horizontal-navigation-item-wrapper\"\n        [class.nice-horizontal-navigation-item-has-subtitle]=\"!!item.subtitle\"\n        [ngClass]=\"item.classes?.wrapper\"\n    >\n        <div\n            class=\"nice-horizontal-navigation-item\"\n            [ngClass]=\"{\n                'nice-horizontal-navigation-item-disabled': item.disabled,\n                'nice-horizontal-navigation-item-active-forced': item.active\n            }\">\n\n            <!-- Icon -->\n            <mat-icon\n                class=\"nice-vertical-navigation-item-icon\"\n                [ngClass]=\"item.classes?.icon\"\n                *ngIf=\"item.icon && item.iconType === 'material'\"\n            >\n                {{ item.icon }}\n            </mat-icon>\n\n            <span class=\"nice-vertical-navigation-item-icon\" [ngClass]=\"item.icon\" *ngIf=\"item.icon && item.iconType == 'fontawesome'\"></span>\n\n            <mat-icon\n                class=\"nice-vertical-navigation-item-icon\"\n                [ngClass]=\"item.classes?.icon\"\n                [svgIcon]=\"item.icon\"\n                *ngIf=\"item.icon && item.iconType === 'svg'\"\n            ></mat-icon>\n\n            <!-- Title & Subtitle -->\n            <div class=\"nice-horizontal-navigation-item-title-wrapper\">\n                <div class=\"nice-horizontal-navigation-item-title\">\n                    <span [ngClass]=\"item.classes?.title\">\n                        {{ item.title | niceTranslateWithContext }}\n                    </span>\n                </div>\n                <div\n                    class=\"nice-horizontal-navigation-item-subtitle text-hint\"\n                    *ngIf=\"item.subtitle\"\n                >\n                    <span [ngClass]=\"item.classes?.subtitle\">\n                        {{ item.subtitle | niceTranslateWithContext }}\n                    </span>\n                </div>\n            </div>\n\n            <!-- Badge -->\n            <div\n                class=\"nice-horizontal-navigation-item-badge\"\n                *ngIf=\"item.badge\">\n                <div\n                    class=\"nice-horizontal-navigation-item-badge-content\"\n                    [ngClass]=\"item.badge.classes\"\n                >\n                    {{ item.badge.title | niceTranslateWithContext }}\n                </div>\n            </div>\n        </div>\n    </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.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: i4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4.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: i5.NiceHorizontalNavigationBasicItemComponent, selector: "nice-horizontal-navigation-basic-item", inputs: ["item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: NiceHorizontalNavigationBranchItemComponent, selector: "nice-horizontal-navigation-branch-item", inputs: ["child", "item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: i6.NiceHorizontalNavigationDividerItemComponent, selector: "nice-horizontal-navigation-divider-item", inputs: ["item", "name"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.NiceShouldHidePipe, name: "niceShouldHide" }, { kind: "pipe", type: i8.NiceTranslateWithContextPipe, name: "niceTranslateWithContext" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceHorizontalNavigationBranchItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.NiceNavigationService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: NiceHorizontalNavigationBranchItemComponent, selector: "nice-horizontal-navigation-branch-item", inputs: { child: "child", item: "item", name: "name", showTooltips: "showTooltips", tooltipPosition: "tooltipPosition" }, viewQueries: [{ propertyName: "matMenu", first: true, predicate: ["matMenu"], descendants: true, static: true }], ngImport: i0, template: "<div\n    *ngIf=\"!child\"\n    [ngClass]=\"{\n        'nice-horizontal-navigation-menu-active': trigger.menuOpen,\n        'nice-horizontal-navigation-menu-active-forced': item.active\n    }\"\n    [matMenuTriggerFor]=\"matMenu\"\n    (onMenuOpen)=\"triggerChangeDetection()\"\n    (onMenuClose)=\"triggerChangeDetection()\"\n    #trigger=\"matMenuTrigger\"\n>\n    <ng-container *ngTemplateOutlet=\"itemTemplate; context: {$implicit: item}\"></ng-container>\n</div>\n\n<mat-menu\n    class=\"nice-horizontal-navigation-menu-panel\"\n    [overlapTrigger]=\"false\"\n    #matMenu=\"matMenu\"\n>\n    <ng-container *ngFor=\"let item of item.children\">\n        <!-- Skip the hidden items -->\n        <ng-container *ngIf=\"!(item | niceShouldHide | async)\">\n            <!-- Basic -->\n            <div\n                class=\"nice-horizontal-navigation-menu-item\"\n                *ngIf=\"item.type === 'basic'\"\n                [disabled]=\"item.disabled\"\n                mat-menu-item\n            >\n                <nice-horizontal-navigation-basic-item\n                    [item]=\"item\"\n                    [name]=\"name\"\n                    [showTooltips]=\"showTooltips\"\n                    [tooltipPosition]=\"tooltipPosition\"\n                ></nice-horizontal-navigation-basic-item>\n            </div>\n\n            <!-- Branch: aside, collapsable, group -->\n            <div\n                class=\"nice-horizontal-navigation-menu-item\"\n                *ngIf=\"item.type === 'aside' || item.type === 'collapsable' || item.type === 'group'\"\n                [disabled]=\"item.disabled\"\n                [matMenuTriggerFor]=\"branch.matMenu\"\n                mat-menu-item\n            >\n                <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n                <nice-horizontal-navigation-branch-item\n                    [child]=\"true\"\n                    [item]=\"item\"\n                    [name]=\"name\"\n                    [showTooltips]=\"showTooltips\"\n                    [tooltipPosition]=\"tooltipPosition\"\n                    #branch\n                ></nice-horizontal-navigation-branch-item>\n            </div>\n\n            <!-- Divider -->\n            <div\n                class=\"nice-horizontal-navigation-menu-item\"\n                *ngIf=\"item.type === 'divider'\"\n                mat-menu-item\n            >\n                <nice-horizontal-navigation-divider-item\n                    [item]=\"item\"\n                    [name]=\"name\"\n                ></nice-horizontal-navigation-divider-item>\n            </div>\n        </ng-container>\n    </ng-container>\n</mat-menu>\n\n<!-- Item template -->\n<ng-template\n    let-item\n    #itemTemplate\n>\n    <div\n        class=\"nice-horizontal-navigation-item-wrapper\"\n        [class.nice-horizontal-navigation-item-has-subtitle]=\"!!item.subtitle\"\n        [ngClass]=\"item.classes?.wrapper\"\n    >\n        <div\n            class=\"nice-horizontal-navigation-item\"\n            [ngClass]=\"{\n                'nice-horizontal-navigation-item-disabled': item.disabled,\n                'nice-horizontal-navigation-item-active-forced': item.active\n            }\">\n\n            <!-- Icon -->\n            <mat-icon\n                class=\"nice-vertical-navigation-item-icon\"\n                [ngClass]=\"item.classes?.icon\"\n                *ngIf=\"item.icon && item.iconType === 'material'\"\n            >\n                {{ item.icon }}\n            </mat-icon>\n\n            <span class=\"nice-vertical-navigation-item-icon\" [ngClass]=\"item.icon\" *ngIf=\"item.icon && item.iconType == 'fontawesome'\"></span>\n\n            <mat-icon\n                class=\"nice-vertical-navigation-item-icon\"\n                [ngClass]=\"item.classes?.icon\"\n                [svgIcon]=\"item.icon\"\n                *ngIf=\"item.icon && item.iconType === 'svg'\"\n            ></mat-icon>\n\n            <!-- Title & Subtitle -->\n            <div class=\"nice-horizontal-navigation-item-title-wrapper\">\n                <div class=\"nice-horizontal-navigation-item-title\">\n                    <span [ngClass]=\"item.classes?.title\">\n                        {{ item.title | niceTranslateWithContext }}\n                    </span>\n                </div>\n                <div\n                    class=\"nice-horizontal-navigation-item-subtitle text-hint\"\n                    *ngIf=\"item.subtitle\"\n                >\n                    <span [ngClass]=\"item.classes?.subtitle\">\n                        {{ item.subtitle | niceTranslateWithContext }}\n                    </span>\n                </div>\n            </div>\n\n            <!-- Badge -->\n            <div\n                class=\"nice-horizontal-navigation-item-badge\"\n                *ngIf=\"item.badge\">\n                <div\n                    class=\"nice-horizontal-navigation-item-badge-content\"\n                    [ngClass]=\"item.badge.classes\"\n                >\n                    {{ item.badge.title | niceTranslateWithContext }}\n                </div>\n            </div>\n        </div>\n    </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.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: i4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4.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: i5.NiceHorizontalNavigationBasicItemComponent, selector: "nice-horizontal-navigation-basic-item", inputs: ["item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: NiceHorizontalNavigationBranchItemComponent, selector: "nice-horizontal-navigation-branch-item", inputs: ["child", "item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: i6.NiceHorizontalNavigationDividerItemComponent, selector: "nice-horizontal-navigation-divider-item", inputs: ["item", "name"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.NiceShouldHidePipe, name: "niceShouldHide" }, { kind: "pipe", type: i8.NiceTranslateWithContextPipe, name: "niceTranslateWithContext" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceHorizontalNavigationBranchItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceHorizontalNavigationBranchItemComponent, decorators: [{
             type: Component,
             args: [{ selector: "nice-horizontal-navigation-branch-item", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n    *ngIf=\"!child\"\n    [ngClass]=\"{\n        'nice-horizontal-navigation-menu-active': trigger.menuOpen,\n        'nice-horizontal-navigation-menu-active-forced': item.active\n    }\"\n    [matMenuTriggerFor]=\"matMenu\"\n    (onMenuOpen)=\"triggerChangeDetection()\"\n    (onMenuClose)=\"triggerChangeDetection()\"\n    #trigger=\"matMenuTrigger\"\n>\n    <ng-container *ngTemplateOutlet=\"itemTemplate; context: {$implicit: item}\"></ng-container>\n</div>\n\n<mat-menu\n    class=\"nice-horizontal-navigation-menu-panel\"\n    [overlapTrigger]=\"false\"\n    #matMenu=\"matMenu\"\n>\n    <ng-container *ngFor=\"let item of item.children\">\n        <!-- Skip the hidden items -->\n        <ng-container *ngIf=\"!(item | niceShouldHide | async)\">\n            <!-- Basic -->\n            <div\n                class=\"nice-horizontal-navigation-menu-item\"\n                *ngIf=\"item.type === 'basic'\"\n                [disabled]=\"item.disabled\"\n                mat-menu-item\n            >\n                <nice-horizontal-navigation-basic-item\n                    [item]=\"item\"\n                    [name]=\"name\"\n                    [showTooltips]=\"showTooltips\"\n                    [tooltipPosition]=\"tooltipPosition\"\n                ></nice-horizontal-navigation-basic-item>\n            </div>\n\n            <!-- Branch: aside, collapsable, group -->\n            <div\n                class=\"nice-horizontal-navigation-menu-item\"\n                *ngIf=\"item.type === 'aside' || item.type === 'collapsable' || item.type === 'group'\"\n                [disabled]=\"item.disabled\"\n                [matMenuTriggerFor]=\"branch.matMenu\"\n                mat-menu-item\n            >\n                <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item }\"></ng-container>\n                <nice-horizontal-navigation-branch-item\n                    [child]=\"true\"\n                    [item]=\"item\"\n                    [name]=\"name\"\n                    [showTooltips]=\"showTooltips\"\n                    [tooltipPosition]=\"tooltipPosition\"\n                    #branch\n                ></nice-horizontal-navigation-branch-item>\n            </div>\n\n            <!-- Divider -->\n            <div\n                class=\"nice-horizontal-navigation-menu-item\"\n                *ngIf=\"item.type === 'divider'\"\n                mat-menu-item\n            >\n                <nice-horizontal-navigation-divider-item\n                    [item]=\"item\"\n                    [name]=\"name\"\n                ></nice-horizontal-navigation-divider-item>\n            </div>\n        </ng-container>\n    </ng-container>\n</mat-menu>\n\n<!-- Item template -->\n<ng-template\n    let-item\n    #itemTemplate\n>\n    <div\n        class=\"nice-horizontal-navigation-item-wrapper\"\n        [class.nice-horizontal-navigation-item-has-subtitle]=\"!!item.subtitle\"\n        [ngClass]=\"item.classes?.wrapper\"\n    >\n        <div\n            class=\"nice-horizontal-navigation-item\"\n            [ngClass]=\"{\n                'nice-horizontal-navigation-item-disabled': item.disabled,\n                'nice-horizontal-navigation-item-active-forced': item.active\n            }\">\n\n            <!-- Icon -->\n            <mat-icon\n                class=\"nice-vertical-navigation-item-icon\"\n                [ngClass]=\"item.classes?.icon\"\n                *ngIf=\"item.icon && item.iconType === 'material'\"\n            >\n                {{ item.icon }}\n            </mat-icon>\n\n            <span class=\"nice-vertical-navigation-item-icon\" [ngClass]=\"item.icon\" *ngIf=\"item.icon && item.iconType == 'fontawesome'\"></span>\n\n            <mat-icon\n                class=\"nice-vertical-navigation-item-icon\"\n                [ngClass]=\"item.classes?.icon\"\n                [svgIcon]=\"item.icon\"\n                *ngIf=\"item.icon && item.iconType === 'svg'\"\n            ></mat-icon>\n\n            <!-- Title & Subtitle -->\n            <div class=\"nice-horizontal-navigation-item-title-wrapper\">\n                <div class=\"nice-horizontal-navigation-item-title\">\n                    <span [ngClass]=\"item.classes?.title\">\n                        {{ item.title | niceTranslateWithContext }}\n                    </span>\n                </div>\n                <div\n                    class=\"nice-horizontal-navigation-item-subtitle text-hint\"\n                    *ngIf=\"item.subtitle\"\n                >\n                    <span [ngClass]=\"item.classes?.subtitle\">\n                        {{ item.subtitle | niceTranslateWithContext }}\n                    </span>\n                </div>\n            </div>\n\n            <!-- Badge -->\n            <div\n                class=\"nice-horizontal-navigation-item-badge\"\n                *ngIf=\"item.badge\">\n                <div\n                    class=\"nice-horizontal-navigation-item-badge-content\"\n                    [ngClass]=\"item.badge.classes\"\n                >\n                    {{ item.badge.title | niceTranslateWithContext }}\n                </div>\n            </div>\n        </div>\n    </div>\n</ng-template>\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.NiceNavigationService }], propDecorators: { child: [{

package/esm2022/lib/components/navigation/horizontal/components/divider/divider.component.mjs

@@ -37,10 +37,10 @@ export class NiceHorizontalNavigationDividerItemComponent {
         this._unsubscribeAll.next(null);
         this._unsubscribeAll.complete();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceHorizontalNavigationDividerItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.NiceNavigationService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.10", type: NiceHorizontalNavigationDividerItemComponent, selector: "nice-horizontal-navigation-divider-item", inputs: { item: "item", name: "name" }, ngImport: i0, template: "<!-- Divider -->\n<div\n    class=\"nice-horizontal-navigation-item-wrapper divider\"\n    [ngClass]=\"item.classes?.wrapper\"\n></div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceHorizontalNavigationDividerItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.NiceNavigationService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: NiceHorizontalNavigationDividerItemComponent, selector: "nice-horizontal-navigation-divider-item", inputs: { item: "item", name: "name" }, ngImport: i0, template: "<!-- Divider -->\n<div\n    class=\"nice-horizontal-navigation-item-wrapper divider\"\n    [ngClass]=\"item.classes?.wrapper\"\n></div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceHorizontalNavigationDividerItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceHorizontalNavigationDividerItemComponent, decorators: [{
             type: Component,
             args: [{ selector: "nice-horizontal-navigation-divider-item", changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Divider -->\n<div\n    class=\"nice-horizontal-navigation-item-wrapper divider\"\n    [ngClass]=\"item.classes?.wrapper\"\n></div>\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.NiceNavigationService }], propDecorators: { item: [{

package/esm2022/lib/components/navigation/horizontal/components/spacer/spacer.component.mjs

@@ -37,10 +37,10 @@ export class NiceHorizontalNavigationSpacerItemComponent {
         this._unsubscribeAll.next(null);
         this._unsubscribeAll.complete();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceHorizontalNavigationSpacerItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.NiceNavigationService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.10", type: NiceHorizontalNavigationSpacerItemComponent, selector: "nice-horizontal-navigation-spacer-item", inputs: { item: "item", name: "name" }, ngImport: i0, template: "<!-- Spacer -->\n<div\n    class=\"nice-horizontal-navigation-item-wrapper\"\n    [ngClass]=\"item.classes?.wrapper\"\n></div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceHorizontalNavigationSpacerItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.NiceNavigationService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: NiceHorizontalNavigationSpacerItemComponent, selector: "nice-horizontal-navigation-spacer-item", inputs: { item: "item", name: "name" }, ngImport: i0, template: "<!-- Spacer -->\n<div\n    class=\"nice-horizontal-navigation-item-wrapper\"\n    [ngClass]=\"item.classes?.wrapper\"\n></div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceHorizontalNavigationSpacerItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceHorizontalNavigationSpacerItemComponent, decorators: [{
             type: Component,
             args: [{ selector: "nice-horizontal-navigation-spacer-item", changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Spacer -->\n<div\n    class=\"nice-horizontal-navigation-item-wrapper\"\n    [ngClass]=\"item.classes?.wrapper\"\n></div>\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.NiceNavigationService }], propDecorators: { item: [{

package/esm2022/lib/components/navigation/horizontal/horizontal.component.mjs

@@ -30,10 +30,10 @@ export class NiceHorizontalNavigationComponent extends NiceNavigationComponent {
         this.showTooltips = false;
         this.tooltipPosition = "after";
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceHorizontalNavigationComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.NiceNavigationService }, { token: i2.NiceUtilsService }, { token: i3.NiceTranslationContextService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.10", type: NiceHorizontalNavigationComponent, selector: "nice-horizontal-navigation", inputs: { name: "name", showTooltips: "showTooltips", tooltipPosition: "tooltipPosition", translationContext: "translationContext", navigation: "navigation" }, providers: [NiceTranslationContextService], exportAs: ["niceHorizontalNavigation"], usesInheritance: true, ngImport: i0, template: "<div class=\"nice-horizontal-navigation-wrapper\">\n    <ng-container *ngFor=\"let item of navigation\">\n        <!-- Skip the hidden items -->\n        <ng-container *ngIf=\"!(item | niceShouldHide | async)\">\n            <!-- Basic -->\n            <nice-horizontal-navigation-basic-item\n                class=\"nice-horizontal-navigation-menu-item\"\n                *ngIf=\"item.type === 'basic'\"\n                [item]=\"item\"\n                [name]=\"name\"\n                [showTooltips]=\"showTooltips\"\n                [tooltipPosition]=\"tooltipPosition\"\n            ></nice-horizontal-navigation-basic-item>\n\n            <!-- Branch: aside, collapsable, group -->\n            <nice-horizontal-navigation-branch-item\n                class=\"nice-horizontal-navigation-menu-item\"\n                *ngIf=\"item.type === 'aside' || item.type === 'collapsable' || item.type === 'group'\"\n                [item]=\"item\"\n                [name]=\"name\"\n                [showTooltips]=\"showTooltips\"\n                [tooltipPosition]=\"tooltipPosition\"\n            ></nice-horizontal-navigation-branch-item>\n\n            <!-- Spacer -->\n            <nice-horizontal-navigation-spacer-item\n                class=\"nice-horizontal-navigation-menu-item\"\n                *ngIf=\"item.type === 'spacer'\"\n                [item]=\"item\"\n                [name]=\"name\"\n            ></nice-horizontal-navigation-spacer-item>\n        </ng-container>\n    </ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.NiceHorizontalNavigationBasicItemComponent, selector: "nice-horizontal-navigation-basic-item", inputs: ["item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: i6.NiceHorizontalNavigationBranchItemComponent, selector: "nice-horizontal-navigation-branch-item", inputs: ["child", "item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: i7.NiceHorizontalNavigationSpacerItemComponent, selector: "nice-horizontal-navigation-spacer-item", inputs: ["item", "name"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i8.NiceShouldHidePipe, name: "niceShouldHide" }], animations: niceAnimations, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceHorizontalNavigationComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.NiceNavigationService }, { token: i2.NiceUtilsService }, { token: i3.NiceTranslationContextService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: NiceHorizontalNavigationComponent, selector: "nice-horizontal-navigation", inputs: { name: "name", showTooltips: "showTooltips", tooltipPosition: "tooltipPosition", translationContext: "translationContext", navigation: "navigation" }, providers: [NiceTranslationContextService], exportAs: ["niceHorizontalNavigation"], usesInheritance: true, ngImport: i0, template: "<div class=\"nice-horizontal-navigation-wrapper\">\n    <ng-container *ngFor=\"let item of navigation\">\n        <!-- Skip the hidden items -->\n        <ng-container *ngIf=\"!(item | niceShouldHide | async)\">\n            <!-- Basic -->\n            <nice-horizontal-navigation-basic-item\n                class=\"nice-horizontal-navigation-menu-item\"\n                *ngIf=\"item.type === 'basic'\"\n                [item]=\"item\"\n                [name]=\"name\"\n                [showTooltips]=\"showTooltips\"\n                [tooltipPosition]=\"tooltipPosition\"\n            ></nice-horizontal-navigation-basic-item>\n\n            <!-- Branch: aside, collapsable, group -->\n            <nice-horizontal-navigation-branch-item\n                class=\"nice-horizontal-navigation-menu-item\"\n                *ngIf=\"item.type === 'aside' || item.type === 'collapsable' || item.type === 'group'\"\n                [item]=\"item\"\n                [name]=\"name\"\n                [showTooltips]=\"showTooltips\"\n                [tooltipPosition]=\"tooltipPosition\"\n            ></nice-horizontal-navigation-branch-item>\n\n            <!-- Spacer -->\n            <nice-horizontal-navigation-spacer-item\n                class=\"nice-horizontal-navigation-menu-item\"\n                *ngIf=\"item.type === 'spacer'\"\n                [item]=\"item\"\n                [name]=\"name\"\n            ></nice-horizontal-navigation-spacer-item>\n        </ng-container>\n    </ng-container>\n</div>\n", dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.NiceHorizontalNavigationBasicItemComponent, selector: "nice-horizontal-navigation-basic-item", inputs: ["item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: i6.NiceHorizontalNavigationBranchItemComponent, selector: "nice-horizontal-navigation-branch-item", inputs: ["child", "item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: i7.NiceHorizontalNavigationSpacerItemComponent, selector: "nice-horizontal-navigation-spacer-item", inputs: ["item", "name"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i8.NiceShouldHidePipe, name: "niceShouldHide" }], animations: niceAnimations, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceHorizontalNavigationComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceHorizontalNavigationComponent, decorators: [{
             type: Component,
             args: [{ selector: "nice-horizontal-navigation", animations: niceAnimations, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [NiceTranslationContextService], exportAs: "niceHorizontalNavigation", template: "<div class=\"nice-horizontal-navigation-wrapper\">\n    <ng-container *ngFor=\"let item of navigation\">\n        <!-- Skip the hidden items -->\n        <ng-container *ngIf=\"!(item | niceShouldHide | async)\">\n            <!-- Basic -->\n            <nice-horizontal-navigation-basic-item\n                class=\"nice-horizontal-navigation-menu-item\"\n                *ngIf=\"item.type === 'basic'\"\n                [item]=\"item\"\n                [name]=\"name\"\n                [showTooltips]=\"showTooltips\"\n                [tooltipPosition]=\"tooltipPosition\"\n            ></nice-horizontal-navigation-basic-item>\n\n            <!-- Branch: aside, collapsable, group -->\n            <nice-horizontal-navigation-branch-item\n                class=\"nice-horizontal-navigation-menu-item\"\n                *ngIf=\"item.type === 'aside' || item.type === 'collapsable' || item.type === 'group'\"\n                [item]=\"item\"\n                [name]=\"name\"\n                [showTooltips]=\"showTooltips\"\n                [tooltipPosition]=\"tooltipPosition\"\n            ></nice-horizontal-navigation-branch-item>\n\n            <!-- Spacer -->\n            <nice-horizontal-navigation-spacer-item\n                class=\"nice-horizontal-navigation-menu-item\"\n                *ngIf=\"item.type === 'spacer'\"\n                [item]=\"item\"\n                [name]=\"name\"\n            ></nice-horizontal-navigation-spacer-item>\n        </ng-container>\n    </ng-container>\n</div>\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.NiceNavigationService }, { type: i2.NiceUtilsService }, { type: i3.NiceTranslationContextService }], propDecorators: { name: [{

package/esm2022/lib/components/navigation/navigation.component.mjs

@@ -71,10 +71,10 @@ export class NiceNavigationComponent {
     trackByFn(index, item) {
         return item.id || index;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceNavigationComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.NiceNavigationService }, { token: i2.NiceUtilsService }, { token: i3.NiceTranslationContextService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.10", type: NiceNavigationComponent, selector: "ng-component", usesOnChanges: true, ngImport: i0, template: ``, isInline: true }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceNavigationComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.NiceNavigationService }, { token: i2.NiceUtilsService }, { token: i3.NiceTranslationContextService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: NiceNavigationComponent, selector: "ng-component", usesOnChanges: true, ngImport: i0, template: ``, isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceNavigationComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceNavigationComponent, decorators: [{
             type: Component,
             args: [{
                     template: ``

package/esm2022/lib/components/navigation/navigation.module.mjs

@@ -28,8 +28,8 @@ import { NiceVerticalNavigationSpacerItemComponent } from "./vertical/components
 import { NiceVerticalNavigationComponent } from "./vertical/vertical.component";
 import * as i0 from "@angular/core";
 export class NiceNavigationModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceNavigationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.10", ngImport: i0, type: NiceNavigationModule, declarations: [NiceNavigationComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceNavigationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: NiceNavigationModule, declarations: [NiceNavigationComponent,
             NiceHorizontalNavigationBasicItemComponent,
             NiceHorizontalNavigationBranchItemComponent,
             NiceHorizontalNavigationDividerItemComponent,
@@ -55,7 +55,7 @@ export class NiceNavigationModule {
             NiceScrollbarModule,
             TranslateModule], exports: [NiceHorizontalNavigationComponent,
             NiceVerticalNavigationComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceNavigationModule, providers: [NiceNavigationHintService], imports: [CommonModule,
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceNavigationModule, providers: [NiceNavigationHintService], imports: [CommonModule,
             RouterModule,
             MatButtonModule,
             MatDividerModule,
@@ -65,7 +65,7 @@ export class NiceNavigationModule {
             NiceScrollbarModule,
             TranslateModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceNavigationModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceNavigationModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [

package/esm2022/lib/components/navigation/navigation.service.mjs

@@ -176,10 +176,10 @@ export class NiceNavigationService {
             return route;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceNavigationService, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceNavigationService, providedIn: "root" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceNavigationService, deps: [{ token: i1.Router }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceNavigationService, providedIn: "root" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceNavigationService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceNavigationService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: "root"

package/esm2022/lib/components/navigation/pipes/should-hide.pipe.mjs

@@ -21,10 +21,10 @@ export class NiceShouldHidePipe {
         }
         return resolver.shouldHide(value);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceShouldHidePipe, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "17.3.10", ngImport: i0, type: NiceShouldHidePipe, name: "niceShouldHide" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceShouldHidePipe, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: NiceShouldHidePipe, name: "niceShouldHide" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceShouldHidePipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceShouldHidePipe, decorators: [{
             type: Pipe,
             args: [{ name: "niceShouldHide" }]
         }], ctorParameters: () => [{ type: i0.Injector }] });

package/esm2022/lib/components/navigation/pipes/should-show-hint.pipe.mjs

@@ -22,10 +22,10 @@ export class NiceShouldShowHintPipe {
         }
         return resolver.shouldShowHint();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceShouldShowHintPipe, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "17.3.10", ngImport: i0, type: NiceShouldShowHintPipe, name: "niceShouldShowHint" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceShouldShowHintPipe, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: NiceShouldShowHintPipe, name: "niceShouldShowHint" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceShouldShowHintPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceShouldShowHintPipe, decorators: [{
             type: Pipe,
             args: [{ name: "niceShouldShowHint" }]
         }], ctorParameters: () => [{ type: i0.Injector }] });

package/esm2022/lib/components/navigation/pipes/translate-with-context.pipe.mjs

@@ -15,10 +15,10 @@ export class NiceTranslateWithContextPipe {
         }
         return this.translate.instant(value, this.context.context);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceTranslateWithContextPipe, deps: [{ token: i1.TranslateService }, { token: i2.NiceTranslationContextService }], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "17.3.10", ngImport: i0, type: NiceTranslateWithContextPipe, name: "niceTranslateWithContext", pure: false }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceTranslateWithContextPipe, deps: [{ token: i1.TranslateService }, { token: i2.NiceTranslationContextService }], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: NiceTranslateWithContextPipe, name: "niceTranslateWithContext", pure: false }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceTranslateWithContextPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceTranslateWithContextPipe, decorators: [{
             type: Pipe,
             args: [{ name: "niceTranslateWithContext", pure: false }]
         }], ctorParameters: () => [{ type: i1.TranslateService }, { type: i2.NiceTranslationContextService }] });

package/esm2022/lib/components/navigation/providers/hint.service.mjs

@@ -11,10 +11,10 @@ export class NiceNavigationHintService {
     setActiveHint(isActive) {
         this.hasActiveHint$.next(isActive);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceNavigationHintService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceNavigationHintService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceNavigationHintService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceNavigationHintService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceNavigationHintService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceNavigationHintService, decorators: [{
             type: Injectable
         }] });
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaGludC5zZXJ2aWNlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmljZS11aS1raXQtdjIvc3JjL2xpYi9jb21wb25lbnRzL25hdmlnYXRpb24vcHJvdmlkZXJzL2hpbnQuc2VydmljZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsVUFBVSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQzNDLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxNQUFNLENBQUM7O0FBR3ZDLE1BQU0sT0FBTyx5QkFBeUI7SUFEdEM7UUFFVyxtQkFBYyxHQUFHLElBQUksZUFBZSxDQUFDLEtBQUssQ0FBQyxDQUFDO0tBU3REO0lBUEcsSUFBVyxhQUFhO1FBQ3BCLE9BQU8sSUFBSSxDQUFDLGNBQWMsQ0FBQyxLQUFLLENBQUM7SUFDckMsQ0FBQztJQUVNLGFBQWEsQ0FBQyxRQUFpQjtRQUNsQyxJQUFJLENBQUMsY0FBYyxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQztJQUN2QyxDQUFDOytHQVRRLHlCQUF5QjttSEFBekIseUJBQXlCOzs0RkFBekIseUJBQXlCO2tCQURyQyxVQUFVIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgSW5qZWN0YWJsZSB9IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XG5pbXBvcnQgeyBCZWhhdmlvclN1YmplY3QgfSBmcm9tIFwicnhqc1wiO1xuXG5ASW5qZWN0YWJsZSgpXG5leHBvcnQgY2xhc3MgTmljZU5hdmlnYXRpb25IaW50U2VydmljZSB7XG4gICAgcHVibGljIGhhc0FjdGl2ZUhpbnQkID0gbmV3IEJlaGF2aW9yU3ViamVjdChmYWxzZSk7XG5cbiAgICBwdWJsaWMgZ2V0IGhhc0FjdGl2ZUhpbnQoKTogYm9vbGVhbiB7XG4gICAgICAgIHJldHVybiB0aGlzLmhhc0FjdGl2ZUhpbnQkLnZhbHVlO1xuICAgIH1cblxuICAgIHB1YmxpYyBzZXRBY3RpdmVIaW50KGlzQWN0aXZlOiBib29sZWFuKTogdm9pZCB7XG4gICAgICAgIHRoaXMuaGFzQWN0aXZlSGludCQubmV4dChpc0FjdGl2ZSk7XG4gICAgfVxufVxuIl19

package/esm2022/lib/components/navigation/providers/translation-context.service.mjs

@@ -7,10 +7,10 @@ export class NiceTranslationContextService {
     set context(context) {
         this._context = context;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceTranslationContextService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceTranslationContextService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceTranslationContextService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceTranslationContextService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceTranslationContextService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceTranslationContextService, decorators: [{
             type: Injectable
         }] });
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidHJhbnNsYXRpb24tY29udGV4dC5zZXJ2aWNlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbmljZS11aS1raXQtdjIvc3JjL2xpYi9jb21wb25lbnRzL25hdmlnYXRpb24vcHJvdmlkZXJzL3RyYW5zbGF0aW9uLWNvbnRleHQuc2VydmljZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsVUFBVSxFQUFFLE1BQU0sZUFBZSxDQUFDOztBQUczQyxNQUFNLE9BQU8sNkJBQTZCO0lBR3RDLElBQVcsT0FBTztRQUNkLE9BQU8sSUFBSSxDQUFDLFFBQVEsQ0FBQztJQUN6QixDQUFDO0lBQ0QsSUFBVyxPQUFPLENBQUMsT0FBNEI7UUFDM0MsSUFBSSxDQUFDLFFBQVEsR0FBRyxPQUFPLENBQUM7SUFDNUIsQ0FBQzsrR0FSUSw2QkFBNkI7bUhBQTdCLDZCQUE2Qjs7NEZBQTdCLDZCQUE2QjtrQkFEekMsVUFBVSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEluamVjdGFibGUgfSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuXG5ASW5qZWN0YWJsZSgpXG5leHBvcnQgY2xhc3MgTmljZVRyYW5zbGF0aW9uQ29udGV4dFNlcnZpY2Uge1xuICAgIHByaXZhdGUgX2NvbnRleHQ6IFJlY29yZDxzdHJpbmcsIGFueT47XG5cbiAgICBwdWJsaWMgZ2V0IGNvbnRleHQoKTogUmVjb3JkPHN0cmluZywgYW55PiB7XG4gICAgICAgIHJldHVybiB0aGlzLl9jb250ZXh0O1xuICAgIH1cbiAgICBwdWJsaWMgc2V0IGNvbnRleHQoY29udGV4dDogUmVjb3JkPHN0cmluZywgYW55Pikge1xuICAgICAgICB0aGlzLl9jb250ZXh0ID0gY29udGV4dDtcbiAgICB9XG59XG4iXX0=

package/esm2022/lib/components/navigation/vertical/components/aside/aside.component.mjs

@@ -121,10 +121,10 @@ export class NiceVerticalNavigationAsideItemComponent {
     trackByFn(index, item) {
         return item.id || index;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceVerticalNavigationAsideItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.Router }, { token: i2.NiceNavigationService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.10", type: NiceVerticalNavigationAsideItemComponent, selector: "nice-vertical-navigation-aside-item", inputs: { activeItemId: "activeItemId", autoCollapse: "autoCollapse", item: "item", name: "name", showTooltips: "showTooltips", skipChildren: "skipChildren", tooltipPosition: "tooltipPosition" }, usesOnChanges: true, ngImport: i0, template: "<div\n    class=\"nice-vertical-navigation-item-wrapper\"\n    [class.nice-vertical-navigation-item-has-subtitle]=\"!!item.subtitle\"\n    [ngClass]=\"item.classes?.wrapper\"\n>\n    <div\n        class=\"nice-vertical-navigation-item\"\n        [ngClass]=\"{\n            'nice-vertical-navigation-item-active': active,\n            'nice-vertical-navigation-item-disabled': item.disabled,\n            'nice-vertical-navigation-item-active-forced': item.active\n        }\"\n    >\n        <!-- Icon -->\n        <mat-icon\n                class=\"nice-vertical-navigation-item-icon\"\n                [ngClass]=\"item.classes?.icon\"\n                *ngIf=\"item.icon && item.iconType === 'material'\"\n        >\n            {{ item.icon }}\n        </mat-icon>\n\n        <span class=\"nice-vertical-navigation-item-icon\" [ngClass]=\"item.icon\" *ngIf=\"item.icon && item.iconType == 'fontawesome'\"></span>\n\n        <mat-icon\n                class=\"nice-vertical-navigation-item-icon\"\n                [ngClass]=\"item.classes?.icon\"\n                [svgIcon]=\"item.icon\"\n                *ngIf=\"item.icon && item.iconType === 'svg'\"\n        ></mat-icon>\n\n        <!-- Title & Subtitle -->\n        <div class=\"nice-vertical-navigation-item-title-wrapper\">\n            <div class=\"nice-vertical-navigation-item-title\">\n                <span [ngClass]=\"item.classes?.title\">\n                    {{ item.title | niceTranslateWithContext }}\n                </span>\n            </div>\n            <div\n                class=\"nice-vertical-navigation-item-subtitle\"\n                *ngIf=\"item.subtitle\"\n            >\n                <span [ngClass]=\"item.classes?.subtitle\">\n                    {{ item.subtitle | niceTranslateWithContext }}\n                </span>\n            </div>\n        </div>\n\n        <!-- Badge -->\n        <div\n            class=\"nice-vertical-navigation-item-badge\"\n            *ngIf=\"item.badge\"\n        >\n            <div\n                class=\"nice-vertical-navigation-item-badge-content\"\n                [ngClass]=\"item.badge.classes\"\n            >\n                {{ item.badge.title | niceTranslateWithContext }}\n            </div>\n        </div>\n    </div>\n</div>\n\n<ng-container *ngIf=\"!skipChildren\">\n    <div class=\"nice-vertical-navigation-item-children\">\n        <ng-container *ngFor=\"let item of item.children; trackBy: trackByFn\">\n            <!-- Skip the hidden items -->\n            <ng-container *ngIf=\"(item.hidden && !item.hidden(item)) || !item.hidden\">\n                <!-- Basic -->\n                <nice-vertical-navigation-basic-item\n                    *ngIf=\"item.type === 'basic'\"\n                    [item]=\"item\"\n                    [name]=\"name\"\n                    [showTooltips]=\"showTooltips\"\n                    [tooltipPosition]=\"tooltipPosition\"\n                ></nice-vertical-navigation-basic-item>\n\n                <!-- Collapsable -->\n                <nice-vertical-navigation-collapsable-item\n                    *ngIf=\"item.type === 'collapsable'\"\n                    [item]=\"item\"\n                    [name]=\"name\"\n                    [autoCollapse]=\"autoCollapse\"\n                    [showTooltips]=\"showTooltips\"\n                    [tooltipPosition]=\"tooltipPosition\"\n                ></nice-vertical-navigation-collapsable-item>\n\n                <!-- Divider -->\n                <nice-vertical-navigation-divider-item\n                    *ngIf=\"item.type === 'divider'\"\n                    [item]=\"item\"\n                    [name]=\"name\"\n                ></nice-vertical-navigation-divider-item>\n\n                <!-- Group -->\n                <nice-vertical-navigation-group-item\n                    *ngIf=\"item.type === 'group'\"\n                    [item]=\"item\"\n                    [name]=\"name\"\n                    [showTooltips]=\"showTooltips\"\n                    [tooltipPosition]=\"tooltipPosition\"\n                ></nice-vertical-navigation-group-item>\n\n                <!-- Spacer -->\n                <nice-vertical-navigation-spacer-item\n                    *ngIf=\"item.type === 'spacer'\"\n                    [item]=\"item\"\n                    [name]=\"name\"\n                ></nice-vertical-navigation-spacer-item>\n            </ng-container>\n        </ng-container>\n    </div>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i5.NiceVerticalNavigationBasicItemComponent, selector: "nice-vertical-navigation-basic-item", inputs: ["item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: i6.NiceVerticalNavigationCollapsableItemComponent, selector: "nice-vertical-navigation-collapsable-item", inputs: ["autoCollapse", "item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: i7.NiceVerticalNavigationDividerItemComponent, selector: "nice-vertical-navigation-divider-item", inputs: ["item", "name"] }, { kind: "component", type: i8.NiceVerticalNavigationGroupItemComponent, selector: "nice-vertical-navigation-group-item", inputs: ["autoCollapse", "item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: i9.NiceVerticalNavigationSpacerItemComponent, selector: "nice-vertical-navigation-spacer-item", inputs: ["item", "name"] }, { kind: "pipe", type: i10.NiceTranslateWithContextPipe, name: "niceTranslateWithContext" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceVerticalNavigationAsideItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.Router }, { token: i2.NiceNavigationService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: NiceVerticalNavigationAsideItemComponent, selector: "nice-vertical-navigation-aside-item", inputs: { activeItemId: "activeItemId", autoCollapse: "autoCollapse", item: "item", name: "name", showTooltips: "showTooltips", skipChildren: "skipChildren", tooltipPosition: "tooltipPosition" }, usesOnChanges: true, ngImport: i0, template: "<div\n    class=\"nice-vertical-navigation-item-wrapper\"\n    [class.nice-vertical-navigation-item-has-subtitle]=\"!!item.subtitle\"\n    [ngClass]=\"item.classes?.wrapper\"\n>\n    <div\n        class=\"nice-vertical-navigation-item\"\n        [ngClass]=\"{\n            'nice-vertical-navigation-item-active': active,\n            'nice-vertical-navigation-item-disabled': item.disabled,\n            'nice-vertical-navigation-item-active-forced': item.active\n        }\"\n    >\n        <!-- Icon -->\n        <mat-icon\n                class=\"nice-vertical-navigation-item-icon\"\n                [ngClass]=\"item.classes?.icon\"\n                *ngIf=\"item.icon && item.iconType === 'material'\"\n        >\n            {{ item.icon }}\n        </mat-icon>\n\n        <span class=\"nice-vertical-navigation-item-icon\" [ngClass]=\"item.icon\" *ngIf=\"item.icon && item.iconType == 'fontawesome'\"></span>\n\n        <mat-icon\n                class=\"nice-vertical-navigation-item-icon\"\n                [ngClass]=\"item.classes?.icon\"\n                [svgIcon]=\"item.icon\"\n                *ngIf=\"item.icon && item.iconType === 'svg'\"\n        ></mat-icon>\n\n        <!-- Title & Subtitle -->\n        <div class=\"nice-vertical-navigation-item-title-wrapper\">\n            <div class=\"nice-vertical-navigation-item-title\">\n                <span [ngClass]=\"item.classes?.title\">\n                    {{ item.title | niceTranslateWithContext }}\n                </span>\n            </div>\n            <div\n                class=\"nice-vertical-navigation-item-subtitle\"\n                *ngIf=\"item.subtitle\"\n            >\n                <span [ngClass]=\"item.classes?.subtitle\">\n                    {{ item.subtitle | niceTranslateWithContext }}\n                </span>\n            </div>\n        </div>\n\n        <!-- Badge -->\n        <div\n            class=\"nice-vertical-navigation-item-badge\"\n            *ngIf=\"item.badge\"\n        >\n            <div\n                class=\"nice-vertical-navigation-item-badge-content\"\n                [ngClass]=\"item.badge.classes\"\n            >\n                {{ item.badge.title | niceTranslateWithContext }}\n            </div>\n        </div>\n    </div>\n</div>\n\n<ng-container *ngIf=\"!skipChildren\">\n    <div class=\"nice-vertical-navigation-item-children\">\n        <ng-container *ngFor=\"let item of item.children; trackBy: trackByFn\">\n            <!-- Skip the hidden items -->\n            <ng-container *ngIf=\"(item.hidden && !item.hidden(item)) || !item.hidden\">\n                <!-- Basic -->\n                <nice-vertical-navigation-basic-item\n                    *ngIf=\"item.type === 'basic'\"\n                    [item]=\"item\"\n                    [name]=\"name\"\n                    [showTooltips]=\"showTooltips\"\n                    [tooltipPosition]=\"tooltipPosition\"\n                ></nice-vertical-navigation-basic-item>\n\n                <!-- Collapsable -->\n                <nice-vertical-navigation-collapsable-item\n                    *ngIf=\"item.type === 'collapsable'\"\n                    [item]=\"item\"\n                    [name]=\"name\"\n                    [autoCollapse]=\"autoCollapse\"\n                    [showTooltips]=\"showTooltips\"\n                    [tooltipPosition]=\"tooltipPosition\"\n                ></nice-vertical-navigation-collapsable-item>\n\n                <!-- Divider -->\n                <nice-vertical-navigation-divider-item\n                    *ngIf=\"item.type === 'divider'\"\n                    [item]=\"item\"\n                    [name]=\"name\"\n                ></nice-vertical-navigation-divider-item>\n\n                <!-- Group -->\n                <nice-vertical-navigation-group-item\n                    *ngIf=\"item.type === 'group'\"\n                    [item]=\"item\"\n                    [name]=\"name\"\n                    [showTooltips]=\"showTooltips\"\n                    [tooltipPosition]=\"tooltipPosition\"\n                ></nice-vertical-navigation-group-item>\n\n                <!-- Spacer -->\n                <nice-vertical-navigation-spacer-item\n                    *ngIf=\"item.type === 'spacer'\"\n                    [item]=\"item\"\n                    [name]=\"name\"\n                ></nice-vertical-navigation-spacer-item>\n            </ng-container>\n        </ng-container>\n    </div>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i5.NiceVerticalNavigationBasicItemComponent, selector: "nice-vertical-navigation-basic-item", inputs: ["item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: i6.NiceVerticalNavigationCollapsableItemComponent, selector: "nice-vertical-navigation-collapsable-item", inputs: ["autoCollapse", "item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: i7.NiceVerticalNavigationDividerItemComponent, selector: "nice-vertical-navigation-divider-item", inputs: ["item", "name"] }, { kind: "component", type: i8.NiceVerticalNavigationGroupItemComponent, selector: "nice-vertical-navigation-group-item", inputs: ["autoCollapse", "item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: i9.NiceVerticalNavigationSpacerItemComponent, selector: "nice-vertical-navigation-spacer-item", inputs: ["item", "name"] }, { kind: "pipe", type: i10.NiceTranslateWithContextPipe, name: "niceTranslateWithContext" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.10", ngImport: i0, type: NiceVerticalNavigationAsideItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NiceVerticalNavigationAsideItemComponent, decorators: [{
             type: Component,
             args: [{ selector: "nice-vertical-navigation-aside-item", changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n    class=\"nice-vertical-navigation-item-wrapper\"\n    [class.nice-vertical-navigation-item-has-subtitle]=\"!!item.subtitle\"\n    [ngClass]=\"item.classes?.wrapper\"\n>\n    <div\n        class=\"nice-vertical-navigation-item\"\n        [ngClass]=\"{\n            'nice-vertical-navigation-item-active': active,\n            'nice-vertical-navigation-item-disabled': item.disabled,\n            'nice-vertical-navigation-item-active-forced': item.active\n        }\"\n    >\n        <!-- Icon -->\n        <mat-icon\n                class=\"nice-vertical-navigation-item-icon\"\n                [ngClass]=\"item.classes?.icon\"\n                *ngIf=\"item.icon && item.iconType === 'material'\"\n        >\n            {{ item.icon }}\n        </mat-icon>\n\n        <span class=\"nice-vertical-navigation-item-icon\" [ngClass]=\"item.icon\" *ngIf=\"item.icon && item.iconType == 'fontawesome'\"></span>\n\n        <mat-icon\n                class=\"nice-vertical-navigation-item-icon\"\n                [ngClass]=\"item.classes?.icon\"\n                [svgIcon]=\"item.icon\"\n                *ngIf=\"item.icon && item.iconType === 'svg'\"\n        ></mat-icon>\n\n        <!-- Title & Subtitle -->\n        <div class=\"nice-vertical-navigation-item-title-wrapper\">\n            <div class=\"nice-vertical-navigation-item-title\">\n                <span [ngClass]=\"item.classes?.title\">\n                    {{ item.title | niceTranslateWithContext }}\n                </span>\n            </div>\n            <div\n                class=\"nice-vertical-navigation-item-subtitle\"\n                *ngIf=\"item.subtitle\"\n            >\n                <span [ngClass]=\"item.classes?.subtitle\">\n                    {{ item.subtitle | niceTranslateWithContext }}\n                </span>\n            </div>\n        </div>\n\n        <!-- Badge -->\n        <div\n            class=\"nice-vertical-navigation-item-badge\"\n            *ngIf=\"item.badge\"\n        >\n            <div\n                class=\"nice-vertical-navigation-item-badge-content\"\n                [ngClass]=\"item.badge.classes\"\n            >\n                {{ item.badge.title | niceTranslateWithContext }}\n            </div>\n        </div>\n    </div>\n</div>\n\n<ng-container *ngIf=\"!skipChildren\">\n    <div class=\"nice-vertical-navigation-item-children\">\n        <ng-container *ngFor=\"let item of item.children; trackBy: trackByFn\">\n            <!-- Skip the hidden items -->\n            <ng-container *ngIf=\"(item.hidden && !item.hidden(item)) || !item.hidden\">\n                <!-- Basic -->\n                <nice-vertical-navigation-basic-item\n                    *ngIf=\"item.type === 'basic'\"\n                    [item]=\"item\"\n                    [name]=\"name\"\n                    [showTooltips]=\"showTooltips\"\n                    [tooltipPosition]=\"tooltipPosition\"\n                ></nice-vertical-navigation-basic-item>\n\n                <!-- Collapsable -->\n                <nice-vertical-navigation-collapsable-item\n                    *ngIf=\"item.type === 'collapsable'\"\n                    [item]=\"item\"\n                    [name]=\"name\"\n                    [autoCollapse]=\"autoCollapse\"\n                    [showTooltips]=\"showTooltips\"\n                    [tooltipPosition]=\"tooltipPosition\"\n                ></nice-vertical-navigation-collapsable-item>\n\n                <!-- Divider -->\n                <nice-vertical-navigation-divider-item\n                    *ngIf=\"item.type === 'divider'\"\n                    [item]=\"item\"\n                    [name]=\"name\"\n                ></nice-vertical-navigation-divider-item>\n\n                <!-- Group -->\n                <nice-vertical-navigation-group-item\n                    *ngIf=\"item.type === 'group'\"\n                    [item]=\"item\"\n                    [name]=\"name\"\n                    [showTooltips]=\"showTooltips\"\n                    [tooltipPosition]=\"tooltipPosition\"\n                ></nice-vertical-navigation-group-item>\n\n                <!-- Spacer -->\n                <nice-vertical-navigation-spacer-item\n                    *ngIf=\"item.type === 'spacer'\"\n                    [item]=\"item\"\n                    [name]=\"name\"\n                ></nice-vertical-navigation-spacer-item>\n            </ng-container>\n        </ng-container>\n    </div>\n</ng-container>\n" }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.Router }, { type: i2.NiceNavigationService }], propDecorators: { activeItemId: [{