@recursyve/nice-ui-kit.v2 15.0.0-beta.126 → 15.0.0-beta.127
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/components/alert/alert.component.mjs +3 -3
- package/esm2020/lib/components/navigation/horizontal/components/basic/basic.component.mjs +11 -4
- package/esm2020/lib/components/navigation/horizontal/components/branch/branch.component.mjs +9 -3
- package/esm2020/lib/components/navigation/horizontal/horizontal.component.mjs +9 -3
- package/esm2020/lib/components/navigation/navigation.types.mjs +1 -1
- package/esm2020/lib/components/navigation/vertical/components/aside/aside.component.mjs +9 -3
- package/esm2020/lib/components/navigation/vertical/components/basic/basic.component.mjs +13 -6
- package/esm2020/lib/components/navigation/vertical/components/collapsable/collapsable.component.mjs +9 -3
- package/esm2020/lib/components/navigation/vertical/components/group/group.component.mjs +9 -3
- package/esm2020/lib/components/navigation/vertical/vertical.component.mjs +9 -3
- package/fesm2015/recursyve-nice-ui-kit.v2.mjs +68 -19
- package/fesm2015/recursyve-nice-ui-kit.v2.mjs.map +1 -1
- package/fesm2020/recursyve-nice-ui-kit.v2.mjs +68 -19
- package/fesm2020/recursyve-nice-ui-kit.v2.mjs.map +1 -1
- package/lib/components/navigation/horizontal/components/basic/basic.component.d.ts +4 -1
- package/lib/components/navigation/horizontal/components/branch/branch.component.d.ts +4 -1
- package/lib/components/navigation/horizontal/horizontal.component.d.ts +4 -1
- package/lib/components/navigation/navigation.types.d.ts +1 -0
- package/lib/components/navigation/vertical/components/aside/aside.component.d.ts +4 -1
- package/lib/components/navigation/vertical/components/basic/basic.component.d.ts +4 -1
- package/lib/components/navigation/vertical/components/collapsable/collapsable.component.d.ts +4 -1
- package/lib/components/navigation/vertical/components/group/group.component.d.ts +4 -1
- package/lib/components/navigation/vertical/vertical.component.d.ts +4 -1
- package/package.json +1 -1
- package/src/lib/components/navigation/vertical/vertical.theme.scss +11 -0
|
@@ -65,9 +65,10 @@ import * as i1$e from '@angular/cdk/scrolling';
|
|
|
65
65
|
import * as i3$1 from '@angular/cdk/bidi';
|
|
66
66
|
import * as i1$f from '@angular/material/snack-bar';
|
|
67
67
|
import { MAT_SNACK_BAR_DATA, MatSnackBarModule } from '@angular/material/snack-bar';
|
|
68
|
+
import * as i6 from '@angular/material/tooltip';
|
|
69
|
+
import { MatTooltipModule } from '@angular/material/tooltip';
|
|
68
70
|
import PerfectScrollbar from 'perfect-scrollbar';
|
|
69
71
|
import { MatDividerModule } from '@angular/material/divider';
|
|
70
|
-
import { MatTooltipModule } from '@angular/material/tooltip';
|
|
71
72
|
import * as i1$h from '@angular/material/dialog';
|
|
72
73
|
import { MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
|
|
73
74
|
import * as i3$2 from '@angular/material/button-toggle';
|
|
@@ -935,10 +936,10 @@ class NiceAlertComponent {
|
|
|
935
936
|
}
|
|
936
937
|
}
|
|
937
938
|
NiceAlertComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceAlertComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: NiceAlertService }, { token: NiceUtilsService }], target: i0.ɵɵFactoryTarget.Component });
|
|
938
|
-
NiceAlertComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceAlertComponent, selector: "nice-alert", inputs: { appearance: "appearance", dismissed: "dismissed", dismissible: "dismissible", disableAnimation: "disableAnimation", name: "name", showIcon: "showIcon", type: "type", color: "color" }, outputs: { dismissedChanged: "dismissedChanged" }, host: { properties: { "class": "this.classList" } }, exportAs: ["niceAlert"], usesOnChanges: true, ngImport: i0, template: "<div\n class=\"nice-alert-container\"\n *ngIf=\"!dismissible || dismissible && !dismissed\"\n [@fadeIn]=\"!dismissed && !disableAnimation\"\n [@fadeOut]=\"!dismissed && !disableAnimation\">\n\n <!-- Border -->\n <div\n class=\"nice-alert-border\"\n *ngIf=\"appearance === 'border'\"></div>\n\n <!-- Icon -->\n <div\n class=\"nice-alert-icon\"\n *ngIf=\"showIcon\">\n\n <!-- Custom icon -->\n <div class=\"nice-alert-custom-icon\">\n <ng-content select=\"[niceAlertIcon]\"></ng-content>\n </div>\n\n <!-- Default icons -->\n <div class=\"nice-alert-default-icon\">\n\n <mat-icon\n *ngIf=\"type === 'primary'\"\n [svgIcon]=\"'heroicons_solid:check-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'accent'\"\n [svgIcon]=\"'heroicons_solid:check-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'warn'\"\n [svgIcon]=\"'heroicons_solid:x-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'basic'\"\n [svgIcon]=\"'heroicons_solid:check-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'info'\"\n [svgIcon]=\"'heroicons_solid:information-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'success'\"\n [svgIcon]=\"'heroicons_solid:check-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'warning'\"\n [svgIcon]=\"'heroicons_solid:exclamation'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'error'\"\n [svgIcon]=\"'heroicons_solid:x-circle'\"></mat-icon>\n\n </div>\n\n </div>\n\n <!-- Content -->\n <div class=\"nice-alert-content\">\n\n <div class=\"nice-alert-title\">\n <ng-content select=\"[niceAlertTitle]\"></ng-content>\n </div>\n\n <div class=\"nice-alert-message\">\n <ng-content></ng-content>\n </div>\n\n </div>\n\n <!-- Dismiss button -->\n <button\n class=\"nice-alert-dismiss-button\"\n mat-icon-button\n (click)=\"dismiss()\">\n <mat-icon [svgIcon]=\"'heroicons_solid:x'\"></mat-icon>\n </button>\n\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], animations: niceAnimations, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
939
|
+
NiceAlertComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceAlertComponent, selector: "nice-alert", inputs: { appearance: "appearance", dismissed: "dismissed", dismissible: "dismissible", disableAnimation: "disableAnimation", name: "name", showIcon: "showIcon", type: "type", color: "color" }, outputs: { dismissedChanged: "dismissedChanged" }, host: { properties: { "class": "this.classList" } }, exportAs: ["niceAlert"], usesOnChanges: true, ngImport: i0, template: "<div\n class=\"nice-alert-container\"\n *ngIf=\"!dismissible || dismissible && !dismissed\"\n [@fadeIn]=\"!dismissed && !disableAnimation\"\n [@fadeOut]=\"!dismissed && !disableAnimation\">\n\n <!-- Border -->\n <div\n class=\"nice-alert-border\"\n *ngIf=\"appearance === 'border'\"></div>\n\n <!-- Icon -->\n <div\n class=\"nice-alert-icon\"\n *ngIf=\"showIcon\">\n\n <!-- Custom icon -->\n <div class=\"nice-alert-custom-icon\">\n <ng-content select=\"[niceAlertIcon]\"></ng-content>\n </div>\n\n <!-- Default icons -->\n <div class=\"nice-alert-default-icon\">\n\n <mat-icon\n *ngIf=\"type === 'primary'\"\n [svgIcon]=\"'heroicons_solid:check-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'accent'\"\n [svgIcon]=\"'heroicons_solid:check-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'warn'\"\n [svgIcon]=\"'heroicons_solid:x-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'basic'\"\n [svgIcon]=\"'heroicons_solid:check-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'info'\"\n [svgIcon]=\"'heroicons_solid:information-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'success'\"\n [svgIcon]=\"'heroicons_solid:check-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'warning'\"\n [svgIcon]=\"'heroicons_solid:exclamation-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'error'\"\n [svgIcon]=\"'heroicons_solid:x-circle'\"></mat-icon>\n\n </div>\n\n </div>\n\n <!-- Content -->\n <div class=\"nice-alert-content\">\n\n <div class=\"nice-alert-title\">\n <ng-content select=\"[niceAlertTitle]\"></ng-content>\n </div>\n\n <div class=\"nice-alert-message\">\n <ng-content></ng-content>\n </div>\n\n </div>\n\n <!-- Dismiss button -->\n <button\n class=\"nice-alert-dismiss-button\"\n mat-icon-button\n (click)=\"dismiss()\">\n <mat-icon [svgIcon]=\"'heroicons_solid:x'\"></mat-icon>\n </button>\n\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], animations: niceAnimations, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
939
940
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceAlertComponent, decorators: [{
|
|
940
941
|
type: Component,
|
|
941
|
-
args: [{ selector: "nice-alert", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, animations: niceAnimations, exportAs: "niceAlert", template: "<div\n class=\"nice-alert-container\"\n *ngIf=\"!dismissible || dismissible && !dismissed\"\n [@fadeIn]=\"!dismissed && !disableAnimation\"\n [@fadeOut]=\"!dismissed && !disableAnimation\">\n\n <!-- Border -->\n <div\n class=\"nice-alert-border\"\n *ngIf=\"appearance === 'border'\"></div>\n\n <!-- Icon -->\n <div\n class=\"nice-alert-icon\"\n *ngIf=\"showIcon\">\n\n <!-- Custom icon -->\n <div class=\"nice-alert-custom-icon\">\n <ng-content select=\"[niceAlertIcon]\"></ng-content>\n </div>\n\n <!-- Default icons -->\n <div class=\"nice-alert-default-icon\">\n\n <mat-icon\n *ngIf=\"type === 'primary'\"\n [svgIcon]=\"'heroicons_solid:check-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'accent'\"\n [svgIcon]=\"'heroicons_solid:check-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'warn'\"\n [svgIcon]=\"'heroicons_solid:x-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'basic'\"\n [svgIcon]=\"'heroicons_solid:check-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'info'\"\n [svgIcon]=\"'heroicons_solid:information-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'success'\"\n [svgIcon]=\"'heroicons_solid:check-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'warning'\"\n [svgIcon]=\"'heroicons_solid:exclamation'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'error'\"\n [svgIcon]=\"'heroicons_solid:x-circle'\"></mat-icon>\n\n </div>\n\n </div>\n\n <!-- Content -->\n <div class=\"nice-alert-content\">\n\n <div class=\"nice-alert-title\">\n <ng-content select=\"[niceAlertTitle]\"></ng-content>\n </div>\n\n <div class=\"nice-alert-message\">\n <ng-content></ng-content>\n </div>\n\n </div>\n\n <!-- Dismiss button -->\n <button\n class=\"nice-alert-dismiss-button\"\n mat-icon-button\n (click)=\"dismiss()\">\n <mat-icon [svgIcon]=\"'heroicons_solid:x'\"></mat-icon>\n </button>\n\n</div>\n" }]
|
|
942
|
+
args: [{ selector: "nice-alert", encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, animations: niceAnimations, exportAs: "niceAlert", template: "<div\n class=\"nice-alert-container\"\n *ngIf=\"!dismissible || dismissible && !dismissed\"\n [@fadeIn]=\"!dismissed && !disableAnimation\"\n [@fadeOut]=\"!dismissed && !disableAnimation\">\n\n <!-- Border -->\n <div\n class=\"nice-alert-border\"\n *ngIf=\"appearance === 'border'\"></div>\n\n <!-- Icon -->\n <div\n class=\"nice-alert-icon\"\n *ngIf=\"showIcon\">\n\n <!-- Custom icon -->\n <div class=\"nice-alert-custom-icon\">\n <ng-content select=\"[niceAlertIcon]\"></ng-content>\n </div>\n\n <!-- Default icons -->\n <div class=\"nice-alert-default-icon\">\n\n <mat-icon\n *ngIf=\"type === 'primary'\"\n [svgIcon]=\"'heroicons_solid:check-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'accent'\"\n [svgIcon]=\"'heroicons_solid:check-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'warn'\"\n [svgIcon]=\"'heroicons_solid:x-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'basic'\"\n [svgIcon]=\"'heroicons_solid:check-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'info'\"\n [svgIcon]=\"'heroicons_solid:information-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'success'\"\n [svgIcon]=\"'heroicons_solid:check-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'warning'\"\n [svgIcon]=\"'heroicons_solid:exclamation-circle'\"></mat-icon>\n\n <mat-icon\n *ngIf=\"type === 'error'\"\n [svgIcon]=\"'heroicons_solid:x-circle'\"></mat-icon>\n\n </div>\n\n </div>\n\n <!-- Content -->\n <div class=\"nice-alert-content\">\n\n <div class=\"nice-alert-title\">\n <ng-content select=\"[niceAlertTitle]\"></ng-content>\n </div>\n\n <div class=\"nice-alert-message\">\n <ng-content></ng-content>\n </div>\n\n </div>\n\n <!-- Dismiss button -->\n <button\n class=\"nice-alert-dismiss-button\"\n mat-icon-button\n (click)=\"dismiss()\">\n <mat-icon [svgIcon]=\"'heroicons_solid:x'\"></mat-icon>\n </button>\n\n</div>\n" }]
|
|
942
943
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: NiceAlertService }, { type: NiceUtilsService }]; }, propDecorators: { appearance: [{
|
|
943
944
|
type: Input
|
|
944
945
|
}], dismissed: [{
|
|
@@ -7788,6 +7789,8 @@ class NiceHorizontalNavigationBasicItemComponent {
|
|
|
7788
7789
|
this._changeDetectorRef = _changeDetectorRef;
|
|
7789
7790
|
this._niceNavigationService = _niceNavigationService;
|
|
7790
7791
|
this._unsubscribeAll = new Subject();
|
|
7792
|
+
this.showTooltips = false;
|
|
7793
|
+
this.tooltipPosition = "after";
|
|
7791
7794
|
}
|
|
7792
7795
|
// -----------------------------------------------------------------------------------------------------
|
|
7793
7796
|
// @ Lifecycle hooks
|
|
@@ -7814,14 +7817,18 @@ class NiceHorizontalNavigationBasicItemComponent {
|
|
|
7814
7817
|
}
|
|
7815
7818
|
}
|
|
7816
7819
|
NiceHorizontalNavigationBasicItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceHorizontalNavigationBasicItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: NiceNavigationService }], target: i0.ɵɵFactoryTarget.Component });
|
|
7817
|
-
NiceHorizontalNavigationBasicItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceHorizontalNavigationBasicItemComponent, selector: "nice-horizontal-navigation-basic-item", inputs: { item: "item", name: "name" }, 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>\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 | translate }}\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 | translate }}\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 | translate }}\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: i1$b.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$b.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: i4$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
7820
|
+
NiceHorizontalNavigationBasicItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", 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 | translate\"\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 | translate }}\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 | translate }}\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 | translate }}\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: i1$b.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$b.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: i4$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i6.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
7818
7821
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceHorizontalNavigationBasicItemComponent, decorators: [{
|
|
7819
7822
|
type: Component,
|
|
7820
|
-
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>\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 | translate }}\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 | translate }}\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 | translate }}\n </div>\n </div>\n</ng-template>\n" }]
|
|
7823
|
+
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 | translate\"\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 | translate }}\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 | translate }}\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 | translate }}\n </div>\n </div>\n</ng-template>\n" }]
|
|
7821
7824
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: NiceNavigationService }]; }, propDecorators: { item: [{
|
|
7822
7825
|
type: Input
|
|
7823
7826
|
}], name: [{
|
|
7824
7827
|
type: Input
|
|
7828
|
+
}], showTooltips: [{
|
|
7829
|
+
type: Input
|
|
7830
|
+
}], tooltipPosition: [{
|
|
7831
|
+
type: Input
|
|
7825
7832
|
}] } });
|
|
7826
7833
|
|
|
7827
7834
|
class NiceHorizontalNavigationDividerItemComponent {
|
|
@@ -7905,6 +7912,8 @@ class NiceHorizontalNavigationBranchItemComponent {
|
|
|
7905
7912
|
this._niceNavigationService = _niceNavigationService;
|
|
7906
7913
|
this._unsubscribeAll = new Subject();
|
|
7907
7914
|
this.child = false;
|
|
7915
|
+
this.showTooltips = false;
|
|
7916
|
+
this.tooltipPosition = "after";
|
|
7908
7917
|
}
|
|
7909
7918
|
// -----------------------------------------------------------------------------------------------------
|
|
7910
7919
|
// @ Lifecycle hooks
|
|
@@ -7941,10 +7950,10 @@ class NiceHorizontalNavigationBranchItemComponent {
|
|
|
7941
7950
|
}
|
|
7942
7951
|
}
|
|
7943
7952
|
NiceHorizontalNavigationBranchItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceHorizontalNavigationBranchItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: NiceNavigationService }], target: i0.ɵɵFactoryTarget.Component });
|
|
7944
|
-
NiceHorizontalNavigationBranchItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceHorizontalNavigationBranchItemComponent, selector: "nice-horizontal-navigation-branch-item", inputs: { child: "child", item: "item", name: "name" }, 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 ></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 #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 | translate }}\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 | translate }}\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 | translate }}\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: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i4$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: NiceHorizontalNavigationBasicItemComponent, selector: "nice-horizontal-navigation-basic-item", inputs: ["item", "name"] }, { kind: "component", type: NiceHorizontalNavigationBranchItemComponent, selector: "nice-horizontal-navigation-branch-item", inputs: ["child", "item", "name"] }, { kind: "component", type: NiceHorizontalNavigationDividerItemComponent, selector: "nice-horizontal-navigation-divider-item", inputs: ["item", "name"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: NiceShouldHidePipe, name: "niceShouldHide" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
7953
|
+
NiceHorizontalNavigationBranchItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", 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 | translate }}\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 | translate }}\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 | translate }}\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: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4$1.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i4$1.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4$1.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: 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: NiceHorizontalNavigationDividerItemComponent, selector: "nice-horizontal-navigation-divider-item", inputs: ["item", "name"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: NiceShouldHidePipe, name: "niceShouldHide" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
7945
7954
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceHorizontalNavigationBranchItemComponent, decorators: [{
|
|
7946
7955
|
type: Component,
|
|
7947
|
-
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 ></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 #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 | translate }}\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 | translate }}\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 | translate }}\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n" }]
|
|
7956
|
+
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 | translate }}\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 | translate }}\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 | translate }}\n </div>\n </div>\n </div>\n </div>\n</ng-template>\n" }]
|
|
7948
7957
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: NiceNavigationService }]; }, propDecorators: { child: [{
|
|
7949
7958
|
type: Input
|
|
7950
7959
|
}], item: [{
|
|
@@ -7954,6 +7963,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
7954
7963
|
}], matMenu: [{
|
|
7955
7964
|
type: ViewChild,
|
|
7956
7965
|
args: ["matMenu", { static: true }]
|
|
7966
|
+
}], showTooltips: [{
|
|
7967
|
+
type: Input
|
|
7968
|
+
}], tooltipPosition: [{
|
|
7969
|
+
type: Input
|
|
7957
7970
|
}] } });
|
|
7958
7971
|
|
|
7959
7972
|
class NiceHorizontalNavigationSpacerItemComponent {
|
|
@@ -8014,15 +8027,21 @@ class NiceHorizontalNavigationComponent extends NiceNavigationComponent {
|
|
|
8014
8027
|
constructor(_changeDetectorRef, _niceNavigationService, _niceUtilsService) {
|
|
8015
8028
|
super(_changeDetectorRef, _niceNavigationService, _niceUtilsService);
|
|
8016
8029
|
this.name = this._niceUtilsService.randomId();
|
|
8030
|
+
this.showTooltips = false;
|
|
8031
|
+
this.tooltipPosition = "after";
|
|
8017
8032
|
}
|
|
8018
8033
|
}
|
|
8019
8034
|
NiceHorizontalNavigationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceHorizontalNavigationComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: NiceNavigationService }, { token: NiceUtilsService }], target: i0.ɵɵFactoryTarget.Component });
|
|
8020
|
-
NiceHorizontalNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceHorizontalNavigationComponent, selector: "nice-horizontal-navigation", inputs: { name: "name", navigation: "navigation" }, 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 ></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 ></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: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: NiceHorizontalNavigationBasicItemComponent, selector: "nice-horizontal-navigation-basic-item", inputs: ["item", "name"] }, { kind: "component", type: NiceHorizontalNavigationBranchItemComponent, selector: "nice-horizontal-navigation-branch-item", inputs: ["child", "item", "name"] }, { kind: "component", type: NiceHorizontalNavigationSpacerItemComponent, selector: "nice-horizontal-navigation-spacer-item", inputs: ["item", "name"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: NiceShouldHidePipe, name: "niceShouldHide" }], animations: niceAnimations, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
8035
|
+
NiceHorizontalNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceHorizontalNavigationComponent, selector: "nice-horizontal-navigation", inputs: { name: "name", showTooltips: "showTooltips", tooltipPosition: "tooltipPosition", navigation: "navigation" }, 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: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: 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: NiceHorizontalNavigationSpacerItemComponent, selector: "nice-horizontal-navigation-spacer-item", inputs: ["item", "name"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: NiceShouldHidePipe, name: "niceShouldHide" }], animations: niceAnimations, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
8021
8036
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceHorizontalNavigationComponent, decorators: [{
|
|
8022
8037
|
type: Component,
|
|
8023
|
-
args: [{ selector: "nice-horizontal-navigation", animations: niceAnimations, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, 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 ></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 ></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" }]
|
|
8038
|
+
args: [{ selector: "nice-horizontal-navigation", animations: niceAnimations, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, 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" }]
|
|
8024
8039
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: NiceNavigationService }, { type: NiceUtilsService }]; }, propDecorators: { name: [{
|
|
8025
8040
|
type: Input
|
|
8041
|
+
}], showTooltips: [{
|
|
8042
|
+
type: Input
|
|
8043
|
+
}], tooltipPosition: [{
|
|
8044
|
+
type: Input
|
|
8026
8045
|
}], navigation: [{
|
|
8027
8046
|
type: Input
|
|
8028
8047
|
}] } });
|
|
@@ -8587,6 +8606,8 @@ class NiceVerticalNavigationBasicItemComponent {
|
|
|
8587
8606
|
this._route = _route;
|
|
8588
8607
|
this._router = _router;
|
|
8589
8608
|
this._unsubscribeAll = new Subject();
|
|
8609
|
+
this.showTooltips = false;
|
|
8610
|
+
this.tooltipPosition = "after";
|
|
8590
8611
|
this.itemActive$ = this._route.url.pipe(map(() => {
|
|
8591
8612
|
const url = this._router.url.split("?").shift();
|
|
8592
8613
|
if (this.item.exactMatch === true) {
|
|
@@ -8620,14 +8641,18 @@ class NiceVerticalNavigationBasicItemComponent {
|
|
|
8620
8641
|
}
|
|
8621
8642
|
}
|
|
8622
8643
|
NiceVerticalNavigationBasicItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceVerticalNavigationBasicItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: NiceNavigationService }, { token: NiceUtilsService }, { token: i1$b.ActivatedRoute }, { token: i1$b.Router }], target: i0.ɵɵFactoryTarget.Component });
|
|
8623
|
-
NiceVerticalNavigationBasicItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceVerticalNavigationBasicItemComponent, selector: "nice-vertical-navigation-basic-item", inputs: { item: "item", name: "name" }, ngImport: i0, template: "<!-- Item wrapper -->\n<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\n <!-- Item with an internal link -->\n <a\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"item.link && !item.externalLink && !item.function && !item.disabled\"\n [ngClass]=\"{'nice-vertical-navigation-item-active-forced': item.active}\"\n [routerLink]=\"[item.link]\"\n [routerLinkActive]=\"'nice-vertical-navigation-item-active'\"\n [routerLinkActiveOptions]=\"{exact: item.exactMatch || false}\"\n [queryParams]=\"item?.queryParams\"\n [state]=\"item?.state\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </a>\n\n <!-- Item with an external link -->\n <a\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"item.link && item.externalLink && !item.function && !item.disabled\"\n [href]=\"item.link\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </a>\n\n <!-- Item with a function -->\n <div\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"!item.link && item.function && !item.disabled\"\n [ngClass]=\"{'nice-vertical-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 <a\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"item.link && !item.externalLink && item.function && !item.disabled\"\n [ngClass]=\"{'nice-vertical-navigation-item-active-forced': item.active}\"\n [routerLink]=\"[item.link]\"\n [routerLinkActive]=\"'nice-vertical-navigation-item-active'\"\n [routerLinkActiveOptions]=\"{exact: item.exactMatch || false}\"\n (click)=\"item.function(item)\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </a>\n\n <!-- Item with an external link and function -->\n <a\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"item.link && item.externalLink && item.function && !item.disabled\"\n [href]=\"item.link\"\n (click)=\"item.function(item)\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </a>\n\n <!-- Item with a no link and no function -->\n <div\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"!item.link && !item.function && !item.disabled\"\n [ngClass]=\"{'nice-vertical-navigation-item-active-forced': item.active}\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </div>\n\n <!-- Item is disabled -->\n <div\n class=\"nice-vertical-navigation-item nice-vertical-navigation-item-disabled\"\n *ngIf=\"item.disabled\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </div>\n\n</div>\n\n<!-- Item template -->\n<ng-template #itemTemplate>\n <ng-container *ngIf=\"{ showHint: item | niceShouldShowHint | async } as ctx\">\n <!-- Icon -->\n <div class=\"nice-vertical-navigation-item-icon-wrapper\">\n <ng-container *ngIf=\"itemActive$ | async; else notActive\">\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.activeIcon || item.icon }}\n </mat-icon>\n\n <i class=\"nice-vertical-navigation-item-icon fontawesome\" [ngClass]=\"item.activeIcon || item.icon\" *ngIf=\"item.icon && item.iconType == 'fontawesome'\"></i>\n\n <mat-icon\n class=\"nice-vertical-navigation-item-icon\"\n [ngClass]=\"item.classes?.icon\"\n [svgIcon]=\"item.activeIcon || item.icon\"\n *ngIf=\"item.icon && item.iconType == 'svg'\"\n ></mat-icon>\n </ng-container>\n\n <ng-template #notActive>\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 <i class=\"nice-vertical-navigation-item-icon fontawesome\" [ngClass]=\"item.icon\" *ngIf=\"item.icon && item.iconType == 'fontawesome'\"></i>\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 </ng-template>\n\n <div *ngIf=\"ctx.showHint && item.icon\" class=\"nice-vertical-navigation-hint\"></div>\n </div>\n\n <!-- Title & Subtitle -->\n <div class=\"nice-vertical-navigation-item-title-wrapper\">\n <div class=\"nice-vertical-navigation-item-title\" niceShowHint [shouldShow]=\"ctx.showHint\" [item]=\"item\">\n <span [ngClass]=\"item.classes?.title\">\n {{ item.title | translate }}\n </span>\n\n <div *ngIf=\"ctx.showHint\" class=\"nice-vertical-navigation-hint\"></div>\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 | translate }}\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 | translate }}\n </div>\n </div>\n </ng-container>\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: i1$b.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$b.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: "directive", type: NiceShowHintDirective, selector: "[niceShowHint]", inputs: ["shouldShow", "item"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: NiceShouldShowHintPipe, name: "niceShouldShowHint" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
8644
|
+
NiceVerticalNavigationBasicItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceVerticalNavigationBasicItemComponent, selector: "nice-vertical-navigation-basic-item", inputs: { item: "item", name: "name", showTooltips: "showTooltips", tooltipPosition: "tooltipPosition" }, ngImport: i0, template: "<!-- Item wrapper -->\n<div\n class=\"nice-vertical-navigation-item-wrapper\"\n matTooltipClass=\"nice-vertical-navigation-item-tooltips\"\n [class.nice-vertical-navigation-item-has-subtitle]=\"!!item.subtitle\"\n [ngClass]=\"item.classes?.wrapper\"\n [matTooltip]=\"item.tooltip | translate\"\n [matTooltipDisabled]=\"!showTooltips\"\n [matTooltipPosition]=\"tooltipPosition\"\n>\n\n <!-- Item with an internal link -->\n <a\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"item.link && !item.externalLink && !item.function && !item.disabled\"\n [ngClass]=\"{'nice-vertical-navigation-item-active-forced': item.active}\"\n [routerLink]=\"[item.link]\"\n [routerLinkActive]=\"'nice-vertical-navigation-item-active'\"\n [routerLinkActiveOptions]=\"{exact: item.exactMatch || false}\"\n [queryParams]=\"item?.queryParams\"\n [state]=\"item?.state\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </a>\n\n <!-- Item with an external link -->\n <a\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"item.link && item.externalLink && !item.function && !item.disabled\"\n [href]=\"item.link\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </a>\n\n <!-- Item with a function -->\n <div\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"!item.link && item.function && !item.disabled\"\n [ngClass]=\"{'nice-vertical-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 <a\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"item.link && !item.externalLink && item.function && !item.disabled\"\n [ngClass]=\"{'nice-vertical-navigation-item-active-forced': item.active}\"\n [routerLink]=\"[item.link]\"\n [routerLinkActive]=\"'nice-vertical-navigation-item-active'\"\n [routerLinkActiveOptions]=\"{exact: item.exactMatch || false}\"\n (click)=\"item.function(item)\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </a>\n\n <!-- Item with an external link and function -->\n <a\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"item.link && item.externalLink && item.function && !item.disabled\"\n [href]=\"item.link\"\n (click)=\"item.function(item)\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </a>\n\n <!-- Item with a no link and no function -->\n <div\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"!item.link && !item.function && !item.disabled\"\n [ngClass]=\"{'nice-vertical-navigation-item-active-forced': item.active}\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </div>\n\n <!-- Item is disabled -->\n <div\n class=\"nice-vertical-navigation-item nice-vertical-navigation-item-disabled\"\n *ngIf=\"item.disabled\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </div>\n\n</div>\n\n<!-- Item template -->\n<ng-template #itemTemplate>\n <ng-container *ngIf=\"{ showHint: item | niceShouldShowHint | async } as ctx\">\n <!-- Icon -->\n <div class=\"nice-vertical-navigation-item-icon-wrapper\">\n <ng-container *ngIf=\"itemActive$ | async; else notActive\">\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.activeIcon || item.icon }}\n </mat-icon>\n\n <i class=\"nice-vertical-navigation-item-icon fontawesome\" [ngClass]=\"item.activeIcon || item.icon\" *ngIf=\"item.icon && item.iconType == 'fontawesome'\"></i>\n\n <mat-icon\n class=\"nice-vertical-navigation-item-icon\"\n [ngClass]=\"item.classes?.icon\"\n [svgIcon]=\"item.activeIcon || item.icon\"\n *ngIf=\"item.icon && item.iconType == 'svg'\"\n ></mat-icon>\n </ng-container>\n\n <ng-template #notActive>\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 <i class=\"nice-vertical-navigation-item-icon fontawesome\" [ngClass]=\"item.icon\" *ngIf=\"item.icon && item.iconType == 'fontawesome'\"></i>\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 </ng-template>\n\n <div *ngIf=\"ctx.showHint && item.icon\" class=\"nice-vertical-navigation-hint\"></div>\n </div>\n\n <!-- Title & Subtitle -->\n <div class=\"nice-vertical-navigation-item-title-wrapper\">\n <div class=\"nice-vertical-navigation-item-title\" niceShowHint [shouldShow]=\"ctx.showHint\" [item]=\"item\">\n <span [ngClass]=\"item.classes?.title\">\n {{ item.title | translate }}\n </span>\n\n <div *ngIf=\"ctx.showHint\" class=\"nice-vertical-navigation-hint\"></div>\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 | translate }}\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 | translate }}\n </div>\n </div>\n </ng-container>\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: i1$b.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$b.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: "directive", type: i6.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "directive", type: NiceShowHintDirective, selector: "[niceShowHint]", inputs: ["shouldShow", "item"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: NiceShouldShowHintPipe, name: "niceShouldShowHint" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
8624
8645
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceVerticalNavigationBasicItemComponent, decorators: [{
|
|
8625
8646
|
type: Component,
|
|
8626
|
-
args: [{ selector: "nice-vertical-navigation-basic-item", changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Item wrapper -->\n<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\n <!-- Item with an internal link -->\n <a\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"item.link && !item.externalLink && !item.function && !item.disabled\"\n [ngClass]=\"{'nice-vertical-navigation-item-active-forced': item.active}\"\n [routerLink]=\"[item.link]\"\n [routerLinkActive]=\"'nice-vertical-navigation-item-active'\"\n [routerLinkActiveOptions]=\"{exact: item.exactMatch || false}\"\n [queryParams]=\"item?.queryParams\"\n [state]=\"item?.state\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </a>\n\n <!-- Item with an external link -->\n <a\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"item.link && item.externalLink && !item.function && !item.disabled\"\n [href]=\"item.link\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </a>\n\n <!-- Item with a function -->\n <div\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"!item.link && item.function && !item.disabled\"\n [ngClass]=\"{'nice-vertical-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 <a\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"item.link && !item.externalLink && item.function && !item.disabled\"\n [ngClass]=\"{'nice-vertical-navigation-item-active-forced': item.active}\"\n [routerLink]=\"[item.link]\"\n [routerLinkActive]=\"'nice-vertical-navigation-item-active'\"\n [routerLinkActiveOptions]=\"{exact: item.exactMatch || false}\"\n (click)=\"item.function(item)\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </a>\n\n <!-- Item with an external link and function -->\n <a\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"item.link && item.externalLink && item.function && !item.disabled\"\n [href]=\"item.link\"\n (click)=\"item.function(item)\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </a>\n\n <!-- Item with a no link and no function -->\n <div\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"!item.link && !item.function && !item.disabled\"\n [ngClass]=\"{'nice-vertical-navigation-item-active-forced': item.active}\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </div>\n\n <!-- Item is disabled -->\n <div\n class=\"nice-vertical-navigation-item nice-vertical-navigation-item-disabled\"\n *ngIf=\"item.disabled\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </div>\n\n</div>\n\n<!-- Item template -->\n<ng-template #itemTemplate>\n <ng-container *ngIf=\"{ showHint: item | niceShouldShowHint | async } as ctx\">\n <!-- Icon -->\n <div class=\"nice-vertical-navigation-item-icon-wrapper\">\n <ng-container *ngIf=\"itemActive$ | async; else notActive\">\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.activeIcon || item.icon }}\n </mat-icon>\n\n <i class=\"nice-vertical-navigation-item-icon fontawesome\" [ngClass]=\"item.activeIcon || item.icon\" *ngIf=\"item.icon && item.iconType == 'fontawesome'\"></i>\n\n <mat-icon\n class=\"nice-vertical-navigation-item-icon\"\n [ngClass]=\"item.classes?.icon\"\n [svgIcon]=\"item.activeIcon || item.icon\"\n *ngIf=\"item.icon && item.iconType == 'svg'\"\n ></mat-icon>\n </ng-container>\n\n <ng-template #notActive>\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 <i class=\"nice-vertical-navigation-item-icon fontawesome\" [ngClass]=\"item.icon\" *ngIf=\"item.icon && item.iconType == 'fontawesome'\"></i>\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 </ng-template>\n\n <div *ngIf=\"ctx.showHint && item.icon\" class=\"nice-vertical-navigation-hint\"></div>\n </div>\n\n <!-- Title & Subtitle -->\n <div class=\"nice-vertical-navigation-item-title-wrapper\">\n <div class=\"nice-vertical-navigation-item-title\" niceShowHint [shouldShow]=\"ctx.showHint\" [item]=\"item\">\n <span [ngClass]=\"item.classes?.title\">\n {{ item.title | translate }}\n </span>\n\n <div *ngIf=\"ctx.showHint\" class=\"nice-vertical-navigation-hint\"></div>\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 | translate }}\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 | translate }}\n </div>\n </div>\n </ng-container>\n</ng-template>\n" }]
|
|
8647
|
+
args: [{ selector: "nice-vertical-navigation-basic-item", changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Item wrapper -->\n<div\n class=\"nice-vertical-navigation-item-wrapper\"\n matTooltipClass=\"nice-vertical-navigation-item-tooltips\"\n [class.nice-vertical-navigation-item-has-subtitle]=\"!!item.subtitle\"\n [ngClass]=\"item.classes?.wrapper\"\n [matTooltip]=\"item.tooltip | translate\"\n [matTooltipDisabled]=\"!showTooltips\"\n [matTooltipPosition]=\"tooltipPosition\"\n>\n\n <!-- Item with an internal link -->\n <a\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"item.link && !item.externalLink && !item.function && !item.disabled\"\n [ngClass]=\"{'nice-vertical-navigation-item-active-forced': item.active}\"\n [routerLink]=\"[item.link]\"\n [routerLinkActive]=\"'nice-vertical-navigation-item-active'\"\n [routerLinkActiveOptions]=\"{exact: item.exactMatch || false}\"\n [queryParams]=\"item?.queryParams\"\n [state]=\"item?.state\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </a>\n\n <!-- Item with an external link -->\n <a\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"item.link && item.externalLink && !item.function && !item.disabled\"\n [href]=\"item.link\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </a>\n\n <!-- Item with a function -->\n <div\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"!item.link && item.function && !item.disabled\"\n [ngClass]=\"{'nice-vertical-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 <a\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"item.link && !item.externalLink && item.function && !item.disabled\"\n [ngClass]=\"{'nice-vertical-navigation-item-active-forced': item.active}\"\n [routerLink]=\"[item.link]\"\n [routerLinkActive]=\"'nice-vertical-navigation-item-active'\"\n [routerLinkActiveOptions]=\"{exact: item.exactMatch || false}\"\n (click)=\"item.function(item)\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </a>\n\n <!-- Item with an external link and function -->\n <a\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"item.link && item.externalLink && item.function && !item.disabled\"\n [href]=\"item.link\"\n (click)=\"item.function(item)\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </a>\n\n <!-- Item with a no link and no function -->\n <div\n class=\"nice-vertical-navigation-item\"\n *ngIf=\"!item.link && !item.function && !item.disabled\"\n [ngClass]=\"{'nice-vertical-navigation-item-active-forced': item.active}\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </div>\n\n <!-- Item is disabled -->\n <div\n class=\"nice-vertical-navigation-item nice-vertical-navigation-item-disabled\"\n *ngIf=\"item.disabled\">\n <ng-container *ngTemplateOutlet=\"itemTemplate\"></ng-container>\n </div>\n\n</div>\n\n<!-- Item template -->\n<ng-template #itemTemplate>\n <ng-container *ngIf=\"{ showHint: item | niceShouldShowHint | async } as ctx\">\n <!-- Icon -->\n <div class=\"nice-vertical-navigation-item-icon-wrapper\">\n <ng-container *ngIf=\"itemActive$ | async; else notActive\">\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.activeIcon || item.icon }}\n </mat-icon>\n\n <i class=\"nice-vertical-navigation-item-icon fontawesome\" [ngClass]=\"item.activeIcon || item.icon\" *ngIf=\"item.icon && item.iconType == 'fontawesome'\"></i>\n\n <mat-icon\n class=\"nice-vertical-navigation-item-icon\"\n [ngClass]=\"item.classes?.icon\"\n [svgIcon]=\"item.activeIcon || item.icon\"\n *ngIf=\"item.icon && item.iconType == 'svg'\"\n ></mat-icon>\n </ng-container>\n\n <ng-template #notActive>\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 <i class=\"nice-vertical-navigation-item-icon fontawesome\" [ngClass]=\"item.icon\" *ngIf=\"item.icon && item.iconType == 'fontawesome'\"></i>\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 </ng-template>\n\n <div *ngIf=\"ctx.showHint && item.icon\" class=\"nice-vertical-navigation-hint\"></div>\n </div>\n\n <!-- Title & Subtitle -->\n <div class=\"nice-vertical-navigation-item-title-wrapper\">\n <div class=\"nice-vertical-navigation-item-title\" niceShowHint [shouldShow]=\"ctx.showHint\" [item]=\"item\">\n <span [ngClass]=\"item.classes?.title\">\n {{ item.title | translate }}\n </span>\n\n <div *ngIf=\"ctx.showHint\" class=\"nice-vertical-navigation-hint\"></div>\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 | translate }}\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 | translate }}\n </div>\n </div>\n </ng-container>\n</ng-template>\n" }]
|
|
8627
8648
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: NiceNavigationService }, { type: NiceUtilsService }, { type: i1$b.ActivatedRoute }, { type: i1$b.Router }]; }, propDecorators: { item: [{
|
|
8628
8649
|
type: Input
|
|
8629
8650
|
}], name: [{
|
|
8630
8651
|
type: Input
|
|
8652
|
+
}], showTooltips: [{
|
|
8653
|
+
type: Input
|
|
8654
|
+
}], tooltipPosition: [{
|
|
8655
|
+
type: Input
|
|
8631
8656
|
}] } });
|
|
8632
8657
|
|
|
8633
8658
|
class NiceVerticalNavigationDividerItemComponent {
|
|
@@ -8727,6 +8752,8 @@ class NiceVerticalNavigationCollapsableItemComponent {
|
|
|
8727
8752
|
this._router = _router;
|
|
8728
8753
|
this._niceNavigationService = _niceNavigationService;
|
|
8729
8754
|
this._unsubscribeAll = new Subject();
|
|
8755
|
+
this.showTooltips = false;
|
|
8756
|
+
this.tooltipPosition = "after";
|
|
8730
8757
|
this.isCollapsed = true;
|
|
8731
8758
|
this.isExpanded = false;
|
|
8732
8759
|
this.hasChildActivated$ = new BehaviorSubject(false);
|
|
@@ -8944,16 +8971,20 @@ class NiceVerticalNavigationCollapsableItemComponent {
|
|
|
8944
8971
|
}
|
|
8945
8972
|
}
|
|
8946
8973
|
NiceVerticalNavigationCollapsableItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceVerticalNavigationCollapsableItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$b.Router }, { token: NiceNavigationService }], target: i0.ɵɵFactoryTarget.Component });
|
|
8947
|
-
NiceVerticalNavigationCollapsableItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceVerticalNavigationCollapsableItemComponent, selector: "nice-vertical-navigation-collapsable-item", inputs: { autoCollapse: "autoCollapse", item: "item", name: "name" }, host: { properties: { "class": "this.classList" } }, 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]=\"{ 'nice-vertical-navigation-item-disabled': item.disabled }\"\n [class.child-activated]=\"hasChildActivated$ | async\"\n (click)=\"toggleCollapsable()\"\n *ngIf=\"{ showHint: item.children ?? [] | niceShouldShowHint | async } as ctx\"\n >\n <!-- Icon -->\n <div class=\"nice-vertical-navigation-item-icon-wrapper\" style=\"position: relative\">\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 <i class=\"nice-vertical-navigation-item-icon fontawesome\" [ngClass]=\"item.icon\" *ngIf=\"item.icon && item.iconType == 'fontawesome'\"></i>\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 <div *ngIf=\"ctx.showHint && item.icon\" class=\"nice-vertical-navigation-hint\"></div>\n </div>\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 | translate }}\n </span>\n\n <div *ngIf=\"ctx.showHint && isCollapsed\" class=\"nice-vertical-navigation-hint\"></div>\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 | translate }}\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 | translate }}\n </div>\n </div>\n\n <!-- Arrow -->\n <mat-icon class=\"nice-vertical-navigation-item-arrow icon-size-4\">chevron_right</mat-icon>\n </div>\n</div>\n\n<div\n class=\"nice-vertical-navigation-item-children\"\n *ngIf=\"!isCollapsed\"\n @expandCollapse\n>\n <ng-container *ngFor=\"let item of item.children; trackBy: trackByFn\">\n <!-- Skip the hidden items -->\n <ng-container *ngIf=\"!(item | niceShouldHide | async)\">\n <!-- Basic -->\n <nice-vertical-navigation-basic-item\n *ngIf=\"item.type === 'basic'\"\n [item]=\"item\"\n [name]=\"name\"\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 ></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 ></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", 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: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: NiceVerticalNavigationBasicItemComponent, selector: "nice-vertical-navigation-basic-item", inputs: ["item", "name"] }, { kind: "component", type: NiceVerticalNavigationCollapsableItemComponent, selector: "nice-vertical-navigation-collapsable-item", inputs: ["autoCollapse", "item", "name"] }, { kind: "component", type: NiceVerticalNavigationDividerItemComponent, selector: "nice-vertical-navigation-divider-item", inputs: ["item", "name"] }, { kind: "component", type: NiceVerticalNavigationSpacerItemComponent, selector: "nice-vertical-navigation-spacer-item", inputs: ["item", "name"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: NiceShouldHidePipe, name: "niceShouldHide" }, { kind: "pipe", type: NiceShouldShowHintPipe, name: "niceShouldShowHint" }], animations: niceAnimations, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
8974
|
+
NiceVerticalNavigationCollapsableItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceVerticalNavigationCollapsableItemComponent, selector: "nice-vertical-navigation-collapsable-item", inputs: { autoCollapse: "autoCollapse", item: "item", name: "name", showTooltips: "showTooltips", tooltipPosition: "tooltipPosition" }, host: { properties: { "class": "this.classList" } }, 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]=\"{ 'nice-vertical-navigation-item-disabled': item.disabled }\"\n [class.child-activated]=\"hasChildActivated$ | async\"\n (click)=\"toggleCollapsable()\"\n *ngIf=\"{ showHint: item.children ?? [] | niceShouldShowHint | async } as ctx\"\n >\n <!-- Icon -->\n <div class=\"nice-vertical-navigation-item-icon-wrapper\" style=\"position: relative\">\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 <i class=\"nice-vertical-navigation-item-icon fontawesome\" [ngClass]=\"item.icon\" *ngIf=\"item.icon && item.iconType == 'fontawesome'\"></i>\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 <div *ngIf=\"ctx.showHint && item.icon\" class=\"nice-vertical-navigation-hint\"></div>\n </div>\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 | translate }}\n </span>\n\n <div *ngIf=\"ctx.showHint && isCollapsed\" class=\"nice-vertical-navigation-hint\"></div>\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 | translate }}\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 | translate }}\n </div>\n </div>\n\n <!-- Arrow -->\n <mat-icon class=\"nice-vertical-navigation-item-arrow icon-size-4\">chevron_right</mat-icon>\n </div>\n</div>\n\n<div\n class=\"nice-vertical-navigation-item-children\"\n *ngIf=\"!isCollapsed\"\n @expandCollapse\n>\n <ng-container *ngFor=\"let item of item.children; trackBy: trackByFn\">\n <!-- Skip the hidden items -->\n <ng-container *ngIf=\"!(item | niceShouldHide | async)\">\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 ></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", 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: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: NiceVerticalNavigationBasicItemComponent, selector: "nice-vertical-navigation-basic-item", inputs: ["item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: NiceVerticalNavigationCollapsableItemComponent, selector: "nice-vertical-navigation-collapsable-item", inputs: ["autoCollapse", "item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: NiceVerticalNavigationDividerItemComponent, selector: "nice-vertical-navigation-divider-item", inputs: ["item", "name"] }, { kind: "component", type: NiceVerticalNavigationSpacerItemComponent, selector: "nice-vertical-navigation-spacer-item", inputs: ["item", "name"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: NiceShouldHidePipe, name: "niceShouldHide" }, { kind: "pipe", type: NiceShouldShowHintPipe, name: "niceShouldShowHint" }], animations: niceAnimations, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
8948
8975
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceVerticalNavigationCollapsableItemComponent, decorators: [{
|
|
8949
8976
|
type: Component,
|
|
8950
|
-
args: [{ selector: "nice-vertical-navigation-collapsable-item", animations: niceAnimations, 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]=\"{ 'nice-vertical-navigation-item-disabled': item.disabled }\"\n [class.child-activated]=\"hasChildActivated$ | async\"\n (click)=\"toggleCollapsable()\"\n *ngIf=\"{ showHint: item.children ?? [] | niceShouldShowHint | async } as ctx\"\n >\n <!-- Icon -->\n <div class=\"nice-vertical-navigation-item-icon-wrapper\" style=\"position: relative\">\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 <i class=\"nice-vertical-navigation-item-icon fontawesome\" [ngClass]=\"item.icon\" *ngIf=\"item.icon && item.iconType == 'fontawesome'\"></i>\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 <div *ngIf=\"ctx.showHint && item.icon\" class=\"nice-vertical-navigation-hint\"></div>\n </div>\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 | translate }}\n </span>\n\n <div *ngIf=\"ctx.showHint && isCollapsed\" class=\"nice-vertical-navigation-hint\"></div>\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 | translate }}\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 | translate }}\n </div>\n </div>\n\n <!-- Arrow -->\n <mat-icon class=\"nice-vertical-navigation-item-arrow icon-size-4\">chevron_right</mat-icon>\n </div>\n</div>\n\n<div\n class=\"nice-vertical-navigation-item-children\"\n *ngIf=\"!isCollapsed\"\n @expandCollapse\n>\n <ng-container *ngFor=\"let item of item.children; trackBy: trackByFn\">\n <!-- Skip the hidden items -->\n <ng-container *ngIf=\"!(item | niceShouldHide | async)\">\n <!-- Basic -->\n <nice-vertical-navigation-basic-item\n *ngIf=\"item.type === 'basic'\"\n [item]=\"item\"\n [name]=\"name\"\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 ></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 ></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" }]
|
|
8977
|
+
args: [{ selector: "nice-vertical-navigation-collapsable-item", animations: niceAnimations, 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]=\"{ 'nice-vertical-navigation-item-disabled': item.disabled }\"\n [class.child-activated]=\"hasChildActivated$ | async\"\n (click)=\"toggleCollapsable()\"\n *ngIf=\"{ showHint: item.children ?? [] | niceShouldShowHint | async } as ctx\"\n >\n <!-- Icon -->\n <div class=\"nice-vertical-navigation-item-icon-wrapper\" style=\"position: relative\">\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 <i class=\"nice-vertical-navigation-item-icon fontawesome\" [ngClass]=\"item.icon\" *ngIf=\"item.icon && item.iconType == 'fontawesome'\"></i>\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 <div *ngIf=\"ctx.showHint && item.icon\" class=\"nice-vertical-navigation-hint\"></div>\n </div>\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 | translate }}\n </span>\n\n <div *ngIf=\"ctx.showHint && isCollapsed\" class=\"nice-vertical-navigation-hint\"></div>\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 | translate }}\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 | translate }}\n </div>\n </div>\n\n <!-- Arrow -->\n <mat-icon class=\"nice-vertical-navigation-item-arrow icon-size-4\">chevron_right</mat-icon>\n </div>\n</div>\n\n<div\n class=\"nice-vertical-navigation-item-children\"\n *ngIf=\"!isCollapsed\"\n @expandCollapse\n>\n <ng-container *ngFor=\"let item of item.children; trackBy: trackByFn\">\n <!-- Skip the hidden items -->\n <ng-container *ngIf=\"!(item | niceShouldHide | async)\">\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 ></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" }]
|
|
8951
8978
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$b.Router }, { type: NiceNavigationService }]; }, propDecorators: { autoCollapse: [{
|
|
8952
8979
|
type: Input
|
|
8953
8980
|
}], item: [{
|
|
8954
8981
|
type: Input
|
|
8955
8982
|
}], name: [{
|
|
8956
8983
|
type: Input
|
|
8984
|
+
}], showTooltips: [{
|
|
8985
|
+
type: Input
|
|
8986
|
+
}], tooltipPosition: [{
|
|
8987
|
+
type: Input
|
|
8957
8988
|
}], classList: [{
|
|
8958
8989
|
type: HostBinding,
|
|
8959
8990
|
args: ["class"]
|
|
@@ -8967,6 +8998,8 @@ class NiceVerticalNavigationGroupItemComponent {
|
|
|
8967
8998
|
this._changeDetectorRef = _changeDetectorRef;
|
|
8968
8999
|
this._niceNavigationService = _niceNavigationService;
|
|
8969
9000
|
this._unsubscribeAll = new Subject();
|
|
9001
|
+
this.showTooltips = false;
|
|
9002
|
+
this.tooltipPosition = "after";
|
|
8970
9003
|
}
|
|
8971
9004
|
// -----------------------------------------------------------------------------------------------------
|
|
8972
9005
|
// @ Lifecycle hooks
|
|
@@ -9002,16 +9035,20 @@ class NiceVerticalNavigationGroupItemComponent {
|
|
|
9002
9035
|
}
|
|
9003
9036
|
}
|
|
9004
9037
|
NiceVerticalNavigationGroupItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceVerticalNavigationGroupItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: NiceNavigationService }], target: i0.ɵɵFactoryTarget.Component });
|
|
9005
|
-
NiceVerticalNavigationGroupItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceVerticalNavigationGroupItemComponent, selector: "nice-vertical-navigation-group-item", inputs: { autoCollapse: "autoCollapse", item: "item", name: "name" }, ngImport: i0, template: "<!-- Item wrapper -->\n<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 class=\"nice-vertical-navigation-item\">\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\" *ngIf=\"item.title || item.subtitle\">\n <div class=\"nice-vertical-navigation-item-title\">\n <span [ngClass]=\"item.classes?.title\">\n {{ item.title | translate }}\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 | translate }}\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 | translate }}\n </div>\n </div>\n </div>\n</div>\n\n<ng-container *ngFor=\"let item of item.children; trackBy: trackByFn\">\n <!-- Skip the hidden items -->\n <ng-container *ngIf=\"!(item | niceShouldHide | async)\">\n <!-- Basic -->\n <nice-vertical-navigation-basic-item\n *ngIf=\"item.type === 'basic'\"\n [item]=\"item\"\n [name]=\"name\"\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 ></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 ></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", 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: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: NiceVerticalNavigationBasicItemComponent, selector: "nice-vertical-navigation-basic-item", inputs: ["item", "name"] }, { kind: "component", type: NiceVerticalNavigationCollapsableItemComponent, selector: "nice-vertical-navigation-collapsable-item", inputs: ["autoCollapse", "item", "name"] }, { kind: "component", type: NiceVerticalNavigationDividerItemComponent, selector: "nice-vertical-navigation-divider-item", inputs: ["item", "name"] }, { kind: "component", type: NiceVerticalNavigationGroupItemComponent, selector: "nice-vertical-navigation-group-item", inputs: ["autoCollapse", "item", "name"] }, { kind: "component", type: NiceVerticalNavigationSpacerItemComponent, selector: "nice-vertical-navigation-spacer-item", inputs: ["item", "name"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: NiceShouldHidePipe, name: "niceShouldHide" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
9038
|
+
NiceVerticalNavigationGroupItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceVerticalNavigationGroupItemComponent, selector: "nice-vertical-navigation-group-item", inputs: { autoCollapse: "autoCollapse", item: "item", name: "name", showTooltips: "showTooltips", tooltipPosition: "tooltipPosition" }, ngImport: i0, template: "<!-- Item wrapper -->\n<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 class=\"nice-vertical-navigation-item\">\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\" *ngIf=\"item.title || item.subtitle\">\n <div class=\"nice-vertical-navigation-item-title\">\n <span [ngClass]=\"item.classes?.title\">\n {{ item.title | translate }}\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 | translate }}\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 | translate }}\n </div>\n </div>\n </div>\n</div>\n\n<ng-container *ngFor=\"let item of item.children; trackBy: trackByFn\">\n <!-- Skip the hidden items -->\n <ng-container *ngIf=\"!(item | niceShouldHide | async)\">\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", 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: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: NiceVerticalNavigationBasicItemComponent, selector: "nice-vertical-navigation-basic-item", inputs: ["item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: NiceVerticalNavigationCollapsableItemComponent, selector: "nice-vertical-navigation-collapsable-item", inputs: ["autoCollapse", "item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: NiceVerticalNavigationDividerItemComponent, selector: "nice-vertical-navigation-divider-item", inputs: ["item", "name"] }, { kind: "component", type: NiceVerticalNavigationGroupItemComponent, selector: "nice-vertical-navigation-group-item", inputs: ["autoCollapse", "item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: NiceVerticalNavigationSpacerItemComponent, selector: "nice-vertical-navigation-spacer-item", inputs: ["item", "name"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }, { kind: "pipe", type: NiceShouldHidePipe, name: "niceShouldHide" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
9006
9039
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceVerticalNavigationGroupItemComponent, decorators: [{
|
|
9007
9040
|
type: Component,
|
|
9008
|
-
args: [{ selector: "nice-vertical-navigation-group-item", changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Item wrapper -->\n<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 class=\"nice-vertical-navigation-item\">\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\" *ngIf=\"item.title || item.subtitle\">\n <div class=\"nice-vertical-navigation-item-title\">\n <span [ngClass]=\"item.classes?.title\">\n {{ item.title | translate }}\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 | translate }}\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 | translate }}\n </div>\n </div>\n </div>\n</div>\n\n<ng-container *ngFor=\"let item of item.children; trackBy: trackByFn\">\n <!-- Skip the hidden items -->\n <ng-container *ngIf=\"!(item | niceShouldHide | async)\">\n <!-- Basic -->\n <nice-vertical-navigation-basic-item\n *ngIf=\"item.type === 'basic'\"\n [item]=\"item\"\n [name]=\"name\"\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 ></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 ></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" }]
|
|
9041
|
+
args: [{ selector: "nice-vertical-navigation-group-item", changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Item wrapper -->\n<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 class=\"nice-vertical-navigation-item\">\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\" *ngIf=\"item.title || item.subtitle\">\n <div class=\"nice-vertical-navigation-item-title\">\n <span [ngClass]=\"item.classes?.title\">\n {{ item.title | translate }}\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 | translate }}\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 | translate }}\n </div>\n </div>\n </div>\n</div>\n\n<ng-container *ngFor=\"let item of item.children; trackBy: trackByFn\">\n <!-- Skip the hidden items -->\n <ng-container *ngIf=\"!(item | niceShouldHide | async)\">\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" }]
|
|
9009
9042
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: NiceNavigationService }]; }, propDecorators: { autoCollapse: [{
|
|
9010
9043
|
type: Input
|
|
9011
9044
|
}], item: [{
|
|
9012
9045
|
type: Input
|
|
9013
9046
|
}], name: [{
|
|
9014
9047
|
type: Input
|
|
9048
|
+
}], showTooltips: [{
|
|
9049
|
+
type: Input
|
|
9050
|
+
}], tooltipPosition: [{
|
|
9051
|
+
type: Input
|
|
9015
9052
|
}] } });
|
|
9016
9053
|
|
|
9017
9054
|
class NiceVerticalNavigationAsideItemComponent {
|
|
@@ -9023,6 +9060,8 @@ class NiceVerticalNavigationAsideItemComponent {
|
|
|
9023
9060
|
this._router = _router;
|
|
9024
9061
|
this._niceNavigationService = _niceNavigationService;
|
|
9025
9062
|
this._unsubscribeAll = new Subject();
|
|
9063
|
+
this.showTooltips = false;
|
|
9064
|
+
this.tooltipPosition = "after";
|
|
9026
9065
|
this.active = false;
|
|
9027
9066
|
}
|
|
9028
9067
|
// -----------------------------------------------------------------------------------------------------
|
|
@@ -9121,10 +9160,10 @@ class NiceVerticalNavigationAsideItemComponent {
|
|
|
9121
9160
|
}
|
|
9122
9161
|
}
|
|
9123
9162
|
NiceVerticalNavigationAsideItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceVerticalNavigationAsideItemComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$b.Router }, { token: NiceNavigationService }], target: i0.ɵɵFactoryTarget.Component });
|
|
9124
|
-
NiceVerticalNavigationAsideItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceVerticalNavigationAsideItemComponent, selector: "nice-vertical-navigation-aside-item", inputs: { activeItemId: "activeItemId", autoCollapse: "autoCollapse", item: "item", name: "name", skipChildren: "skipChildren" }, 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 | translate }}\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 | translate }}\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 | translate }}\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 ></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 ></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 ></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: 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: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: NiceVerticalNavigationBasicItemComponent, selector: "nice-vertical-navigation-basic-item", inputs: ["item", "name"] }, { kind: "component", type: NiceVerticalNavigationCollapsableItemComponent, selector: "nice-vertical-navigation-collapsable-item", inputs: ["autoCollapse", "item", "name"] }, { kind: "component", type: NiceVerticalNavigationDividerItemComponent, selector: "nice-vertical-navigation-divider-item", inputs: ["item", "name"] }, { kind: "component", type: NiceVerticalNavigationGroupItemComponent, selector: "nice-vertical-navigation-group-item", inputs: ["autoCollapse", "item", "name"] }, { kind: "component", type: NiceVerticalNavigationSpacerItemComponent, selector: "nice-vertical-navigation-spacer-item", inputs: ["item", "name"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
9163
|
+
NiceVerticalNavigationAsideItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", 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 | translate }}\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 | translate }}\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 | translate }}\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: 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: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: NiceVerticalNavigationBasicItemComponent, selector: "nice-vertical-navigation-basic-item", inputs: ["item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: NiceVerticalNavigationCollapsableItemComponent, selector: "nice-vertical-navigation-collapsable-item", inputs: ["autoCollapse", "item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: NiceVerticalNavigationDividerItemComponent, selector: "nice-vertical-navigation-divider-item", inputs: ["item", "name"] }, { kind: "component", type: NiceVerticalNavigationGroupItemComponent, selector: "nice-vertical-navigation-group-item", inputs: ["autoCollapse", "item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: NiceVerticalNavigationSpacerItemComponent, selector: "nice-vertical-navigation-spacer-item", inputs: ["item", "name"] }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
9125
9164
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceVerticalNavigationAsideItemComponent, decorators: [{
|
|
9126
9165
|
type: Component,
|
|
9127
|
-
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 | translate }}\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 | translate }}\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 | translate }}\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 ></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 ></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 ></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" }]
|
|
9166
|
+
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 | translate }}\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 | translate }}\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 | translate }}\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" }]
|
|
9128
9167
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$b.Router }, { type: NiceNavigationService }]; }, propDecorators: { activeItemId: [{
|
|
9129
9168
|
type: Input
|
|
9130
9169
|
}], autoCollapse: [{
|
|
@@ -9133,8 +9172,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
9133
9172
|
type: Input
|
|
9134
9173
|
}], name: [{
|
|
9135
9174
|
type: Input
|
|
9175
|
+
}], showTooltips: [{
|
|
9176
|
+
type: Input
|
|
9136
9177
|
}], skipChildren: [{
|
|
9137
9178
|
type: Input
|
|
9179
|
+
}], tooltipPosition: [{
|
|
9180
|
+
type: Input
|
|
9138
9181
|
}] } });
|
|
9139
9182
|
|
|
9140
9183
|
class NiceVerticalNavigationComponent extends NiceNavigationComponent {
|
|
@@ -9173,7 +9216,9 @@ class NiceVerticalNavigationComponent extends NiceNavigationComponent {
|
|
|
9173
9216
|
this.hovered = false;
|
|
9174
9217
|
this.hasHint = false;
|
|
9175
9218
|
this.position = "left";
|
|
9219
|
+
this.showTooltips = false;
|
|
9176
9220
|
this.transparentOverlay = false;
|
|
9221
|
+
this.tooltipPosition = "after";
|
|
9177
9222
|
this.appearanceChanged = new EventEmitter();
|
|
9178
9223
|
this.modeChanged = new EventEmitter();
|
|
9179
9224
|
this.openedChanged = new EventEmitter();
|
|
@@ -9641,10 +9686,10 @@ class NiceVerticalNavigationComponent extends NiceNavigationComponent {
|
|
|
9641
9686
|
}
|
|
9642
9687
|
}
|
|
9643
9688
|
NiceVerticalNavigationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceVerticalNavigationComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: NiceNavigationService }, { token: NiceUtilsService }, { token: i1$c.AnimationBuilder }, { token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1$b.Router }, { token: i1$7.ScrollStrategyOptions }, { token: NiceNavigationHintService }], target: i0.ɵɵFactoryTarget.Component });
|
|
9644
|
-
NiceVerticalNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceVerticalNavigationComponent, selector: "nice-vertical-navigation", inputs: { name: "name", appearance: "appearance", autoCollapse: "autoCollapse", inner: "inner", mode: "mode", opened: "opened", hovered: "hovered", hasHint: "hasHint", position: "position", transparentOverlay: "transparentOverlay", navigation: "navigation" }, outputs: { appearanceChanged: "appearanceChanged", modeChanged: "modeChanged", openedChanged: "openedChanged", hoveredChanged: "hoveredChanged", positionChanged: "positionChanged" }, host: { listeners: { "mouseenter": "_onMouseenter()", "mouseleave": "_onMouseleave()" }, properties: { "class": "this.classList", "style": "this.styleList" } }, viewQueries: [{ propertyName: "_navigationContentEl", first: true, predicate: ["navigationContent"], descendants: true }, { propertyName: "niceScrollbarDirectives", predicate: NiceScrollbarDirective, descendants: true }], exportAs: ["niceVerticalNavigation"], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"nice-vertical-navigation-wrapper\">\n <!-- Header -->\n <div class=\"nice-vertical-navigation-header\">\n <ng-content select=\"[niceVerticalNavigationHeader]\"></ng-content>\n </div>\n\n <!-- Content -->\n <div\n class=\"nice-vertical-navigation-content\"\n niceScrollbar\n [niceScrollbarOptions]=\"{ wheelPropagation: inner, suppressScrollX: true }\"\n #navigationContent\n >\n <!-- Content header -->\n <div class=\"nice-vertical-navigation-content-header\">\n <ng-content select=\"[niceVerticalNavigationContentHeader]\"></ng-content>\n </div>\n\n <!-- Items -->\n <div *ngFor=\"let item of navigation; trackBy: trackByFn\" [@.disabled]=\"!animateNextNavChange\" @slideInRight>\n <!-- Skip the hidden items -->\n <ng-container *ngIf=\"!(item | niceShouldHide | async)\">\n <!-- Aside -->\n <nice-vertical-navigation-aside-item\n *ngIf=\"item.type === 'aside'\"\n [item]=\"item\"\n [name]=\"name\"\n [activeItemId]=\"activeAsideItemId\"\n [autoCollapse]=\"autoCollapse\"\n [skipChildren]=\"true\"\n (click)=\"toggleAside(item)\"\n ></nice-vertical-navigation-aside-item>\n\n <!-- Basic -->\n <nice-vertical-navigation-basic-item\n *ngIf=\"item.type === 'basic'\"\n [item]=\"item\"\n [name]=\"name\"\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 ></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 [autoCollapse]=\"autoCollapse\"\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 </div>\n\n <!-- Content footer -->\n <div class=\"nice-vertical-navigation-content-footer\">\n <ng-content select=\"[niceVerticalNavigationContentFooter]\"></ng-content>\n </div>\n\n </div>\n\n <!-- Footer -->\n <div class=\"nice-vertical-navigation-footer\">\n <ng-content select=\"[niceVerticalNavigationFooter]\"></ng-content>\n </div>\n</div>\n\n<!-- Aside -->\n<div\n class=\"nice-vertical-navigation-aside-wrapper\"\n *ngIf=\"activeAsideItemId\"\n niceScrollbar\n [niceScrollbarOptions]=\"{ wheelPropagation: false, suppressScrollX: true }\"\n [@fadeInLeft]=\"position === 'left'\"\n [@fadeInRight]=\"position === 'right'\"\n [@fadeOutLeft]=\"position === 'left'\"\n [@fadeOutRight]=\"position === 'right'\"\n>\n\n <!-- Items -->\n <ng-container *ngFor=\"let item of navigation; trackBy: trackByFn\">\n <!-- Skip the hidden items -->\n <ng-container *ngIf=\"(item.hidden && !item.hidden(item)) || !item.hidden\">\n <!-- Aside -->\n <nice-vertical-navigation-aside-item\n *ngIf=\"item.type === 'aside' && item.id === activeAsideItemId\"\n [item]=\"item\"\n [name]=\"name\"\n [autoCollapse]=\"autoCollapse\"\n ></nice-vertical-navigation-aside-item>\n </ng-container>\n </ng-container>\n</div>\n", dependencies: [{ 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: NiceScrollbarDirective, selector: "[niceScrollbar]", inputs: ["niceScrollbar", "niceScrollbarOptions"], exportAs: ["niceScrollbar"] }, { kind: "component", type: NiceVerticalNavigationAsideItemComponent, selector: "nice-vertical-navigation-aside-item", inputs: ["activeItemId", "autoCollapse", "item", "name", "skipChildren"] }, { kind: "component", type: NiceVerticalNavigationBasicItemComponent, selector: "nice-vertical-navigation-basic-item", inputs: ["item", "name"] }, { kind: "component", type: NiceVerticalNavigationCollapsableItemComponent, selector: "nice-vertical-navigation-collapsable-item", inputs: ["autoCollapse", "item", "name"] }, { kind: "component", type: NiceVerticalNavigationDividerItemComponent, selector: "nice-vertical-navigation-divider-item", inputs: ["item", "name"] }, { kind: "component", type: NiceVerticalNavigationGroupItemComponent, selector: "nice-vertical-navigation-group-item", inputs: ["autoCollapse", "item", "name"] }, { kind: "component", type: NiceVerticalNavigationSpacerItemComponent, selector: "nice-vertical-navigation-spacer-item", inputs: ["item", "name"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: NiceShouldHidePipe, name: "niceShouldHide" }], animations: niceAnimations, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
9689
|
+
NiceVerticalNavigationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.9", type: NiceVerticalNavigationComponent, selector: "nice-vertical-navigation", inputs: { name: "name", appearance: "appearance", autoCollapse: "autoCollapse", inner: "inner", mode: "mode", opened: "opened", hovered: "hovered", hasHint: "hasHint", position: "position", showTooltips: "showTooltips", transparentOverlay: "transparentOverlay", tooltipPosition: "tooltipPosition", navigation: "navigation" }, outputs: { appearanceChanged: "appearanceChanged", modeChanged: "modeChanged", openedChanged: "openedChanged", hoveredChanged: "hoveredChanged", positionChanged: "positionChanged" }, host: { listeners: { "mouseenter": "_onMouseenter()", "mouseleave": "_onMouseleave()" }, properties: { "class": "this.classList", "style": "this.styleList" } }, viewQueries: [{ propertyName: "_navigationContentEl", first: true, predicate: ["navigationContent"], descendants: true }, { propertyName: "niceScrollbarDirectives", predicate: NiceScrollbarDirective, descendants: true }], exportAs: ["niceVerticalNavigation"], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"nice-vertical-navigation-wrapper\">\n <!-- Header -->\n <div class=\"nice-vertical-navigation-header\">\n <ng-content select=\"[niceVerticalNavigationHeader]\"></ng-content>\n </div>\n\n <!-- Content -->\n <div\n class=\"nice-vertical-navigation-content\"\n niceScrollbar\n [niceScrollbarOptions]=\"{ wheelPropagation: inner, suppressScrollX: true }\"\n #navigationContent\n >\n <!-- Content header -->\n <div class=\"nice-vertical-navigation-content-header\">\n <ng-content select=\"[niceVerticalNavigationContentHeader]\"></ng-content>\n </div>\n\n <!-- Items -->\n <div *ngFor=\"let item of navigation; trackBy: trackByFn\" [@.disabled]=\"!animateNextNavChange\" @slideInRight>\n <!-- Skip the hidden items -->\n <ng-container *ngIf=\"!(item | niceShouldHide | async)\">\n <!-- Aside -->\n <nice-vertical-navigation-aside-item\n *ngIf=\"item.type === 'aside'\"\n [item]=\"item\"\n [name]=\"name\"\n [activeItemId]=\"activeAsideItemId\"\n [autoCollapse]=\"autoCollapse\"\n [skipChildren]=\"true\"\n [showTooltips]=\"showTooltips\"\n [tooltipPosition]=\"tooltipPosition\"\n (click)=\"toggleAside(item)\"\n ></nice-vertical-navigation-aside-item>\n\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 [autoCollapse]=\"autoCollapse\"\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 </div>\n\n <!-- Content footer -->\n <div class=\"nice-vertical-navigation-content-footer\">\n <ng-content select=\"[niceVerticalNavigationContentFooter]\"></ng-content>\n </div>\n\n </div>\n\n <!-- Footer -->\n <div class=\"nice-vertical-navigation-footer\">\n <ng-content select=\"[niceVerticalNavigationFooter]\"></ng-content>\n </div>\n</div>\n\n<!-- Aside -->\n<div\n class=\"nice-vertical-navigation-aside-wrapper\"\n *ngIf=\"activeAsideItemId\"\n niceScrollbar\n [niceScrollbarOptions]=\"{ wheelPropagation: false, suppressScrollX: true }\"\n [@fadeInLeft]=\"position === 'left'\"\n [@fadeInRight]=\"position === 'right'\"\n [@fadeOutLeft]=\"position === 'left'\"\n [@fadeOutRight]=\"position === 'right'\"\n>\n\n <!-- Items -->\n <ng-container *ngFor=\"let item of navigation; trackBy: trackByFn\">\n <!-- Skip the hidden items -->\n <ng-container *ngIf=\"(item.hidden && !item.hidden(item)) || !item.hidden\">\n <!-- Aside -->\n <nice-vertical-navigation-aside-item\n *ngIf=\"item.type === 'aside' && item.id === activeAsideItemId\"\n [item]=\"item\"\n [name]=\"name\"\n [autoCollapse]=\"autoCollapse\"\n [showTooltips]=\"showTooltips\"\n [tooltipPosition]=\"tooltipPosition\"\n ></nice-vertical-navigation-aside-item>\n </ng-container>\n </ng-container>\n</div>\n", dependencies: [{ 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: NiceScrollbarDirective, selector: "[niceScrollbar]", inputs: ["niceScrollbar", "niceScrollbarOptions"], exportAs: ["niceScrollbar"] }, { kind: "component", type: NiceVerticalNavigationAsideItemComponent, selector: "nice-vertical-navigation-aside-item", inputs: ["activeItemId", "autoCollapse", "item", "name", "showTooltips", "skipChildren", "tooltipPosition"] }, { kind: "component", type: NiceVerticalNavigationBasicItemComponent, selector: "nice-vertical-navigation-basic-item", inputs: ["item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: NiceVerticalNavigationCollapsableItemComponent, selector: "nice-vertical-navigation-collapsable-item", inputs: ["autoCollapse", "item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: NiceVerticalNavigationDividerItemComponent, selector: "nice-vertical-navigation-divider-item", inputs: ["item", "name"] }, { kind: "component", type: NiceVerticalNavigationGroupItemComponent, selector: "nice-vertical-navigation-group-item", inputs: ["autoCollapse", "item", "name", "showTooltips", "tooltipPosition"] }, { kind: "component", type: NiceVerticalNavigationSpacerItemComponent, selector: "nice-vertical-navigation-spacer-item", inputs: ["item", "name"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: NiceShouldHidePipe, name: "niceShouldHide" }], animations: niceAnimations, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
9645
9690
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImport: i0, type: NiceVerticalNavigationComponent, decorators: [{
|
|
9646
9691
|
type: Component,
|
|
9647
|
-
args: [{ selector: "nice-vertical-navigation", animations: niceAnimations, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: "niceVerticalNavigation", template: "<div class=\"nice-vertical-navigation-wrapper\">\n <!-- Header -->\n <div class=\"nice-vertical-navigation-header\">\n <ng-content select=\"[niceVerticalNavigationHeader]\"></ng-content>\n </div>\n\n <!-- Content -->\n <div\n class=\"nice-vertical-navigation-content\"\n niceScrollbar\n [niceScrollbarOptions]=\"{ wheelPropagation: inner, suppressScrollX: true }\"\n #navigationContent\n >\n <!-- Content header -->\n <div class=\"nice-vertical-navigation-content-header\">\n <ng-content select=\"[niceVerticalNavigationContentHeader]\"></ng-content>\n </div>\n\n <!-- Items -->\n <div *ngFor=\"let item of navigation; trackBy: trackByFn\" [@.disabled]=\"!animateNextNavChange\" @slideInRight>\n <!-- Skip the hidden items -->\n <ng-container *ngIf=\"!(item | niceShouldHide | async)\">\n <!-- Aside -->\n <nice-vertical-navigation-aside-item\n *ngIf=\"item.type === 'aside'\"\n [item]=\"item\"\n [name]=\"name\"\n [activeItemId]=\"activeAsideItemId\"\n [autoCollapse]=\"autoCollapse\"\n [skipChildren]=\"true\"\n (click)=\"toggleAside(item)\"\n ></nice-vertical-navigation-aside-item>\n\n <!-- Basic -->\n <nice-vertical-navigation-basic-item\n *ngIf=\"item.type === 'basic'\"\n [item]=\"item\"\n [name]=\"name\"\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 ></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 [autoCollapse]=\"autoCollapse\"\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 </div>\n\n <!-- Content footer -->\n <div class=\"nice-vertical-navigation-content-footer\">\n <ng-content select=\"[niceVerticalNavigationContentFooter]\"></ng-content>\n </div>\n\n </div>\n\n <!-- Footer -->\n <div class=\"nice-vertical-navigation-footer\">\n <ng-content select=\"[niceVerticalNavigationFooter]\"></ng-content>\n </div>\n</div>\n\n<!-- Aside -->\n<div\n class=\"nice-vertical-navigation-aside-wrapper\"\n *ngIf=\"activeAsideItemId\"\n niceScrollbar\n [niceScrollbarOptions]=\"{ wheelPropagation: false, suppressScrollX: true }\"\n [@fadeInLeft]=\"position === 'left'\"\n [@fadeInRight]=\"position === 'right'\"\n [@fadeOutLeft]=\"position === 'left'\"\n [@fadeOutRight]=\"position === 'right'\"\n>\n\n <!-- Items -->\n <ng-container *ngFor=\"let item of navigation; trackBy: trackByFn\">\n <!-- Skip the hidden items -->\n <ng-container *ngIf=\"(item.hidden && !item.hidden(item)) || !item.hidden\">\n <!-- Aside -->\n <nice-vertical-navigation-aside-item\n *ngIf=\"item.type === 'aside' && item.id === activeAsideItemId\"\n [item]=\"item\"\n [name]=\"name\"\n [autoCollapse]=\"autoCollapse\"\n ></nice-vertical-navigation-aside-item>\n </ng-container>\n </ng-container>\n</div>\n" }]
|
|
9692
|
+
args: [{ selector: "nice-vertical-navigation", animations: niceAnimations, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: "niceVerticalNavigation", template: "<div class=\"nice-vertical-navigation-wrapper\">\n <!-- Header -->\n <div class=\"nice-vertical-navigation-header\">\n <ng-content select=\"[niceVerticalNavigationHeader]\"></ng-content>\n </div>\n\n <!-- Content -->\n <div\n class=\"nice-vertical-navigation-content\"\n niceScrollbar\n [niceScrollbarOptions]=\"{ wheelPropagation: inner, suppressScrollX: true }\"\n #navigationContent\n >\n <!-- Content header -->\n <div class=\"nice-vertical-navigation-content-header\">\n <ng-content select=\"[niceVerticalNavigationContentHeader]\"></ng-content>\n </div>\n\n <!-- Items -->\n <div *ngFor=\"let item of navigation; trackBy: trackByFn\" [@.disabled]=\"!animateNextNavChange\" @slideInRight>\n <!-- Skip the hidden items -->\n <ng-container *ngIf=\"!(item | niceShouldHide | async)\">\n <!-- Aside -->\n <nice-vertical-navigation-aside-item\n *ngIf=\"item.type === 'aside'\"\n [item]=\"item\"\n [name]=\"name\"\n [activeItemId]=\"activeAsideItemId\"\n [autoCollapse]=\"autoCollapse\"\n [skipChildren]=\"true\"\n [showTooltips]=\"showTooltips\"\n [tooltipPosition]=\"tooltipPosition\"\n (click)=\"toggleAside(item)\"\n ></nice-vertical-navigation-aside-item>\n\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 [autoCollapse]=\"autoCollapse\"\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 </div>\n\n <!-- Content footer -->\n <div class=\"nice-vertical-navigation-content-footer\">\n <ng-content select=\"[niceVerticalNavigationContentFooter]\"></ng-content>\n </div>\n\n </div>\n\n <!-- Footer -->\n <div class=\"nice-vertical-navigation-footer\">\n <ng-content select=\"[niceVerticalNavigationFooter]\"></ng-content>\n </div>\n</div>\n\n<!-- Aside -->\n<div\n class=\"nice-vertical-navigation-aside-wrapper\"\n *ngIf=\"activeAsideItemId\"\n niceScrollbar\n [niceScrollbarOptions]=\"{ wheelPropagation: false, suppressScrollX: true }\"\n [@fadeInLeft]=\"position === 'left'\"\n [@fadeInRight]=\"position === 'right'\"\n [@fadeOutLeft]=\"position === 'left'\"\n [@fadeOutRight]=\"position === 'right'\"\n>\n\n <!-- Items -->\n <ng-container *ngFor=\"let item of navigation; trackBy: trackByFn\">\n <!-- Skip the hidden items -->\n <ng-container *ngIf=\"(item.hidden && !item.hidden(item)) || !item.hidden\">\n <!-- Aside -->\n <nice-vertical-navigation-aside-item\n *ngIf=\"item.type === 'aside' && item.id === activeAsideItemId\"\n [item]=\"item\"\n [name]=\"name\"\n [autoCollapse]=\"autoCollapse\"\n [showTooltips]=\"showTooltips\"\n [tooltipPosition]=\"tooltipPosition\"\n ></nice-vertical-navigation-aside-item>\n </ng-container>\n </ng-container>\n</div>\n" }]
|
|
9648
9693
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: NiceNavigationService }, { type: NiceUtilsService }, { type: i1$c.AnimationBuilder }, { type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1$b.Router }, { type: i1$7.ScrollStrategyOptions }, { type: NiceNavigationHintService }]; }, propDecorators: { name: [{
|
|
9649
9694
|
type: Input
|
|
9650
9695
|
}], appearance: [{
|
|
@@ -9663,8 +9708,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.9", ngImpor
|
|
|
9663
9708
|
type: Input
|
|
9664
9709
|
}], position: [{
|
|
9665
9710
|
type: Input
|
|
9711
|
+
}], showTooltips: [{
|
|
9712
|
+
type: Input
|
|
9666
9713
|
}], transparentOverlay: [{
|
|
9667
9714
|
type: Input
|
|
9715
|
+
}], tooltipPosition: [{
|
|
9716
|
+
type: Input
|
|
9668
9717
|
}], appearanceChanged: [{
|
|
9669
9718
|
type: Output
|
|
9670
9719
|
}], modeChanged: [{
|