@c8y/ngx-components 1023.30.0 → 1023.37.0

package/fesm2022/c8y-ngx-components-alarms.mjs

@@ -1,9 +1,9 @@
 import * as i0 from '@angular/core';
-import { Injectable, Pipe, InjectionToken, HostListener, Input, Optional, Component, EventEmitter, ViewChild, Output, ChangeDetectionStrategy, forwardRef, signal, NgModule } from '@angular/core';
+import { Injectable, Pipe, InjectionToken, HostListener, Input, Optional, Component, EventEmitter, ViewChild, Output, ChangeDetectionStrategy, forwardRef, signal, NgModule, inject } from '@angular/core';
 import { combineLatest, BehaviorSubject, Subject, fromEvent, firstValueFrom, of, from, forkJoin, EMPTY, Observable, pipe, take, takeUntil as takeUntil$1, map as map$1 } from 'rxjs';
 import { filter, map, switchMap, startWith, debounceTime, takeUntil, distinctUntilChanged, catchError, finalize, tap, shareReplay, throttleTime } from 'rxjs/operators';
 import * as i3 from '@c8y/ngx-components';
-import { Permissions, ViewContext, SupportedApps, IconDirective, EmptyStateComponent, LoadingComponent, ListGroupComponent, ForOfDirective, ListItemTimelineComponent, ListItemComponent, ListItemBodyComponent, SplitViewDetailsActionsComponent, IconPanelComponent, C8yTranslatePipe, DatePipe, HumanizeAppNamePipe, AssetLinkPipe, TitleComponent, TabsOutletComponent, ProductExperienceDirective, RequiredInputPlaceholderDirective, CountdownIntervalComponent, DynamicComponentAlertAggregator, DynamicComponentAlert, C8yTranslateDirective, ListItemIconComponent, DynamicComponentAlertsComponent, SplitViewListComponent, SplitViewHeaderActionsComponent, SplitViewAlertsComponent, FormGroupComponent, DateTimePickerComponent, MessagesComponent, MessageDirective, ListItemCheckboxComponent, SplitViewComponent, SplitViewDetailsComponent, HelpComponent, ActionBarItemComponent, AlarmWithChildrenRealtimeService, RouterTabsResolver, ContextRouteGuard, ContextRouteComponent, hookNavigator, hookRoute, CommonModule, CoreModule, HeaderModule, C8yTranslateModule, DynamicComponentModule, RelativeTimePipe } from '@c8y/ngx-components';
+import { Permissions, ViewContext, SupportedApps, IconDirective, EmptyStateComponent, LoadingComponent, ListGroupComponent, ForOfDirective, ListItemTimelineComponent, ListItemComponent, ListItemBodyComponent, SplitViewDetailsActionsComponent, IconPanelComponent, C8yTranslatePipe, DatePipe, HumanizeAppNamePipe, AssetLinkPipe, TitleComponent, TabsOutletComponent, ProductExperienceDirective, RequiredInputPlaceholderDirective, CountdownIntervalComponent, DynamicComponentAlertAggregator, DynamicComponentAlert, C8yTranslateDirective, ListItemIconComponent, DynamicComponentAlertsComponent, SplitViewListComponent, SplitViewHeaderActionsComponent, SplitViewAlertsComponent, FormGroupComponent, DateTimePickerComponent, MessagesComponent, MessageDirective, ListItemCheckboxComponent, SplitViewComponent, SplitViewDetailsComponent, HelpComponent, ActionBarItemComponent, AlarmWithChildrenRealtimeService, RouterTabsResolver, ContextRouteGuard, ContextRouteComponent, hookNavigator, hookRoute, CommonModule, CoreModule, HeaderModule, C8yTranslateModule, DynamicComponentModule, RelativeTimePipe, NavigatorNode } from '@c8y/ngx-components';
 import { sortBy, cloneDeep } from 'lodash-es';
 import { NgClass, NgStyle, NgTemplateOutlet, AsyncPipe, JsonPipe, LowerCasePipe, NgIf, NgFor, TitleCasePipe } from '@angular/common';
 import * as i1 from '@angular/router';
@@ -1967,6 +1967,7 @@ class AlarmsListComponent {
          */
         this.isEmptyListLoading = true;
         this.alertAggregator = new DynamicComponentAlertAggregator();
+        this.permissionAlertAggregator = new DynamicComponentAlertAggregator();
         this.mapAlarmLink = pipe(map((alarms) => alarms.map((alarm) => {
             alarm.link = this.getRouterLink(alarm);
             return alarm;
@@ -1997,10 +1998,7 @@ class AlarmsListComponent {
             this.isEmptyListLoading = !this.alarms?.data?.length;
         }
         if (changes.hasPermissions?.currentValue === false) {
-            this.alertAggregator.addAlerts(new DynamicComponentAlert({
-                type: 'system',
-                text: gettext("You don't have permission to view alarms.")
-            }));
+            this.addPermissionAlert();
         }
     }
     ngAfterViewInit() {
@@ -2032,6 +2030,13 @@ class AlarmsListComponent {
         const contextData = this.contextRouteService.getContextData(this.activatedRoute);
         return this.alarmsViewService.getRouterLink(contextData, alarm);
     }
+    addPermissionAlert() {
+        this.permissionAlertAggregator.clear();
+        this.permissionAlertAggregator.addAlerts(new DynamicComponentAlert({
+            type: 'system',
+            text: gettext("You don't have permission to view alarms.")
+        }));
+    }
     shouldCountdownIntervalBeHidden(target) {
         const scrollTopPixels = target.scrollTop;
         return scrollTopPixels > this.HIDE_INTERVAL_COUNTDOWN_SCROLL;
@@ -2042,7 +2047,7 @@ class AlarmsListComponent {
         this.activeChildParam$.subscribe();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AlarmsListComponent, deps: [{ token: i1.ActivatedRoute }, { token: AlarmsViewService }, { token: i3.ContextRouteService }, { token: i1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: AlarmsListComponent, isStandalone: true, selector: "c8y-alarms-list", inputs: { alarms: "alarms", hasPermissions: "hasPermissions", typeFilters: "typeFilters", loadMoreMode: "loadMoreMode", navigationOptions: "navigationOptions", isInitialLoading: "isInitialLoading", isInPreviewMode: "isInPreviewMode" }, outputs: { onSelectedAlarm: "onSelectedAlarm", onScrollingStateChange: "onScrollingStateChange" }, viewQueries: [{ propertyName: "svListComponent", first: true, predicate: ["scrollWrapper"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<c8y-sv-list\n  [emptyStateIcon]=\"'c8y-alert-idle'\"\n  [title]=\"'Alarms list' | translate\"\n  [emptyStateTitle]=\"'No alarms to display.' | translate\"\n  [loading]=\"isInitialLoading || isEmptyListLoading\"\n  [showEmptyState]=\"isEmptyListLoading && !isInitialLoading && hasPermissions\"\n  [docsUrl]=\"\n    '/docs/device-management-application/monitoring-and-controlling-devices/#working-with-alarms'\n  \"\n  data-cy=\"c8y-alarms-list\"\n  #scrollWrapper\n>\n  <c8y-sv-header-actions>\n    <ng-content></ng-content>\n  </c8y-sv-header-actions>\n\n  <c8y-sv-alerts>\n    @if (\n      !isEmptyListLoading &&\n      (activeChildParam$ | async) &&\n      (activeAlarm$ | async)?.id !== (activeChildParam$ | async)\n    ) {\n      <div\n        class=\"alert alert-warning m-b-0\"\n        role=\"alert\"\n        translate\n      >\n        The selected alarm is not currently in the list, change your filter.\n      </div>\n    }\n  </c8y-sv-alerts>\n\n  <c8y-list-group class=\"c8y-list--timeline d-block p-r-16 p-t-16\">\n    <c8y-li-timeline\n      class=\"pointer c8y-list--timeline__item\"\n      role=\"button\"\n      data-cy=\"c8y-alarms-list--timeline-repeat\"\n      *c8yFor=\"let alarm of alarms; let i = index; pipe: mapAlarmLink; loadMore: loadMoreMode\"\n      [routerLink]=\"navigationOptions.allowNavigationToAlarmsView ? alarm.link : null\"\n      routerLinkActive=\"active\"\n      [queryParamsHandling]=\"navigationOptions.queryParamsHandling\"\n      (isActiveChange)=\"activeRouteChanged($event, liScrollAnchor, alarm)\"\n      (click)=\"onAlarmOpen(alarm)\"\n      [queryParams]=\"\n        navigationOptions.includeClearedQueryParams\n          ? { showCleared: alarm.status === 'CLEARED' }\n          : {}\n      \"\n    >\n      <span\n        [attr.aria-label]=\"alarmLastOccurrenceLabel | translate\"\n        [tooltip]=\"alarmLastOccurrenceLabel | translate\"\n        placement=\"right\"\n        container=\"body\"\n        data-cy=\"c8y-alarms-list--last-occurrence-date\"\n        [delay]=\"500\"\n      >\n        {{ alarm.time | c8yDate: 'mediumDate' }}\n        {{ alarm.time | c8yDate: 'mediumTime' }}\n      </span>\n      <c8y-li\n        style=\"scroll-margin-top: 56px\"\n        #liScrollAnchor\n      >\n        <c8y-li-icon class=\"a-s-start\">\n          <div class=\"alarm-icons\">\n            <c8y-alarms-icon\n              [typeFilters]=\"typeFilters\"\n              [alarm]=\"alarm\"\n            ></c8y-alarms-icon>\n          </div>\n          @if (alarm.firstOccurrenceTime) {\n            <button\n              class=\"btn-clean text-center\"\n              [attr.aria-label]=\"\n                alarmBadgeTooltip\n                  | translate\n                    : { alarmFirstOccurrenceTime: alarm.firstOccurrenceTime | c8yDate: 'medium' }\n              \"\n              [tooltip]=\"\n                alarmBadgeTooltip\n                  | translate\n                    : { alarmFirstOccurrenceTime: alarm.firstOccurrenceTime | c8yDate: 'medium' }\n              \"\n              placement=\"right\"\n              container=\"body\"\n              type=\"button\"\n              data-cy=\"c8y-alarms-list--badge\"\n              (click)=\"$event.stopPropagation()\"\n              [delay]=\"500\"\n            >\n              @if (alarm.count > 1) {\n                <span class=\"badge badge-info\">\n                  {{ alarm.count }}\n                </span>\n              }\n            </button>\n          }\n        </c8y-li-icon>\n        <c8y-li-body class=\"a-s-stretch\">\n          <div class=\"d-flex a-i-start fit-h\">\n            <div class=\"min-width-0 flex-grow\">\n              <p\n                class=\"text-truncate-wrap p-b-4\"\n                data-cy=\"c8y-alarms-list--alarm-text\"\n              >\n                {{ alarm.text | translate }}\n              </p>\n              <div class=\"d-flex\">\n                <p\n                  class=\"small text-muted text-truncate flex-grow\"\n                  [title]=\"alarm.source.name\"\n                  data-cy=\"c8y-alarms-list--alarm-source-name\"\n                >\n                  <i [c8yIcon]=\"'exchange'\"></i>\n                  {{ alarm.source.name }}\n                </p>\n                <div class=\"d-flex\">\n                  @for (item of alarm | alarmListIndicator | async; track $index) {\n                    <div [title]=\"item.title | translate\">\n                      <i\n                        [class]=\"item.class\"\n                        [c8yIcon]=\"item.icon\"\n                      ></i>\n                    </div>\n                  }\n                </div>\n              </div>\n            </div>\n          </div>\n        </c8y-li-body>\n      </c8y-li>\n    </c8y-li-timeline>\n  </c8y-list-group>\n</c8y-sv-list>\n\n<ng-template #alertsA>\n  <c8y-dynamic-component-alerts [alerts]=\"alertAggregator\"></c8y-dynamic-component-alerts>\n</ng-template>\n", dependencies: [{ kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: ForOfDirective, selector: "[c8yFor]", inputs: ["c8yForOf", "c8yForLoadMore", "c8yForPipe", "c8yForNotFound", "c8yForMaxIterations", "c8yForLoadingTemplate", "c8yForLoadNextLabel", "c8yForLoadingLabel", "c8yForRealtime", "c8yForRealtimeOptions", "c8yForComparator", "c8yForEnableVirtualScroll", "c8yForVirtualScrollElementSize", "c8yForVirtualScrollStrategy", "c8yForVirtualScrollContainerHeight"], outputs: ["c8yForCount", "c8yForChange", "c8yForLoadMoreComponent"] }, { kind: "component", type: ListItemTimelineComponent, selector: "c8y-list-item-timeline, c8y-li-timeline" }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: TooltipDirective, selector: "[tooltip], [tooltipHtml]", inputs: ["adaptivePosition", "tooltip", "placement", "triggers", "container", "containerClass", "boundariesElement", "isOpen", "isDisabled", "delay", "tooltipHtml", "tooltipPlacement", "tooltipIsOpen", "tooltipEnable", "tooltipAppendToBody", "tooltipAnimation", "tooltipClass", "tooltipContext", "tooltipPopupDelay", "tooltipFadeDuration", "tooltipTrigger"], outputs: ["tooltipChange", "onShown", "onHidden", "tooltipStateChanged"], exportAs: ["bs-tooltip"] }, { kind: "component", type: ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: AlarmsIconComponent, selector: "c8y-alarms-icon", inputs: ["alarm", "typeFilters"] }, { kind: "component", type: ListItemBodyComponent, selector: "c8y-list-item-body, c8y-li-body", inputs: ["body"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: DynamicComponentAlertsComponent, selector: "c8y-dynamic-component-alerts", inputs: ["alerts"] }, { kind: "component", type: SplitViewListComponent, selector: "c8y-sv-list", inputs: ["title", "loading", "showEmptyState", "emptyStateIcon", "emptyStateTitle", "emptyStateSubtitle", "docsUrl", "showTitle", "listOpacity"] }, { kind: "component", type: SplitViewHeaderActionsComponent, selector: "c8y-sv-header-actions" }, { kind: "component", type: SplitViewAlertsComponent, selector: "c8y-sv-alerts" }, { kind: "component", type: ListGroupComponent, selector: "c8y-list-group" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: DatePipe, name: "c8yDate" }, { kind: "pipe", type: AlarmListIndicatorPipe, name: "alarmListIndicator" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: AlarmsListComponent, isStandalone: true, selector: "c8y-alarms-list", inputs: { alarms: "alarms", hasPermissions: "hasPermissions", typeFilters: "typeFilters", loadMoreMode: "loadMoreMode", navigationOptions: "navigationOptions", isInitialLoading: "isInitialLoading", isInPreviewMode: "isInPreviewMode" }, outputs: { onSelectedAlarm: "onSelectedAlarm", onScrollingStateChange: "onScrollingStateChange" }, viewQueries: [{ propertyName: "svListComponent", first: true, predicate: ["scrollWrapper"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<c8y-sv-list\n  [emptyStateIcon]=\"'c8y-alert-idle'\"\n  [title]=\"'Alarms list' | translate\"\n  [emptyStateTitle]=\"'No alarms to display.' | translate\"\n  [loading]=\"isInitialLoading || isEmptyListLoading\"\n  [showEmptyState]=\"isEmptyListLoading && !isInitialLoading && hasPermissions\"\n  [docsUrl]=\"\n    '/docs/device-management-application/monitoring-and-controlling-devices/#working-with-alarms'\n  \"\n  data-cy=\"c8y-alarms-list\"\n  #scrollWrapper\n>\n  <c8y-sv-header-actions>\n    <ng-content></ng-content>\n  </c8y-sv-header-actions>\n\n  <c8y-sv-alerts>\n    <c8y-dynamic-component-alerts [alerts]=\"alertAggregator\"></c8y-dynamic-component-alerts>\n    @if (\n      !isEmptyListLoading &&\n      (activeChildParam$ | async) &&\n      (activeAlarm$ | async)?.id !== (activeChildParam$ | async)\n    ) {\n      <div\n        class=\"alert alert-warning m-b-0\"\n        role=\"alert\"\n        translate\n      >\n        The selected alarm is not currently in the list, change your filter.\n      </div>\n    }\n  </c8y-sv-alerts>\n\n  @if (!hasPermissions) {\n    <c8y-dynamic-component-alerts\n      [alerts]=\"permissionAlertAggregator\"\n    ></c8y-dynamic-component-alerts>\n  } @else {\n    <c8y-list-group class=\"c8y-list--timeline d-block p-r-16 p-t-16\">\n      <c8y-li-timeline\n        class=\"pointer c8y-list--timeline__item\"\n        role=\"button\"\n        data-cy=\"c8y-alarms-list--timeline-repeat\"\n        *c8yFor=\"let alarm of alarms; let i = index; pipe: mapAlarmLink; loadMore: loadMoreMode\"\n        [routerLink]=\"navigationOptions.allowNavigationToAlarmsView ? alarm.link : null\"\n        routerLinkActive=\"active\"\n        [queryParamsHandling]=\"navigationOptions.queryParamsHandling\"\n        (isActiveChange)=\"activeRouteChanged($event, liScrollAnchor, alarm)\"\n        (click)=\"onAlarmOpen(alarm)\"\n        [queryParams]=\"\n          navigationOptions.includeClearedQueryParams\n            ? { showCleared: alarm.status === 'CLEARED' }\n            : {}\n        \"\n      >\n        <span\n          [attr.aria-label]=\"alarmLastOccurrenceLabel | translate\"\n          [tooltip]=\"alarmLastOccurrenceLabel | translate\"\n          placement=\"right\"\n          container=\"body\"\n          data-cy=\"c8y-alarms-list--last-occurrence-date\"\n          [delay]=\"500\"\n        >\n          {{ alarm.time | c8yDate: 'mediumDate' }}\n          {{ alarm.time | c8yDate: 'mediumTime' }}\n        </span>\n        <c8y-li\n          style=\"scroll-margin-top: 56px\"\n          #liScrollAnchor\n        >\n          <c8y-li-icon class=\"a-s-start\">\n            <div class=\"alarm-icons\">\n              <c8y-alarms-icon\n                [typeFilters]=\"typeFilters\"\n                [alarm]=\"alarm\"\n              ></c8y-alarms-icon>\n            </div>\n            @if (alarm.firstOccurrenceTime) {\n              <button\n                class=\"btn-clean text-center\"\n                [attr.aria-label]=\"\n                  alarmBadgeTooltip\n                    | translate\n                      : { alarmFirstOccurrenceTime: alarm.firstOccurrenceTime | c8yDate: 'medium' }\n                \"\n                [tooltip]=\"\n                  alarmBadgeTooltip\n                    | translate\n                      : { alarmFirstOccurrenceTime: alarm.firstOccurrenceTime | c8yDate: 'medium' }\n                \"\n                placement=\"right\"\n                container=\"body\"\n                type=\"button\"\n                data-cy=\"c8y-alarms-list--badge\"\n                (click)=\"$event.stopPropagation()\"\n                [delay]=\"500\"\n              >\n                @if (alarm.count > 1) {\n                  <span class=\"badge badge-info\">\n                    {{ alarm.count }}\n                  </span>\n                }\n              </button>\n            }\n          </c8y-li-icon>\n          <c8y-li-body class=\"a-s-stretch\">\n            <div class=\"d-flex a-i-start fit-h\">\n              <div class=\"min-width-0 flex-grow\">\n                <p\n                  class=\"text-truncate-wrap p-b-4\"\n                  data-cy=\"c8y-alarms-list--alarm-text\"\n                >\n                  {{ alarm.text | translate }}\n                </p>\n                <div class=\"d-flex\">\n                  <p\n                    class=\"small text-muted text-truncate flex-grow\"\n                    [title]=\"alarm.source.name\"\n                    data-cy=\"c8y-alarms-list--alarm-source-name\"\n                  >\n                    <i [c8yIcon]=\"'exchange'\"></i>\n                    {{ alarm.source.name }}\n                  </p>\n                  <div class=\"d-flex\">\n                    @for (item of alarm | alarmListIndicator | async; track $index) {\n                      <div [title]=\"item.title | translate\">\n                        <i\n                          [class]=\"item.class\"\n                          [c8yIcon]=\"item.icon\"\n                        ></i>\n                      </div>\n                    }\n                  </div>\n                </div>\n              </div>\n            </div>\n          </c8y-li-body>\n        </c8y-li>\n      </c8y-li-timeline>\n    </c8y-list-group>\n  }\n</c8y-sv-list>\n", dependencies: [{ kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: ForOfDirective, selector: "[c8yFor]", inputs: ["c8yForOf", "c8yForLoadMore", "c8yForPipe", "c8yForNotFound", "c8yForMaxIterations", "c8yForLoadingTemplate", "c8yForLoadNextLabel", "c8yForLoadingLabel", "c8yForRealtime", "c8yForRealtimeOptions", "c8yForComparator", "c8yForEnableVirtualScroll", "c8yForVirtualScrollElementSize", "c8yForVirtualScrollStrategy", "c8yForVirtualScrollContainerHeight"], outputs: ["c8yForCount", "c8yForChange", "c8yForLoadMoreComponent"] }, { kind: "component", type: ListItemTimelineComponent, selector: "c8y-list-item-timeline, c8y-li-timeline" }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: TooltipDirective, selector: "[tooltip], [tooltipHtml]", inputs: ["adaptivePosition", "tooltip", "placement", "triggers", "container", "containerClass", "boundariesElement", "isOpen", "isDisabled", "delay", "tooltipHtml", "tooltipPlacement", "tooltipIsOpen", "tooltipEnable", "tooltipAppendToBody", "tooltipAnimation", "tooltipClass", "tooltipContext", "tooltipPopupDelay", "tooltipFadeDuration", "tooltipTrigger"], outputs: ["tooltipChange", "onShown", "onHidden", "tooltipStateChanged"], exportAs: ["bs-tooltip"] }, { kind: "component", type: ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: AlarmsIconComponent, selector: "c8y-alarms-icon", inputs: ["alarm", "typeFilters"] }, { kind: "component", type: ListItemBodyComponent, selector: "c8y-list-item-body, c8y-li-body", inputs: ["body"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: DynamicComponentAlertsComponent, selector: "c8y-dynamic-component-alerts", inputs: ["alerts"] }, { kind: "component", type: SplitViewListComponent, selector: "c8y-sv-list", inputs: ["title", "loading", "showEmptyState", "emptyStateIcon", "emptyStateTitle", "emptyStateSubtitle", "docsUrl", "showTitle", "listOpacity"] }, { kind: "component", type: SplitViewHeaderActionsComponent, selector: "c8y-sv-header-actions" }, { kind: "component", type: SplitViewAlertsComponent, selector: "c8y-sv-alerts" }, { kind: "component", type: ListGroupComponent, selector: "c8y-list-group" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: DatePipe, name: "c8yDate" }, { kind: "pipe", type: AlarmListIndicatorPipe, name: "alarmListIndicator" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AlarmsListComponent, decorators: [{
             type: Component,
@@ -2067,7 +2072,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                         SplitViewHeaderActionsComponent,
                         SplitViewAlertsComponent,
                         ListGroupComponent
-                    ], template: "<c8y-sv-list\n  [emptyStateIcon]=\"'c8y-alert-idle'\"\n  [title]=\"'Alarms list' | translate\"\n  [emptyStateTitle]=\"'No alarms to display.' | translate\"\n  [loading]=\"isInitialLoading || isEmptyListLoading\"\n  [showEmptyState]=\"isEmptyListLoading && !isInitialLoading && hasPermissions\"\n  [docsUrl]=\"\n    '/docs/device-management-application/monitoring-and-controlling-devices/#working-with-alarms'\n  \"\n  data-cy=\"c8y-alarms-list\"\n  #scrollWrapper\n>\n  <c8y-sv-header-actions>\n    <ng-content></ng-content>\n  </c8y-sv-header-actions>\n\n  <c8y-sv-alerts>\n    @if (\n      !isEmptyListLoading &&\n      (activeChildParam$ | async) &&\n      (activeAlarm$ | async)?.id !== (activeChildParam$ | async)\n    ) {\n      <div\n        class=\"alert alert-warning m-b-0\"\n        role=\"alert\"\n        translate\n      >\n        The selected alarm is not currently in the list, change your filter.\n      </div>\n    }\n  </c8y-sv-alerts>\n\n  <c8y-list-group class=\"c8y-list--timeline d-block p-r-16 p-t-16\">\n    <c8y-li-timeline\n      class=\"pointer c8y-list--timeline__item\"\n      role=\"button\"\n      data-cy=\"c8y-alarms-list--timeline-repeat\"\n      *c8yFor=\"let alarm of alarms; let i = index; pipe: mapAlarmLink; loadMore: loadMoreMode\"\n      [routerLink]=\"navigationOptions.allowNavigationToAlarmsView ? alarm.link : null\"\n      routerLinkActive=\"active\"\n      [queryParamsHandling]=\"navigationOptions.queryParamsHandling\"\n      (isActiveChange)=\"activeRouteChanged($event, liScrollAnchor, alarm)\"\n      (click)=\"onAlarmOpen(alarm)\"\n      [queryParams]=\"\n        navigationOptions.includeClearedQueryParams\n          ? { showCleared: alarm.status === 'CLEARED' }\n          : {}\n      \"\n    >\n      <span\n        [attr.aria-label]=\"alarmLastOccurrenceLabel | translate\"\n        [tooltip]=\"alarmLastOccurrenceLabel | translate\"\n        placement=\"right\"\n        container=\"body\"\n        data-cy=\"c8y-alarms-list--last-occurrence-date\"\n        [delay]=\"500\"\n      >\n        {{ alarm.time | c8yDate: 'mediumDate' }}\n        {{ alarm.time | c8yDate: 'mediumTime' }}\n      </span>\n      <c8y-li\n        style=\"scroll-margin-top: 56px\"\n        #liScrollAnchor\n      >\n        <c8y-li-icon class=\"a-s-start\">\n          <div class=\"alarm-icons\">\n            <c8y-alarms-icon\n              [typeFilters]=\"typeFilters\"\n              [alarm]=\"alarm\"\n            ></c8y-alarms-icon>\n          </div>\n          @if (alarm.firstOccurrenceTime) {\n            <button\n              class=\"btn-clean text-center\"\n              [attr.aria-label]=\"\n                alarmBadgeTooltip\n                  | translate\n                    : { alarmFirstOccurrenceTime: alarm.firstOccurrenceTime | c8yDate: 'medium' }\n              \"\n              [tooltip]=\"\n                alarmBadgeTooltip\n                  | translate\n                    : { alarmFirstOccurrenceTime: alarm.firstOccurrenceTime | c8yDate: 'medium' }\n              \"\n              placement=\"right\"\n              container=\"body\"\n              type=\"button\"\n              data-cy=\"c8y-alarms-list--badge\"\n              (click)=\"$event.stopPropagation()\"\n              [delay]=\"500\"\n            >\n              @if (alarm.count > 1) {\n                <span class=\"badge badge-info\">\n                  {{ alarm.count }}\n                </span>\n              }\n            </button>\n          }\n        </c8y-li-icon>\n        <c8y-li-body class=\"a-s-stretch\">\n          <div class=\"d-flex a-i-start fit-h\">\n            <div class=\"min-width-0 flex-grow\">\n              <p\n                class=\"text-truncate-wrap p-b-4\"\n                data-cy=\"c8y-alarms-list--alarm-text\"\n              >\n                {{ alarm.text | translate }}\n              </p>\n              <div class=\"d-flex\">\n                <p\n                  class=\"small text-muted text-truncate flex-grow\"\n                  [title]=\"alarm.source.name\"\n                  data-cy=\"c8y-alarms-list--alarm-source-name\"\n                >\n                  <i [c8yIcon]=\"'exchange'\"></i>\n                  {{ alarm.source.name }}\n                </p>\n                <div class=\"d-flex\">\n                  @for (item of alarm | alarmListIndicator | async; track $index) {\n                    <div [title]=\"item.title | translate\">\n                      <i\n                        [class]=\"item.class\"\n                        [c8yIcon]=\"item.icon\"\n                      ></i>\n                    </div>\n                  }\n                </div>\n              </div>\n            </div>\n          </div>\n        </c8y-li-body>\n      </c8y-li>\n    </c8y-li-timeline>\n  </c8y-list-group>\n</c8y-sv-list>\n\n<ng-template #alertsA>\n  <c8y-dynamic-component-alerts [alerts]=\"alertAggregator\"></c8y-dynamic-component-alerts>\n</ng-template>\n" }]
+                    ], template: "<c8y-sv-list\n  [emptyStateIcon]=\"'c8y-alert-idle'\"\n  [title]=\"'Alarms list' | translate\"\n  [emptyStateTitle]=\"'No alarms to display.' | translate\"\n  [loading]=\"isInitialLoading || isEmptyListLoading\"\n  [showEmptyState]=\"isEmptyListLoading && !isInitialLoading && hasPermissions\"\n  [docsUrl]=\"\n    '/docs/device-management-application/monitoring-and-controlling-devices/#working-with-alarms'\n  \"\n  data-cy=\"c8y-alarms-list\"\n  #scrollWrapper\n>\n  <c8y-sv-header-actions>\n    <ng-content></ng-content>\n  </c8y-sv-header-actions>\n\n  <c8y-sv-alerts>\n    <c8y-dynamic-component-alerts [alerts]=\"alertAggregator\"></c8y-dynamic-component-alerts>\n    @if (\n      !isEmptyListLoading &&\n      (activeChildParam$ | async) &&\n      (activeAlarm$ | async)?.id !== (activeChildParam$ | async)\n    ) {\n      <div\n        class=\"alert alert-warning m-b-0\"\n        role=\"alert\"\n        translate\n      >\n        The selected alarm is not currently in the list, change your filter.\n      </div>\n    }\n  </c8y-sv-alerts>\n\n  @if (!hasPermissions) {\n    <c8y-dynamic-component-alerts\n      [alerts]=\"permissionAlertAggregator\"\n    ></c8y-dynamic-component-alerts>\n  } @else {\n    <c8y-list-group class=\"c8y-list--timeline d-block p-r-16 p-t-16\">\n      <c8y-li-timeline\n        class=\"pointer c8y-list--timeline__item\"\n        role=\"button\"\n        data-cy=\"c8y-alarms-list--timeline-repeat\"\n        *c8yFor=\"let alarm of alarms; let i = index; pipe: mapAlarmLink; loadMore: loadMoreMode\"\n        [routerLink]=\"navigationOptions.allowNavigationToAlarmsView ? alarm.link : null\"\n        routerLinkActive=\"active\"\n        [queryParamsHandling]=\"navigationOptions.queryParamsHandling\"\n        (isActiveChange)=\"activeRouteChanged($event, liScrollAnchor, alarm)\"\n        (click)=\"onAlarmOpen(alarm)\"\n        [queryParams]=\"\n          navigationOptions.includeClearedQueryParams\n            ? { showCleared: alarm.status === 'CLEARED' }\n            : {}\n        \"\n      >\n        <span\n          [attr.aria-label]=\"alarmLastOccurrenceLabel | translate\"\n          [tooltip]=\"alarmLastOccurrenceLabel | translate\"\n          placement=\"right\"\n          container=\"body\"\n          data-cy=\"c8y-alarms-list--last-occurrence-date\"\n          [delay]=\"500\"\n        >\n          {{ alarm.time | c8yDate: 'mediumDate' }}\n          {{ alarm.time | c8yDate: 'mediumTime' }}\n        </span>\n        <c8y-li\n          style=\"scroll-margin-top: 56px\"\n          #liScrollAnchor\n        >\n          <c8y-li-icon class=\"a-s-start\">\n            <div class=\"alarm-icons\">\n              <c8y-alarms-icon\n                [typeFilters]=\"typeFilters\"\n                [alarm]=\"alarm\"\n              ></c8y-alarms-icon>\n            </div>\n            @if (alarm.firstOccurrenceTime) {\n              <button\n                class=\"btn-clean text-center\"\n                [attr.aria-label]=\"\n                  alarmBadgeTooltip\n                    | translate\n                      : { alarmFirstOccurrenceTime: alarm.firstOccurrenceTime | c8yDate: 'medium' }\n                \"\n                [tooltip]=\"\n                  alarmBadgeTooltip\n                    | translate\n                      : { alarmFirstOccurrenceTime: alarm.firstOccurrenceTime | c8yDate: 'medium' }\n                \"\n                placement=\"right\"\n                container=\"body\"\n                type=\"button\"\n                data-cy=\"c8y-alarms-list--badge\"\n                (click)=\"$event.stopPropagation()\"\n                [delay]=\"500\"\n              >\n                @if (alarm.count > 1) {\n                  <span class=\"badge badge-info\">\n                    {{ alarm.count }}\n                  </span>\n                }\n              </button>\n            }\n          </c8y-li-icon>\n          <c8y-li-body class=\"a-s-stretch\">\n            <div class=\"d-flex a-i-start fit-h\">\n              <div class=\"min-width-0 flex-grow\">\n                <p\n                  class=\"text-truncate-wrap p-b-4\"\n                  data-cy=\"c8y-alarms-list--alarm-text\"\n                >\n                  {{ alarm.text | translate }}\n                </p>\n                <div class=\"d-flex\">\n                  <p\n                    class=\"small text-muted text-truncate flex-grow\"\n                    [title]=\"alarm.source.name\"\n                    data-cy=\"c8y-alarms-list--alarm-source-name\"\n                  >\n                    <i [c8yIcon]=\"'exchange'\"></i>\n                    {{ alarm.source.name }}\n                  </p>\n                  <div class=\"d-flex\">\n                    @for (item of alarm | alarmListIndicator | async; track $index) {\n                      <div [title]=\"item.title | translate\">\n                        <i\n                          [class]=\"item.class\"\n                          [c8yIcon]=\"item.icon\"\n                        ></i>\n                      </div>\n                    }\n                  </div>\n                </div>\n              </div>\n            </div>\n          </c8y-li-body>\n        </c8y-li>\n      </c8y-li-timeline>\n    </c8y-list-group>\n  }\n</c8y-sv-list>\n" }]
         }], ctorParameters: () => [{ type: i1.ActivatedRoute }, { type: AlarmsViewService }, { type: i3.ContextRouteService }, { type: i1.Router }], propDecorators: { alarms: [{
                 type: Input
             }], hasPermissions: [{
@@ -2711,8 +2716,9 @@ class AlarmsModule {
             ngModule: AlarmsModule,
             providers: [
                 ...(alarmsConfig.hybrid ? [smartRulesUpgradeServiceProvider] : []),
-                hookNavigator(alarmsConfig.rootNavigatorNode),
+                ...(alarmsConfig.rootNavigatorNode ? [hookNavigator(alarmsConfig.rootNavigatorNode)] : []),
                 hookRoute(alarmsConfig.route),
+                ...(alarmsConfig.additionalProviders || []),
                 {
                     provide: ALARMS_MODULE_CONFIG,
                     useValue: alarmsConfig
@@ -2828,9 +2834,51 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                 }]
         }] });
 
+class AlarmsGuard {
+    constructor() {
+        this.permissions = inject(Permissions);
+    }
+    canActivate() {
+        return this.permissions.hasAnyRole([Permissions.ROLE_ALARM_READ, Permissions.ROLE_ALARM_ADMIN]);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AlarmsGuard, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AlarmsGuard, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AlarmsGuard, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }] });
+
+class AlarmsNavigationFactory {
+    constructor() {
+        this.guard = inject(AlarmsGuard);
+        this.navs = [];
+    }
+    async get() {
+        const canActivate = this.guard.canActivate();
+        if (canActivate && this.navs.length === 0) {
+            this.navs.push(new NavigatorNode({
+                label: gettext('Alarms'),
+                icon: 'bell',
+                path: `/${ALARMS_PATH}`,
+                featureId: 'alarms',
+                parent: '',
+                routerLinkExact: false,
+                priority: 1000
+            }));
+        }
+        return this.navs;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AlarmsNavigationFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AlarmsNavigationFactory }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AlarmsNavigationFactory, decorators: [{
+            type: Injectable
+        }] });
+
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { ALARMS_MODULE_CONFIG, ALARMS_PATH, ALARM_DEFAULT_PROPERTIES, ALARM_SEVERITY_ICON, ALARM_SEVERITY_ICON_MAP, ALARM_STATUS_ICON, AlarmDetailsButtonPipe, AlarmDetailsButtonService, AlarmDetailsComponent, AlarmDetailsService, AlarmEmptyComponent, AlarmIconMap, AlarmInfoComponent, AlarmListIndicatorPipe, AlarmListIndicatorService, AlarmSeveritiesToTitlePipe, AlarmSeverityToIconClassPipe, AlarmSeverityToIconPipe, AlarmSeverityToLabelPipe, AlarmStatusToIconPipe, AlarmStatusToLabelPipe, AlarmsActivityTrackerService, AlarmsComponent, AlarmsDateFilterComponent, AlarmsFilterComponent, AlarmsIconComponent, AlarmsIntervalRefreshComponent, AlarmsListComponent, AlarmsModule, AlarmsTypeFilterComponent, AlarmsViewService, AuditChangesMessagePipe, DEFAULT_ALARM_COUNTS, DEFAULT_SEVERITY_VALUES, DEFAULT_STATUS_VALUES, HELP_ICON, INTERVALS_EXTENDED, INTERVAL_TITLES_EXTENDED, Ng1SmartRulesUpgradeService, PRODUCT_EXPERIENCE_ALARMS, SmartRulesUpgradeServiceFactory, THROTTLE_REALTIME_REFRESH, getChildrenForViewContext, getViewContextRoutes, smartRulesUpgradeServiceProvider };
+export { ALARMS_MODULE_CONFIG, ALARMS_PATH, ALARM_DEFAULT_PROPERTIES, ALARM_SEVERITY_ICON, ALARM_SEVERITY_ICON_MAP, ALARM_STATUS_ICON, AlarmDetailsButtonPipe, AlarmDetailsButtonService, AlarmDetailsComponent, AlarmDetailsService, AlarmEmptyComponent, AlarmIconMap, AlarmInfoComponent, AlarmListIndicatorPipe, AlarmListIndicatorService, AlarmSeveritiesToTitlePipe, AlarmSeverityToIconClassPipe, AlarmSeverityToIconPipe, AlarmSeverityToLabelPipe, AlarmStatusToIconPipe, AlarmStatusToLabelPipe, AlarmsActivityTrackerService, AlarmsComponent, AlarmsDateFilterComponent, AlarmsFilterComponent, AlarmsGuard, AlarmsIconComponent, AlarmsIntervalRefreshComponent, AlarmsListComponent, AlarmsModule, AlarmsNavigationFactory, AlarmsTypeFilterComponent, AlarmsViewService, AuditChangesMessagePipe, DEFAULT_ALARM_COUNTS, DEFAULT_SEVERITY_VALUES, DEFAULT_STATUS_VALUES, HELP_ICON, INTERVALS_EXTENDED, INTERVAL_TITLES_EXTENDED, Ng1SmartRulesUpgradeService, PRODUCT_EXPERIENCE_ALARMS, SmartRulesUpgradeServiceFactory, THROTTLE_REALTIME_REFRESH, getChildrenForViewContext, getViewContextRoutes, smartRulesUpgradeServiceProvider };
 //# sourceMappingURL=c8y-ngx-components-alarms.mjs.map