@c8y/ngx-components 1022.10.1 → 1022.13.0

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

@@ -1,35 +1,30 @@
 import * as i0 from '@angular/core';
-import { Input, Component, Pipe, inject, Injectable, EventEmitter, Output, ViewChild, NgModule } from '@angular/core';
+import { Input, Component, ViewChild, Injectable, EventEmitter, Output, inject, NgModule } from '@angular/core';
 import * as i2 from '@c8y/ngx-components';
-import { gettext, Status, GainsightService, PluginsService, AlertService, HumanizeAppNamePipe, PackageType, PluginsExportScopes, Permissions, ViewContext, ApplicationPluginStatus, BottomDrawerRef, DataGridComponent, CoreModule, hookRoute, C8yStepper, TitleComponent, BreadcrumbComponent, BreadcrumbItemComponent, C8yTranslatePipe, FormsModule, hookTab, hookWizard } from '@c8y/ngx-components';
+import { ListGroupComponent, ListItemTimelineComponent, ListItemComponent, ListItemIconComponent, ListItemBodyComponent, IconDirective, ListItemActionComponent, FormGroupComponent, C8yTranslatePipe, DatePipe, gettext, Status, LoadingComponent, PluginsService, PluginsExportScopes, ModalComponent, C8yTranslateDirective, ListItemFooterComponent, ListItemCollapseComponent, OperationResultComponent, Permissions, ViewContext, TitleComponent, BreadcrumbComponent, BreadcrumbItemComponent, AppIconComponent, TextareaAutoresizeDirective, PropertiesListComponent, RequiredInputPlaceholderDirective, MessagesComponent, MessageDirective, HumanizeAppNamePipe, WizardHeaderComponent, WizardBodyComponent, WizardFooterComponent, IfAllowedDirective, ActionBarItemComponent, ListDisplaySwitchComponent, HelpComponent, EmptyStateComponent, TypeaheadComponent, ForOfDirective, HighlightComponent, C8yStepper, PackageType, MarkdownToHtmlPipe, CoreModule, FormsModule as FormsModule$1, hookTab, hookRoute, hookWizard } from '@c8y/ngx-components';
 import * as i1 from '@c8y/ngx-components/ecosystem/shared';
-import { EcosystemService, PRODUCT_EXPERIENCE_ECOSYSTEM, packageProperties, defaultPackageAvailabilities, EcosystemWizards, ListFiltersComponent, ApplicationPropertiesFormComponent, defaultPackageTypes, SharedEcosystemModule, ERROR_TYPE, APP_STATE, PACKAGE_TYPE_LABELS, defaultPackageContents, PackageChangelogComponent } from '@c8y/ngx-components/ecosystem/shared';
-import * as i3 from '@angular/common';
-import { AsyncPipe } from '@angular/common';
-import * as i2$1 from '@angular/forms';
-import { Validators, FormControl, ReactiveFormsModule } from '@angular/forms';
+import { UploadArchiveComponent, packageProperties, PRODUCT_EXPERIENCE_ECOSYSTEM, AddApplicationComponent, defaultPackageAvailabilities, EcosystemWizards, ListFiltersComponent, ApplicationCardComponent, ApplicationPropertiesFormComponent, ERROR_TYPE, APP_STATE, PackageVersionSelectComponent, PACKAGE_TYPE_LABELS, TranslatePackageLabelPipe, defaultPackageTypes, defaultPackageContents, ArchivedFilterComponent, PackageChangelogComponent, SharedEcosystemModule } from '@c8y/ngx-components/ecosystem/shared';
+import { NgFor, NgClass, NgIf, AsyncPipe, NgSwitch, NgSwitchCase, NgStyle } from '@angular/common';
+import * as i3 from '@angular/forms';
+import { Validators, FormsModule, ReactiveFormsModule } from '@angular/forms';
 import * as i1$2 from '@angular/router';
 import { Router, RouterModule } from '@angular/router';
 import * as i4 from '@c8y/client';
-import { ApplicationType, Isolation, BillingMode } from '@c8y/client';
+import { Isolation, BillingMode, ApplicationType } from '@c8y/client';
 import * as i6 from '@ngx-translate/core';
-import { TranslateService } from '@ngx-translate/core';
 import * as i1$1 from 'ngx-bootstrap/modal';
-import { BsModalService } from 'ngx-bootstrap/modal';
 import { isEmpty } from 'lodash';
-import { Subject, BehaviorSubject, combineLatest, of, firstValueFrom, from, map as map$1 } from 'rxjs';
-import { map, takeUntil, tap, switchMap, shareReplay } from 'rxjs/operators';
-import { pick, uniq } from 'lodash-es';
-import * as i9 from 'ngx-bootstrap/tooltip';
-import { TooltipModule } from 'ngx-bootstrap/tooltip';
-import * as i10 from '@c8y/ngx-components/icon-selector';
-import { IconSelectorModule } from '@c8y/ngx-components/icon-selector';
+import { BehaviorSubject, Subject, combineLatest, of, from } from 'rxjs';
+import { PluginListComponent, ApplicationPluginsModule } from '@c8y/ngx-components/ecosystem/application-plugins';
+import { TooltipDirective, TooltipModule } from 'ngx-bootstrap/tooltip';
+import { IconSelectorWrapperComponent, IconSelectorModule } from '@c8y/ngx-components/icon-selector';
+import { tap, switchMap, shareReplay, takeUntil, map } from 'rxjs/operators';
 import { A11yModule } from '@angular/cdk/a11y';
 import { ArchivedConfirmModule } from '@c8y/ngx-components/ecosystem/archived-confirm';
 import { LicenseConfirmModule } from '@c8y/ngx-components/ecosystem/license-confirm';
-import * as i6$1 from 'ngx-bootstrap/dropdown';
-import { BsDropdownModule } from 'ngx-bootstrap/dropdown';
+import { BsDropdownDirective, BsDropdownToggleDirective, BsDropdownMenuDirective, BsDropdownModule } from 'ngx-bootstrap/dropdown';
 import { PopoverModule } from 'ngx-bootstrap/popover';
+import { pick } from 'lodash-es';
 
 class ActivityLogComponent {
     constructor(ecosystemService, alertService) {
@@ -99,11 +94,26 @@ class ActivityLogComponent {
         this.isLoading = false;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ActivityLogComponent, deps: [{ token: i1.EcosystemService }, { token: i2.AlertService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ActivityLogComponent, isStandalone: false, selector: "c8y-activity-log", inputs: { application: "application", hasAdminPermissions: "hasAdminPermissions" }, ngImport: i0, template: "<div class=\"inner-scroll bg-level-1 flex-grow inner-scroll--md overflow-visible-sm overflow-visible-xs\">\n  <div class=\"card-block overflow-visible\">\n    <c8y-list-group>\n      <c8y-li-timeline *ngFor=\"let archive of archives\" [ngClass]=\"{ active: isActive(archive) }\">\n        {{ archive.created | date: 'd MMM YYYY' }}\n        {{ archive.created | date: 'shortTime' }}\n        <c8y-li>\n          <c8y-li-icon\n            [icon]=\"checkIfLast(archive) ? 'flag-checkered' : 'file-zip-o'\"\n          ></c8y-li-icon>\n          <c8y-li-body>\n            <div class=\"d-flex a-i-start\">\n              <div style=\"min-width: 0; flex: 1\">\n                <span class=\"text-truncate-wrap\" title=\" {{ archive.description || archive.name }}\">\n                  {{ archive.description || archive.name }}\n                </span>\n                <small *ngIf=\"archive.description\" class=\"text-muted\">{{\n                  archive.description\n                }}</small>\n              </div>\n              <i\n                *ngIf=\"isLoading && toActivate(archive)\"\n                [c8yIcon]=\"'circle-o-notch'\"\n                class=\"icon-spin\"\n                title=\"{{ 'Activating' | translate }}\"\n              ></i>\n\n              <span *ngIf=\"isActive(archive)\" class=\"label label-primary m-l-auto m-t-4\">{{\n                'Active' | translate\n              }}</span>\n            </div>\n          </c8y-li-body>\n          <c8y-li-action\n            (click)=\"setActive(archive)\"\n            *ngIf=\"hasAdminPermissions && !isLoading && !isActive(archive)\"\n            icon=\"check-square-o\"\n          >\n            {{ 'Set as active`archive`' | translate }}\n          </c8y-li-action>\n          <c8y-li-action (click)=\"downloadArchive(archive)\" icon=\"download\">\n            {{ 'Download`archive`' | translate }}\n          </c8y-li-action>\n          <c8y-li-action\n            (click)=\"deleteArchive(archive)\"\n            *ngIf=\"\n              hasAdminPermissions &&\n              archives.length > 1 &&\n              !checkIfLast(archive) &&\n              !isActive(archive)\n            \"\n            icon=\"delete\"\n          >\n            {{ 'Delete`archive`' | translate }}\n          </c8y-li-action>\n          <c8y-li-action\n            (click)=\"reactivateArchive()\"\n            *ngIf=\"hasAdminPermissions && canReactivate && isActive(archive)\"\n            icon=\"undo\"\n          >\n            {{ 'Reactivate archive' | translate }}\n          </c8y-li-action>\n        </c8y-li>\n      </c8y-li-timeline>\n    </c8y-list-group>\n  </div>\n</div>\n<div class=\"card-footer\" *ngIf=\"!isLoading && hasAdminPermissions\">\n  <c8y-form-group class=\"m-auto\">\n    <c8y-upload-archive [(application)]=\"application\" (refresh)=\"onRefresh()\"></c8y-upload-archive>\n  </c8y-form-group>\n</div>\n", dependencies: [{ kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "component", type: i2.ListGroupComponent, selector: "c8y-list-group" }, { kind: "component", type: i2.ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: i2.ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: i2.ListItemBodyComponent, selector: "c8y-list-item-body, c8y-li-body", inputs: ["body"] }, { kind: "component", type: i2.ListItemActionComponent, selector: "c8y-list-item-action, c8y-li-action", inputs: ["label", "icon", "disabled"], outputs: ["click"] }, { kind: "component", type: i2.ListItemTimelineComponent, selector: "c8y-list-item-timeline, c8y-li-timeline" }, { kind: "component", type: i1.UploadArchiveComponent, selector: "c8y-upload-archive", inputs: ["application", "uploadNewVersion", "preUploadCallback"], outputs: ["applicationChange", "refresh"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i3.DatePipe, name: "date" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ActivityLogComponent, isStandalone: true, selector: "c8y-activity-log", inputs: { application: "application", hasAdminPermissions: "hasAdminPermissions" }, ngImport: i0, template: "<div class=\"inner-scroll bg-level-1 flex-grow inner-scroll--md overflow-visible-sm overflow-visible-xs\">\n  <div class=\"card-block overflow-visible\">\n    <c8y-list-group>\n      <c8y-li-timeline *ngFor=\"let archive of archives\" [ngClass]=\"{ active: isActive(archive) }\">\n        {{ archive.created | c8yDate: 'd MMM YYYY' }}\n        {{ archive.created | c8yDate: 'shortTime' }}\n        <c8y-li>\n          <c8y-li-icon\n            [icon]=\"checkIfLast(archive) ? 'flag-checkered' : 'file-zip-o'\"\n          ></c8y-li-icon>\n          <c8y-li-body>\n            <div class=\"d-flex a-i-start\">\n              <div style=\"min-width: 0; flex: 1\">\n                <span class=\"text-truncate-wrap\" title=\" {{ archive.description || archive.name }}\">\n                  {{ archive.description || archive.name }}\n                </span>\n                <small *ngIf=\"archive.description\" class=\"text-muted\">{{\n                  archive.description\n                }}</small>\n              </div>\n              <i\n                *ngIf=\"isLoading && toActivate(archive)\"\n                [c8yIcon]=\"'circle-o-notch'\"\n                class=\"icon-spin\"\n                title=\"{{ 'Activating' | translate }}\"\n              ></i>\n\n              <span *ngIf=\"isActive(archive)\" class=\"label label-primary m-l-auto m-t-4\">{{\n                'Active' | translate\n              }}</span>\n            </div>\n          </c8y-li-body>\n          <c8y-li-action\n            (click)=\"setActive(archive)\"\n            *ngIf=\"hasAdminPermissions && !isLoading && !isActive(archive)\"\n            icon=\"check-square-o\"\n          >\n            {{ 'Set as active`archive`' | translate }}\n          </c8y-li-action>\n          <c8y-li-action (click)=\"downloadArchive(archive)\" icon=\"download\">\n            {{ 'Download`archive`' | translate }}\n          </c8y-li-action>\n          <c8y-li-action\n            (click)=\"deleteArchive(archive)\"\n            *ngIf=\"\n              hasAdminPermissions &&\n              archives.length > 1 &&\n              !checkIfLast(archive) &&\n              !isActive(archive)\n            \"\n            icon=\"delete\"\n          >\n            {{ 'Delete`archive`' | translate }}\n          </c8y-li-action>\n          <c8y-li-action\n            (click)=\"reactivateArchive()\"\n            *ngIf=\"hasAdminPermissions && canReactivate && isActive(archive)\"\n            icon=\"undo\"\n          >\n            {{ 'Reactivate archive' | translate }}\n          </c8y-li-action>\n        </c8y-li>\n      </c8y-li-timeline>\n    </c8y-list-group>\n  </div>\n</div>\n<div class=\"card-footer\" *ngIf=\"!isLoading && hasAdminPermissions\">\n  <c8y-form-group class=\"m-auto\">\n    <c8y-upload-archive [(application)]=\"application\" (refresh)=\"onRefresh()\"></c8y-upload-archive>\n  </c8y-form-group>\n</div>\n", dependencies: [{ kind: "component", type: ListGroupComponent, selector: "c8y-list-group" }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ListItemTimelineComponent, selector: "c8y-list-item-timeline, c8y-li-timeline" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: ListItemBodyComponent, selector: "c8y-list-item-body, c8y-li-body", inputs: ["body"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: ListItemActionComponent, selector: "c8y-list-item-action, c8y-li-action", inputs: ["label", "icon", "disabled"], outputs: ["click"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "component", type: UploadArchiveComponent, selector: "c8y-upload-archive", inputs: ["application", "uploadNewVersion", "preUploadCallback"], outputs: ["applicationChange", "refresh"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: DatePipe, name: "c8yDate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ActivityLogComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-activity-log', standalone: false, template: "<div class=\"inner-scroll bg-level-1 flex-grow inner-scroll--md overflow-visible-sm overflow-visible-xs\">\n  <div class=\"card-block overflow-visible\">\n    <c8y-list-group>\n      <c8y-li-timeline *ngFor=\"let archive of archives\" [ngClass]=\"{ active: isActive(archive) }\">\n        {{ archive.created | date: 'd MMM YYYY' }}\n        {{ archive.created | date: 'shortTime' }}\n        <c8y-li>\n          <c8y-li-icon\n            [icon]=\"checkIfLast(archive) ? 'flag-checkered' : 'file-zip-o'\"\n          ></c8y-li-icon>\n          <c8y-li-body>\n            <div class=\"d-flex a-i-start\">\n              <div style=\"min-width: 0; flex: 1\">\n                <span class=\"text-truncate-wrap\" title=\" {{ archive.description || archive.name }}\">\n                  {{ archive.description || archive.name }}\n                </span>\n                <small *ngIf=\"archive.description\" class=\"text-muted\">{{\n                  archive.description\n                }}</small>\n              </div>\n              <i\n                *ngIf=\"isLoading && toActivate(archive)\"\n                [c8yIcon]=\"'circle-o-notch'\"\n                class=\"icon-spin\"\n                title=\"{{ 'Activating' | translate }}\"\n              ></i>\n\n              <span *ngIf=\"isActive(archive)\" class=\"label label-primary m-l-auto m-t-4\">{{\n                'Active' | translate\n              }}</span>\n            </div>\n          </c8y-li-body>\n          <c8y-li-action\n            (click)=\"setActive(archive)\"\n            *ngIf=\"hasAdminPermissions && !isLoading && !isActive(archive)\"\n            icon=\"check-square-o\"\n          >\n            {{ 'Set as active`archive`' | translate }}\n          </c8y-li-action>\n          <c8y-li-action (click)=\"downloadArchive(archive)\" icon=\"download\">\n            {{ 'Download`archive`' | translate }}\n          </c8y-li-action>\n          <c8y-li-action\n            (click)=\"deleteArchive(archive)\"\n            *ngIf=\"\n              hasAdminPermissions &&\n              archives.length > 1 &&\n              !checkIfLast(archive) &&\n              !isActive(archive)\n            \"\n            icon=\"delete\"\n          >\n            {{ 'Delete`archive`' | translate }}\n          </c8y-li-action>\n          <c8y-li-action\n            (click)=\"reactivateArchive()\"\n            *ngIf=\"hasAdminPermissions && canReactivate && isActive(archive)\"\n            icon=\"undo\"\n          >\n            {{ 'Reactivate archive' | translate }}\n          </c8y-li-action>\n        </c8y-li>\n      </c8y-li-timeline>\n    </c8y-list-group>\n  </div>\n</div>\n<div class=\"card-footer\" *ngIf=\"!isLoading && hasAdminPermissions\">\n  <c8y-form-group class=\"m-auto\">\n    <c8y-upload-archive [(application)]=\"application\" (refresh)=\"onRefresh()\"></c8y-upload-archive>\n  </c8y-form-group>\n</div>\n" }]
+            args: [{ selector: 'c8y-activity-log', imports: [
+                        ListGroupComponent,
+                        NgFor,
+                        ListItemTimelineComponent,
+                        NgClass,
+                        ListItemComponent,
+                        ListItemIconComponent,
+                        ListItemBodyComponent,
+                        NgIf,
+                        IconDirective,
+                        ListItemActionComponent,
+                        FormGroupComponent,
+                        UploadArchiveComponent,
+                        C8yTranslatePipe,
+                        DatePipe
+                    ], template: "<div class=\"inner-scroll bg-level-1 flex-grow inner-scroll--md overflow-visible-sm overflow-visible-xs\">\n  <div class=\"card-block overflow-visible\">\n    <c8y-list-group>\n      <c8y-li-timeline *ngFor=\"let archive of archives\" [ngClass]=\"{ active: isActive(archive) }\">\n        {{ archive.created | c8yDate: 'd MMM YYYY' }}\n        {{ archive.created | c8yDate: 'shortTime' }}\n        <c8y-li>\n          <c8y-li-icon\n            [icon]=\"checkIfLast(archive) ? 'flag-checkered' : 'file-zip-o'\"\n          ></c8y-li-icon>\n          <c8y-li-body>\n            <div class=\"d-flex a-i-start\">\n              <div style=\"min-width: 0; flex: 1\">\n                <span class=\"text-truncate-wrap\" title=\" {{ archive.description || archive.name }}\">\n                  {{ archive.description || archive.name }}\n                </span>\n                <small *ngIf=\"archive.description\" class=\"text-muted\">{{\n                  archive.description\n                }}</small>\n              </div>\n              <i\n                *ngIf=\"isLoading && toActivate(archive)\"\n                [c8yIcon]=\"'circle-o-notch'\"\n                class=\"icon-spin\"\n                title=\"{{ 'Activating' | translate }}\"\n              ></i>\n\n              <span *ngIf=\"isActive(archive)\" class=\"label label-primary m-l-auto m-t-4\">{{\n                'Active' | translate\n              }}</span>\n            </div>\n          </c8y-li-body>\n          <c8y-li-action\n            (click)=\"setActive(archive)\"\n            *ngIf=\"hasAdminPermissions && !isLoading && !isActive(archive)\"\n            icon=\"check-square-o\"\n          >\n            {{ 'Set as active`archive`' | translate }}\n          </c8y-li-action>\n          <c8y-li-action (click)=\"downloadArchive(archive)\" icon=\"download\">\n            {{ 'Download`archive`' | translate }}\n          </c8y-li-action>\n          <c8y-li-action\n            (click)=\"deleteArchive(archive)\"\n            *ngIf=\"\n              hasAdminPermissions &&\n              archives.length > 1 &&\n              !checkIfLast(archive) &&\n              !isActive(archive)\n            \"\n            icon=\"delete\"\n          >\n            {{ 'Delete`archive`' | translate }}\n          </c8y-li-action>\n          <c8y-li-action\n            (click)=\"reactivateArchive()\"\n            *ngIf=\"hasAdminPermissions && canReactivate && isActive(archive)\"\n            icon=\"undo\"\n          >\n            {{ 'Reactivate archive' | translate }}\n          </c8y-li-action>\n        </c8y-li>\n      </c8y-li-timeline>\n    </c8y-list-group>\n  </div>\n</div>\n<div class=\"card-footer\" *ngIf=\"!isLoading && hasAdminPermissions\">\n  <c8y-form-group class=\"m-auto\">\n    <c8y-upload-archive [(application)]=\"application\" (refresh)=\"onRefresh()\"></c8y-upload-archive>\n  </c8y-form-group>\n</div>\n" }]
         }], ctorParameters: () => [{ type: i1.EcosystemService }, { type: i2.AlertService }], propDecorators: { application: [{
                 type: Input
             }], hasAdminPermissions: [{
@@ -196,396 +206,13 @@ class SubscriptionModalComponent {
         this.modal.acknowledge(title, body, Status.WARNING, gettext('Close'));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SubscriptionModalComponent, deps: [{ token: i1$1.BsModalRef }, { token: i1.EcosystemService }, { token: i2.TabsService }, { token: i2.ModalService }, { token: i4.ApplicationService }, { token: i2.AlertService }, { token: i2.ContextRouteService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: SubscriptionModalComponent, isStandalone: false, selector: "c8y-subscription-modal", ngImport: i0, template: "<div class=\"viewport-modal\">\n  <div class=\"modal-header dialog-header\">\n    <i c8yIcon=\"c8y-atom\"></i>\n    <h4 id=\"modal-title\">{{ message | translate }}</h4>\n  </div>\n  <div class=\"modal-body\" id=\"modal-body\" *ngIf=\"isLoading\">\n    <div class=\"p-16 text-center\">\n      <c8y-loading></c8y-loading>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: SubscriptionModalComponent, isStandalone: true, selector: "c8y-subscription-modal", ngImport: i0, template: "<div class=\"viewport-modal\">\n  <div class=\"modal-header dialog-header\">\n    <i c8yIcon=\"c8y-atom\"></i>\n    <h4 id=\"modal-title\">{{ message | translate }}</h4>\n  </div>\n  <div class=\"modal-body\" id=\"modal-body\" *ngIf=\"isLoading\">\n    <div class=\"p-16 text-center\">\n      <c8y-loading></c8y-loading>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SubscriptionModalComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-subscription-modal', standalone: false, template: "<div class=\"viewport-modal\">\n  <div class=\"modal-header dialog-header\">\n    <i c8yIcon=\"c8y-atom\"></i>\n    <h4 id=\"modal-title\">{{ message | translate }}</h4>\n  </div>\n  <div class=\"modal-body\" id=\"modal-body\" *ngIf=\"isLoading\">\n    <div class=\"p-16 text-center\">\n      <c8y-loading></c8y-loading>\n    </div>\n  </div>\n</div>\n" }]
+            args: [{ selector: 'c8y-subscription-modal', imports: [IconDirective, NgIf, LoadingComponent, C8yTranslatePipe], template: "<div class=\"viewport-modal\">\n  <div class=\"modal-header dialog-header\">\n    <i c8yIcon=\"c8y-atom\"></i>\n    <h4 id=\"modal-title\">{{ message | translate }}</h4>\n  </div>\n  <div class=\"modal-body\" id=\"modal-body\" *ngIf=\"isLoading\">\n    <div class=\"p-16 text-center\">\n      <c8y-loading></c8y-loading>\n    </div>\n  </div>\n</div>\n" }]
         }], ctorParameters: () => [{ type: i1$1.BsModalRef }, { type: i1.EcosystemService }, { type: i2.TabsService }, { type: i2.ModalService }, { type: i4.ApplicationService }, { type: i2.AlertService }, { type: i2.ContextRouteService }] });
 
-class AppStatePipe {
-    constructor(ecosystemService) {
-        this.ecosystemService = ecosystemService;
-    }
-    transform(app, arg) {
-        const appState = this.ecosystemService.getAppState(app);
-        return appState[arg];
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AppStatePipe, deps: [{ token: i1.EcosystemService }], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: AppStatePipe, isStandalone: false, name: "appState" }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AppStatePipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'appState',
-                    pure: true,
-                    standalone: false
-                }]
-        }], ctorParameters: () => [{ type: i1.EcosystemService }] });
-
-class AppsToUpdateRemotesSelectComponent {
-    constructor(bsModalRef, wizardModalService, ecosystemService) {
-        this.bsModalRef = bsModalRef;
-        this.wizardModalService = wizardModalService;
-        this.ecosystemService = ecosystemService;
-        this.destroy$ = new Subject();
-        this.filterTerm$ = new BehaviorSubject('');
-        this.filteredApps$ = new BehaviorSubject([]);
-        this.appsToUpdateRemotes = [];
-        this.result = new Promise((resolve, reject) => {
-            this._update = resolve;
-            this._cancel = reject;
-        });
-    }
-    ngOnInit() {
-        this.filteredApps$ = combineLatest([of(this.apps), this.filterTerm$]).pipe(map(([apps, filterTerm]) => filterTerm.trim().length === 0
-            ? apps
-            : apps.filter((application) => this.ecosystemService.filterContainString(application.name, filterTerm))));
-        this.textConfig =
-            this.updateType === 'install'
-                ? {
-                    header: gettext('Select applications to install the plugin to'),
-                    applyButton: gettext('Install')
-                }
-                : {
-                    header: gettext('Select applications to uninstall the plugin from'),
-                    applyButton: gettext('Uninstall')
-                };
-    }
-    cancel() {
-        this.bsModalRef.hide();
-        this._cancel();
-    }
-    setSelectedApps(selected, app) {
-        selected
-            ? this.appsToUpdateRemotes.push(app)
-            : (this.appsToUpdateRemotes = this.appsToUpdateRemotes.filter(application => app.key !== application.key));
-    }
-    ngOnDestroy() {
-        this.destroy$.next();
-        this.destroy$.complete();
-    }
-    async duplicateApp() {
-        const wizardConfig = {
-            headerText: gettext('Duplicate application'),
-            headerIcon: 'c8y-copy'
-        };
-        const initialState = {
-            wizardConfig,
-            componentInitialState: {
-                noBackButton: true
-            },
-            id: 'duplicateApplication'
-        };
-        const modalOptions = { initialState };
-        const modalRef = this.wizardModalService.show(modalOptions);
-        modalRef.content.onClose.pipe(takeUntil(this.destroy$)).subscribe(async () => {
-            this.apps = await this.getOwnedHostedApps();
-            this.ngOnInit();
-        });
-    }
-    async apply() {
-        this._update(this.appsToUpdateRemotes);
-        this.bsModalRef.hide();
-    }
-    async getOwnedHostedApps() {
-        return (await this.ecosystemService.getWebApplications()).filter(app => this.ecosystemService.isOwner(app) && app.type !== ApplicationType.EXTERNAL);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AppsToUpdateRemotesSelectComponent, deps: [{ token: i1$1.BsModalRef }, { token: i2.WizardModalService }, { token: i1.EcosystemService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: AppsToUpdateRemotesSelectComponent, isStandalone: false, selector: "c8y-apps-to-update-remotes-select", inputs: { apps: "apps", updateType: "updateType", pluginName: "pluginName", appsDisabled: "appsDisabled" }, ngImport: i0, template: "<div class=\"viewport-modal\">\n  <div class=\"modal-header dialog-header\">\n    <i [c8yIcon]=\"'c8y-modules'\"></i>\n    <div class=\"modal-title h4\" id=\"modal-title\" translate>Custom applications</div>\n  </div>\n  <div class=\"inner-scroll\" id=\"modal-body\">\n    <div class=\"p-16 text-center separator-bottom sticky-top bg-component\">\n      <p class=\"text-medium\">\n        {{ textConfig.header | translate }}\n      </p>\n      <c8y-filter (onSearch)=\"filterTerm$.next($event)\"></c8y-filter>\n    </div>\n    <c8y-list-group *ngIf=\"apps.length; else emptyList\">\n      <c8y-li\n        [ngClass]=\"{ disabled: updateType === 'install' && appsDisabled.has(app.id) }\"\n        *ngFor=\"let app of filteredApps$ | async\"\n        data-cy=\"apps-to-update-remotes-select--applications-list\"\n      >\n        <c8y-li-checkbox (onSelect)=\"setSelectedApps($event, app)\" data-cy=\"apps-to-update-remotes-select--app-checkbox\"></c8y-li-checkbox>\n        <c8y-li-icon class=\"p-l-0 icon-32\">\n          <c8y-app-icon\n            class=\"list-group-icon\"\n            [app]=\"app\"\n            [contextPath]=\"app.contextPath\"\n            [name]=\"app.name\"\n          ></c8y-app-icon>\n        </c8y-li-icon>\n        <div class=\"d-flex\">\n          <div class=\"p-r-8\">\n            <p class=\"text-medium\" [innerText]=\"app | humanizeAppName | async\"></p>\n            <p class=\"small text-muted\">{{ app.description }}</p>\n          </div>\n          <span class=\"label m-l-auto a-s-start\" [ngClass]=\"app | appState: 'class'\">\n            {{ app | appState: 'label' | translate }}\n          </span>\n        </div>\n      </c8y-li>\n    </c8y-list-group>\n  </div>\n  <div class=\"modal-footer\">\n    <button\n      class=\"btn btn-default\"\n      title=\"{{ 'Cancel' | translate }}\"\n      type=\"button\"\n      (click)=\"cancel()\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ textConfig.applyButton | translate }}\"\n      [disabled]=\"appsToUpdateRemotes.length === 0\"\n      (click)=\"apply()\"\n    >\n      {{ textConfig.applyButton | translate }}\n    </button>\n  </div>\n</div>\n<ng-template #emptyList>\n  <c8y-ui-empty-state\n    [icon]=\"'c8y-modules'\"\n    [title]=\"'No custom applications available.' | translate\"\n    *ngIf=\"updateType !== 'install'\"\n    [horizontal]=\"true\"\n  ></c8y-ui-empty-state>\n  <ng-container *ngIf=\"updateType === 'install'\">\n    <c8y-ui-empty-state\n      [icon]=\"'c8y-modules'\"\n      [title]=\"'No custom applications available.' | translate\"\n      [subtitle]=\"'Create a custom application by duplicating an existing one.' | translate\"\n      [horizontal]=\"true\"\n    >\n      <button\n        class=\"btn btn-sm btn-default m-t-8\"\n        title=\"{{ 'Duplicate' | translate }}\"\n        (click)=\"duplicateApp()\"\n      >\n        {{ 'Duplicate' | translate }}\n      </button>\n    </c8y-ui-empty-state>\n  </ng-container>\n</ng-template>\n", dependencies: [{ kind: "component", type: i2.AppIconComponent, selector: "c8y-app-icon", inputs: ["contextPath", "name", "app"] }, { kind: "component", type: i2.EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.FilterInputComponent, selector: "c8y-filter", inputs: ["icon", "filterTerm"], outputs: ["onSearch"] }, { kind: "component", type: i2.ListGroupComponent, selector: "c8y-list-group" }, { kind: "component", type: i2.ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: i2.ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: i2.ListItemCheckboxComponent, selector: "c8y-list-item-checkbox, c8y-li-checkbox", inputs: ["selected", "indeterminate", "disabled", "displayAsSwitch"], outputs: ["onSelect"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.HumanizeAppNamePipe, name: "humanizeAppName" }, { kind: "pipe", type: AppStatePipe, name: "appState" }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AppsToUpdateRemotesSelectComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'c8y-apps-to-update-remotes-select', standalone: false, template: "<div class=\"viewport-modal\">\n  <div class=\"modal-header dialog-header\">\n    <i [c8yIcon]=\"'c8y-modules'\"></i>\n    <div class=\"modal-title h4\" id=\"modal-title\" translate>Custom applications</div>\n  </div>\n  <div class=\"inner-scroll\" id=\"modal-body\">\n    <div class=\"p-16 text-center separator-bottom sticky-top bg-component\">\n      <p class=\"text-medium\">\n        {{ textConfig.header | translate }}\n      </p>\n      <c8y-filter (onSearch)=\"filterTerm$.next($event)\"></c8y-filter>\n    </div>\n    <c8y-list-group *ngIf=\"apps.length; else emptyList\">\n      <c8y-li\n        [ngClass]=\"{ disabled: updateType === 'install' && appsDisabled.has(app.id) }\"\n        *ngFor=\"let app of filteredApps$ | async\"\n        data-cy=\"apps-to-update-remotes-select--applications-list\"\n      >\n        <c8y-li-checkbox (onSelect)=\"setSelectedApps($event, app)\" data-cy=\"apps-to-update-remotes-select--app-checkbox\"></c8y-li-checkbox>\n        <c8y-li-icon class=\"p-l-0 icon-32\">\n          <c8y-app-icon\n            class=\"list-group-icon\"\n            [app]=\"app\"\n            [contextPath]=\"app.contextPath\"\n            [name]=\"app.name\"\n          ></c8y-app-icon>\n        </c8y-li-icon>\n        <div class=\"d-flex\">\n          <div class=\"p-r-8\">\n            <p class=\"text-medium\" [innerText]=\"app | humanizeAppName | async\"></p>\n            <p class=\"small text-muted\">{{ app.description }}</p>\n          </div>\n          <span class=\"label m-l-auto a-s-start\" [ngClass]=\"app | appState: 'class'\">\n            {{ app | appState: 'label' | translate }}\n          </span>\n        </div>\n      </c8y-li>\n    </c8y-list-group>\n  </div>\n  <div class=\"modal-footer\">\n    <button\n      class=\"btn btn-default\"\n      title=\"{{ 'Cancel' | translate }}\"\n      type=\"button\"\n      (click)=\"cancel()\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ textConfig.applyButton | translate }}\"\n      [disabled]=\"appsToUpdateRemotes.length === 0\"\n      (click)=\"apply()\"\n    >\n      {{ textConfig.applyButton | translate }}\n    </button>\n  </div>\n</div>\n<ng-template #emptyList>\n  <c8y-ui-empty-state\n    [icon]=\"'c8y-modules'\"\n    [title]=\"'No custom applications available.' | translate\"\n    *ngIf=\"updateType !== 'install'\"\n    [horizontal]=\"true\"\n  ></c8y-ui-empty-state>\n  <ng-container *ngIf=\"updateType === 'install'\">\n    <c8y-ui-empty-state\n      [icon]=\"'c8y-modules'\"\n      [title]=\"'No custom applications available.' | translate\"\n      [subtitle]=\"'Create a custom application by duplicating an existing one.' | translate\"\n      [horizontal]=\"true\"\n    >\n      <button\n        class=\"btn btn-sm btn-default m-t-8\"\n        title=\"{{ 'Duplicate' | translate }}\"\n        (click)=\"duplicateApp()\"\n      >\n        {{ 'Duplicate' | translate }}\n      </button>\n    </c8y-ui-empty-state>\n  </ng-container>\n</ng-template>\n" }]
-        }], ctorParameters: () => [{ type: i1$1.BsModalRef }, { type: i2.WizardModalService }, { type: i1.EcosystemService }], propDecorators: { apps: [{
-                type: Input
-            }], updateType: [{
-                type: Input
-            }], pluginName: [{
-                type: Input
-            }], appsDisabled: [{
-                type: Input
-            }] } });
-
-class PluginListService {
-    constructor() {
-        this.CURRENT_LOCATION = location.href;
-        this.updatingPluginId = { install: '', uninstall: '' };
-        this.appsDisabled = new Set();
-        this.gainsightService = inject(GainsightService);
-        this.pluginsService = inject(PluginsService);
-        this.alertService = inject(AlertService);
-        this.ecosystemService = inject(EcosystemService);
-        this.humanizeAppNamePipe = inject(HumanizeAppNamePipe);
-        this.translateService = inject(TranslateService);
-        this.bsModalService = inject(BsModalService);
-    }
-    async updateAppRemotes(plugin, updateType, pluginPackage) {
-        this.updatingPluginId[updateType] = plugin?.id;
-        let initialState;
-        try {
-            const apps = await this.getAppsForUpdate(plugin, updateType);
-            initialState = {
-                apps,
-                updateType,
-                pluginName: plugin.name,
-                appsDisabled: this.appsDisabled
-            };
-        }
-        catch (e) {
-            this.alertService.addServerFailure(e);
-            this.updatingPluginId[updateType] = '';
-            return;
-        }
-        let selectedApps;
-        try {
-            selectedApps = await this.selectApps(initialState);
-            if (!selectedApps) {
-                this.updatingPluginId[updateType] = '';
-                return;
-            }
-        }
-        catch {
-            // unreached
-        }
-        if (updateType === 'install') {
-            const isArchived = await this.ecosystemService.verifyArchived([plugin]);
-            if (!isArchived) {
-                this.updatingPluginId[updateType] = '';
-                return;
-            }
-            const licensesVerifiedByUser = await this.ecosystemService.verifyLicenses([plugin]);
-            if (!licensesVerifiedByUser) {
-                this.updatingPluginId[updateType] = '';
-                return;
-            }
-        }
-        for (const app of selectedApps) {
-            try {
-                if (updateType === 'install') {
-                    const versionIsCompatible = await this.ecosystemService.verifyPluginVersionsCompatibility([plugin], app);
-                    if (!versionIsCompatible) {
-                        continue;
-                    }
-                }
-                await this.handleRemotesUpdate(app, plugin, updateType, pluginPackage);
-                const humanizedAppName = await firstValueFrom(this.humanizeAppNamePipe.transform(app));
-                const successText = updateType === 'install'
-                    ? this.translateService.instant(gettext('Plugin installed to application "{{ appName }}".'), {
-                        appName: humanizedAppName
-                    })
-                    : this.translateService.instant(gettext('Plugin uninstalled from application "{{ appName }}".'), { appName: humanizedAppName });
-                this.alertService.success(successText);
-                this.onUpdateEventHandleGS(plugin, app, updateType);
-            }
-            catch (error) {
-                this.onUpdateEventHandleGS(plugin, app, updateType, error);
-            }
-        }
-        this.updatingPluginId[updateType] = '';
-    }
-    async getAppsForUpdate(plugin, updateType) {
-        let apps = (await this.ecosystemService.getWebApplications()).filter(app => this.ecosystemService.isOwner(app) && app.type !== ApplicationType.EXTERNAL);
-        if (updateType === 'install') {
-            this.appsDisabled.clear();
-            for (const app of apps) {
-                if (this.isPluginInstalledInApp(plugin, app)) {
-                    this.appsDisabled.add(app.id);
-                }
-            }
-        }
-        if (updateType === 'uninstall') {
-            const installedApps = [];
-            for (const app of apps) {
-                if (this.isPluginInstalledInApp(plugin, app)) {
-                    installedApps.push(app);
-                }
-            }
-            apps = installedApps;
-        }
-        return apps;
-    }
-    onUpdateEventHandleGS(plugin, app, updateType, error) {
-        const pluginCustomEventInfo = pick(plugin, [
-            'name',
-            'contextPath',
-            'module',
-            'version',
-            'type',
-            'id'
-        ]);
-        const gsEventResult = updateType === 'install'
-            ? PRODUCT_EXPERIENCE_ECOSYSTEM.APPLICATIONS.RESULTS.PLUGIN_INSTALLED
-            : PRODUCT_EXPERIENCE_ECOSYSTEM.APPLICATIONS.RESULTS.PLUGIN_REMOVED;
-        const eventData = {
-            component: PRODUCT_EXPERIENCE_ECOSYSTEM.APPLICATIONS.COMPONENTS.PLUGIN_LIST,
-            result: error || gsEventResult,
-            url: this.CURRENT_LOCATION,
-            ...pluginCustomEventInfo,
-            targetApplicationName: app.name,
-            targetApplicationContextPath: app.contextPath,
-            ...(error && { error })
-        };
-        this.gainsightService.triggerEvent(PRODUCT_EXPERIENCE_ECOSYSTEM.APPLICATIONS.EVENTS.PACKAGE_PLUGINS, eventData);
-    }
-    isPluginInstalledInApp(plugin, app) {
-        const appRemotes = this.pluginsService.getMFRemotes(app) || {};
-        for (const [remoteName, modules] of Object.entries(appRemotes)) {
-            const pluginFromThisPackageIsInstalled = this.getPluginContextPathWithoutVersion(remoteName) === plugin.contextPath;
-            const specificPluginModuleIsInstalled = modules.some(module => module === plugin.module);
-            if (pluginFromThisPackageIsInstalled && specificPluginModuleIsInstalled) {
-                return true;
-            }
-        }
-        return false;
-    }
-    getPluginContextPathWithoutVersion(remote) {
-        return remote.split('@')[0];
-    }
-    async handleRemotesUpdate(application, plugin, updateType, pluginPackage) {
-        try {
-            // When remotes object is not set in the configuration object of an application.
-            // Fallback to setInitialRemotes is triggered.
-            const { remotes, excludedRemotes } = await (updateType === 'install'
-                ? this.pluginsService.addRemotes(application, plugin)
-                : this.pluginsService.removeRemotes(application, this.getAllPluginsToRemove(plugin, pluginPackage)));
-            if (!application.config) {
-                application.config = {};
-            }
-            application.config.remotes = remotes;
-            application.config.excludedRemotes = excludedRemotes;
-            const actualRemotes = this.pluginsService.getMFRemotes(application);
-            return actualRemotes;
-        }
-        catch (er) {
-            if (er) {
-                this.alertService.addServerFailure(er);
-            }
-            throw er;
-        }
-    }
-    getAllPluginsToRemove(plugin, pluginPackage) {
-        return pluginPackage.applicationVersions.map(av => ({
-            id: `${plugin.contextPath}@${av.version}/${plugin.module}`,
-            idLatest: `${plugin.contextPath}/${plugin.module}`,
-            module: plugin.module,
-            path: plugin.path
-        }));
-    }
-    async selectApps(initialState) {
-        try {
-            return await this.bsModalService.show(AppsToUpdateRemotesSelectComponent, {
-                class: 'modal-sm',
-                ariaDescribedby: 'modal-body',
-                ariaLabelledBy: 'modal-title',
-                initialState,
-                ignoreBackdropClick: true,
-                keyboard: false
-            }).content.result;
-        }
-        catch (er) {
-            return;
-        }
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PluginListService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PluginListService, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PluginListService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }] });
-
-class PluginListItemComponent {
-    constructor(pluginService) {
-        this.pluginService = pluginService;
-        this.hideSource = false;
-        this.isItemSelected = new EventEmitter();
-        this.packageType = PackageType.UNKNOWN;
-        this.PACKAGE_TYPE = PackageType;
-    }
-    ngOnInit() {
-        this.packageType = this.pluginService.getPackageType(this.plugin.originApp);
-    }
-    onChange(event) {
-        this.plugin.selected = !this.plugin.selected;
-        this.isItemSelected.next(event);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PluginListItemComponent, deps: [{ token: i2.PluginsService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PluginListItemComponent, isStandalone: false, selector: "c8y-plugin-list-item", inputs: { plugin: "plugin", selectable: "selectable", hideSource: "hideSource" }, outputs: { isItemSelected: "isItemSelected" }, ngImport: i0, template: "<c8y-li-checkbox\n  class=\"p-r-16 p-l-0\"\n  (change)=\"onChange($event.target.checked)\"\n  *ngIf=\"selectable\"\n  [disabled]=\"plugin.installed\"\n  [selected]=\"plugin.selected\"\n></c8y-li-checkbox>\n<c8y-li-icon class=\"p-l-0 text-center\">\n  <i class=\"c8y-plugin-icon\">\n    <span>{{ plugin.name?.substr(0, 2) }}</span>\n  </i>\n</c8y-li-icon>\n<div class=\"p-relative flex-grow\">\n  <div [ngClass]=\"{ 'p-r-8': selectable }\">\n    <p>\n      <span class=\"text-medium\">{{ plugin.name }}</span>\n      <em class=\"text-muted small m-l-8\">{{ plugin.version }}</em>\n      <span *ngIf=\"plugin.installed\">\n        <i\n          class=\"text-success\"\n          [c8yIcon]=\"'check-circle'\"\n        ></i>\n        <em\n          class=\"text-muted small\"\n          translate\n        >\n          Installed`plugins`\n        </em>\n      </span>\n    </p>\n    <p class=\"small l-h-tight\">{{ plugin.description }}</p>\n  </div>\n\n  <span\n    class=\"tag tag--info a-s-start m-t-8\"\n    *ngIf=\"selectable && !hideSource\"\n  >\n    {{ plugin.contextPath }}\n  </span>\n\n  <span\n    class=\"tag a-s-start m-t-8 m-l-4\"\n    [ngClass]=\"{\n      'tag--default': packageType === PACKAGE_TYPE.COMMUNITY,\n      'tag--primary': packageType === PACKAGE_TYPE.OFFICIAL\n    }\"\n  >\n    {{ plugin.originApp?.label || plugin.originApp?.manifest?.label | translatePackageLabel }}\n  </span>\n</div>\n", dependencies: [{ kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: i2.ListItemCheckboxComponent, selector: "c8y-list-item-checkbox, c8y-li-checkbox", inputs: ["selected", "indeterminate", "disabled", "displayAsSwitch"], outputs: ["onSelect"] }, { kind: "pipe", type: i1.TranslatePackageLabelPipe, name: "translatePackageLabel" }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PluginListItemComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'c8y-plugin-list-item', standalone: false, template: "<c8y-li-checkbox\n  class=\"p-r-16 p-l-0\"\n  (change)=\"onChange($event.target.checked)\"\n  *ngIf=\"selectable\"\n  [disabled]=\"plugin.installed\"\n  [selected]=\"plugin.selected\"\n></c8y-li-checkbox>\n<c8y-li-icon class=\"p-l-0 text-center\">\n  <i class=\"c8y-plugin-icon\">\n    <span>{{ plugin.name?.substr(0, 2) }}</span>\n  </i>\n</c8y-li-icon>\n<div class=\"p-relative flex-grow\">\n  <div [ngClass]=\"{ 'p-r-8': selectable }\">\n    <p>\n      <span class=\"text-medium\">{{ plugin.name }}</span>\n      <em class=\"text-muted small m-l-8\">{{ plugin.version }}</em>\n      <span *ngIf=\"plugin.installed\">\n        <i\n          class=\"text-success\"\n          [c8yIcon]=\"'check-circle'\"\n        ></i>\n        <em\n          class=\"text-muted small\"\n          translate\n        >\n          Installed`plugins`\n        </em>\n      </span>\n    </p>\n    <p class=\"small l-h-tight\">{{ plugin.description }}</p>\n  </div>\n\n  <span\n    class=\"tag tag--info a-s-start m-t-8\"\n    *ngIf=\"selectable && !hideSource\"\n  >\n    {{ plugin.contextPath }}\n  </span>\n\n  <span\n    class=\"tag a-s-start m-t-8 m-l-4\"\n    [ngClass]=\"{\n      'tag--default': packageType === PACKAGE_TYPE.COMMUNITY,\n      'tag--primary': packageType === PACKAGE_TYPE.OFFICIAL\n    }\"\n  >\n    {{ plugin.originApp?.label || plugin.originApp?.manifest?.label | translatePackageLabel }}\n  </span>\n</div>\n" }]
-        }], ctorParameters: () => [{ type: i2.PluginsService }], propDecorators: { plugin: [{
-                type: Input
-            }], selectable: [{
-                type: Input
-            }], hideSource: [{
-                type: Input
-            }], isItemSelected: [{
-                type: Output
-            }] } });
-
-class PluginListComponent {
-    constructor(pluginListService) {
-        this.pluginListService = pluginListService;
-        this.CURRENT_LOCATION = location.href;
-        this.emptyListText = '';
-        this.hideSource = false;
-        /**
-         * Shows the install button for each plugin separately. Currently used in package-details view.
-         */
-        this.installable = false;
-        this.selectedItems = new EventEmitter();
-        this.showOverview = new EventEmitter();
-        this.selectedPlugins = {};
-        this.updatingPluginId = this.pluginListService.updatingPluginId;
-    }
-    updateSelectedItems(selected, plugin) {
-        this.selectedPlugins[plugin.id] = selected ? plugin : undefined;
-        const onlyInstalledPlugins = Object.values(this.selectedPlugins).filter(Boolean);
-        this.selectedItems.emit(onlyInstalledPlugins);
-    }
-    showPluginOverview(plugin) {
-        if (plugin?.id === this.selectedPlugin?.id) {
-            return;
-        }
-        this.showOverview.emit(plugin);
-    }
-    async installPlugin(plugin) {
-        await this.pluginListService.updateAppRemotes(plugin, 'install', this.package);
-    }
-    async uninstallPlugin(plugin) {
-        await this.pluginListService.updateAppRemotes(plugin, 'uninstall', this.package);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PluginListComponent, deps: [{ token: PluginListService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PluginListComponent, isStandalone: false, selector: "c8y-plugin-list", inputs: { plugins$: "plugins$", emptyListText: "emptyListText", selectable: "selectable", hideSource: "hideSource", installable: "installable", package: "package", selectedPlugin: "selectedPlugin" }, outputs: { selectedItems: "selectedItems", showOverview: "showOverview" }, ngImport: i0, template: "<c8y-list-group class=\"bg-inherit\">\n  <ng-container *ngIf=\"(plugins$ | async)?.length !== 0; else emptyList\">\n    <ng-container *ngFor=\"let plugin of plugins$ | async\">\n      <c8y-li\n        [ngClass]=\"{\n          disabled: plugin.installed,\n          selected: selectedPlugin?.id === plugin?.id\n        }\"\n      >\n        <div class=\"d-flex fit-w\">\n          <ng-container *ngIf=\"plugin.readmePath\">\n            <button\n              class=\"c8y-list__item__btn d-flex fit-w gap-4\"\n              title=\"{{ 'Details' | translate }}\"\n              (click)=\"showPluginOverview(plugin)\"\n            >\n              <c8y-plugin-list-item\n                class=\"d-contents\"\n                (isItemSelected)=\"updateSelectedItems($event, plugin)\"\n                [plugin]=\"plugin\"\n                [selectable]=\"selectable\"\n                [hideSource]=\"hideSource\"\n              ></c8y-plugin-list-item>\n              <i\n                class=\"icon-24 m-l-auto a-s-center\"\n                c8yIcon=\"forward\"\n              ></i>\n            </button>\n          </ng-container>\n          <ng-container *ngIf=\"!plugin.readmePath\">\n            <c8y-plugin-list-item\n              class=\"d-contents\"\n              (isItemSelected)=\"updateSelectedItems($event, plugin)\"\n              [plugin]=\"plugin\"\n              [selectable]=\"selectable\"\n              [hideSource]=\"hideSource\"\n            ></c8y-plugin-list-item>\n          </ng-container>\n        </div>\n        <div class=\"p-l-40 m-t-4 d-flex flex-wrap gap-8\">\n          <button\n            class=\"btn btn-danger btn-sm\"\n            title=\"{{ 'Uninstall plugin' | translate }}\"\n            *ngIf=\"installable\"\n            (click)=\"uninstallPlugin(plugin)\"\n            [ngClass]=\"{ 'btn-pending': plugin.id === updatingPluginId.uninstall }\"\n            [disabled]=\"updatingPluginId.uninstall && plugin.id === updatingPluginId.uninstall\"\n            data-cy=\"plugin-list--uninstall-plugin-button\"\n            translate\n          >\n            Uninstall plugin\n          </button>\n          <button\n            class=\"btn btn-default btn-sm m-0\"\n            title=\"{{ 'Install plugin' | translate }}\"\n            *ngIf=\"installable\"\n            (click)=\"installPlugin(plugin)\"\n            [ngClass]=\"{ 'btn-pending': plugin.id === updatingPluginId.install }\"\n            [disabled]=\"updatingPluginId.install && plugin.id === updatingPluginId.install\"\n            data-cy=\"plugin-list--install-plugin-button\"\n            translate\n          >\n            Install plugin\n          </button>\n        </div>\n      </c8y-li>\n    </ng-container>\n  </ng-container>\n</c8y-list-group>\n<ng-template #emptyList>\n  <c8y-ui-empty-state\n    [icon]=\"'plugin'\"\n    [title]=\"emptyListText | translate\"\n    [horizontal]=\"true\"\n    *ngIf=\"emptyListText\"\n  ></c8y-ui-empty-state>\n</ng-template>\n", dependencies: [{ kind: "component", type: i2.EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.ListGroupComponent, selector: "c8y-list-group" }, { kind: "component", type: i2.ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: PluginListItemComponent, selector: "c8y-plugin-list-item", inputs: ["plugin", "selectable", "hideSource"], outputs: ["isItemSelected"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PluginListComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'c8y-plugin-list', standalone: false, template: "<c8y-list-group class=\"bg-inherit\">\n  <ng-container *ngIf=\"(plugins$ | async)?.length !== 0; else emptyList\">\n    <ng-container *ngFor=\"let plugin of plugins$ | async\">\n      <c8y-li\n        [ngClass]=\"{\n          disabled: plugin.installed,\n          selected: selectedPlugin?.id === plugin?.id\n        }\"\n      >\n        <div class=\"d-flex fit-w\">\n          <ng-container *ngIf=\"plugin.readmePath\">\n            <button\n              class=\"c8y-list__item__btn d-flex fit-w gap-4\"\n              title=\"{{ 'Details' | translate }}\"\n              (click)=\"showPluginOverview(plugin)\"\n            >\n              <c8y-plugin-list-item\n                class=\"d-contents\"\n                (isItemSelected)=\"updateSelectedItems($event, plugin)\"\n                [plugin]=\"plugin\"\n                [selectable]=\"selectable\"\n                [hideSource]=\"hideSource\"\n              ></c8y-plugin-list-item>\n              <i\n                class=\"icon-24 m-l-auto a-s-center\"\n                c8yIcon=\"forward\"\n              ></i>\n            </button>\n          </ng-container>\n          <ng-container *ngIf=\"!plugin.readmePath\">\n            <c8y-plugin-list-item\n              class=\"d-contents\"\n              (isItemSelected)=\"updateSelectedItems($event, plugin)\"\n              [plugin]=\"plugin\"\n              [selectable]=\"selectable\"\n              [hideSource]=\"hideSource\"\n            ></c8y-plugin-list-item>\n          </ng-container>\n        </div>\n        <div class=\"p-l-40 m-t-4 d-flex flex-wrap gap-8\">\n          <button\n            class=\"btn btn-danger btn-sm\"\n            title=\"{{ 'Uninstall plugin' | translate }}\"\n            *ngIf=\"installable\"\n            (click)=\"uninstallPlugin(plugin)\"\n            [ngClass]=\"{ 'btn-pending': plugin.id === updatingPluginId.uninstall }\"\n            [disabled]=\"updatingPluginId.uninstall && plugin.id === updatingPluginId.uninstall\"\n            data-cy=\"plugin-list--uninstall-plugin-button\"\n            translate\n          >\n            Uninstall plugin\n          </button>\n          <button\n            class=\"btn btn-default btn-sm m-0\"\n            title=\"{{ 'Install plugin' | translate }}\"\n            *ngIf=\"installable\"\n            (click)=\"installPlugin(plugin)\"\n            [ngClass]=\"{ 'btn-pending': plugin.id === updatingPluginId.install }\"\n            [disabled]=\"updatingPluginId.install && plugin.id === updatingPluginId.install\"\n            data-cy=\"plugin-list--install-plugin-button\"\n            translate\n          >\n            Install plugin\n          </button>\n        </div>\n      </c8y-li>\n    </ng-container>\n  </ng-container>\n</c8y-list-group>\n<ng-template #emptyList>\n  <c8y-ui-empty-state\n    [icon]=\"'plugin'\"\n    [title]=\"emptyListText | translate\"\n    [horizontal]=\"true\"\n    *ngIf=\"emptyListText\"\n  ></c8y-ui-empty-state>\n</ng-template>\n" }]
-        }], ctorParameters: () => [{ type: PluginListService }], propDecorators: { plugins$: [{
-                type: Input
-            }], emptyListText: [{
-                type: Input
-            }], selectable: [{
-                type: Input
-            }], hideSource: [{
-                type: Input
-            }], installable: [{
-                type: Input
-            }], package: [{
-                type: Input
-            }], selectedPlugin: [{
-                type: Input
-            }], selectedItems: [{
-                type: Output
-            }], showOverview: [{
-                type: Output
-            }] } });
-
 class UpdateApplicationModalComponent {
     constructor(inventoryService, ecosystemService, pluginsService) {
         this.inventoryService = inventoryService;
@@ -707,11 +334,26 @@ class UpdateApplicationModalComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UpdateApplicationModalComponent, deps: [{ token: i4.InventoryService }, { token: i1.EcosystemService }, { token: i2.PluginsService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: UpdateApplicationModalComponent, isStandalone: false, selector: "c8y-update-application-modal", viewQueries: [{ propertyName: "modal", first: true, predicate: ["modal"], descendants: true }], ngImport: i0, template: "<c8y-modal\n  [title]=\"'Update application' | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n  #modal\n>\n  <ng-container c8y-modal-title>\n    <span class=\"dlt-c8y-icon-installing-updates\"></span>\n  </ng-container>\n\n  <ng-container\n    *ngIf=\"\n      (orphanedPlugins$ | async).length > 0 || (newPlugins$ | async).length > 0;\n      else updateProgress\n    \"\n  >\n    <p\n      class=\"text-center text-break-word p-24 text-14\"\n      translate\n    >\n      Updating this blueprint will change the default plugins. Review the plugin changes before\n      proceeding.\n    </p>\n    <c8y-list-group *ngIf=\"(orphanedPlugins$ | async).length > 0\">\n      <c8y-li [collapsed]=\"true\">\n        <c8y-li-icon>\n          <span class=\"badge badge-danger\">{{ (orphanedPlugins$ | async).length }}</span>\n        </c8y-li-icon>\n        <c8y-li-body>\n          <div translate>Orphaned plugins</div>\n        </c8y-li-body>\n        <c8y-li-footer translate>\n          Some plugins are not contained in the new version of this blueprint and will therefore get\n          removed.\n        </c8y-li-footer>\n        <c8y-li-collapse>\n          <c8y-plugin-list\n            class=\"m-t-16\"\n            [emptyListText]=\"'No plugins available' | translate\"\n            [plugins$]=\"orphanedPlugins$\"\n            [selectable]=\"false\"\n            [hideSource]=\"true\"\n          ></c8y-plugin-list>\n        </c8y-li-collapse>\n      </c8y-li>\n    </c8y-list-group>\n\n    <c8y-list-group *ngIf=\"(newPlugins$ | async).length > 0\">\n      <c8y-li [collapsed]=\"false\">\n        <c8y-li-icon>\n          <span class=\"badge badge-success\">{{ (newPlugins$ | async).length }}</span>\n        </c8y-li-icon>\n        <c8y-li-body>\n          <div translate>New plugins added</div>\n        </c8y-li-body>\n        <c8y-li-footer translate>\n          This blueprint will add new plugins. Please choose which you want to install.\n        </c8y-li-footer>\n        <c8y-li-collapse>\n          <c8y-plugin-list\n            class=\"m-t-16\"\n            [emptyListText]=\"'No plugins available' | translate\"\n            [plugins$]=\"newPlugins$\"\n            [selectable]=\"true\"\n            [hideSource]=\"false\"\n          ></c8y-plugin-list>\n        </c8y-li-collapse>\n      </c8y-li>\n    </c8y-list-group>\n  </ng-container>\n\n  <ng-container c8y-modal-footer-custom>\n    <div\n      class=\"modal-footer\"\n      *ngIf=\"\n        (orphanedPlugins$ | async).length > 0 || (newPlugins$ | async).length > 0;\n        else updateProgressButtons\n      \"\n    >\n      <button\n        class=\"btn btn-default\"\n        title=\"{{ 'Close' | translate }}\"\n        (click)=\"close()\"\n        [disabled]=\"isUpdateOngoing\"\n      >\n        {{ 'Close' | translate }}\n      </button>\n      <button\n        class=\"btn btn-primary\"\n        title=\"{{ 'Continue' | translate }}\"\n        (click)=\"updateApplication()\"\n        *ngIf=\"(orphanedPlugins$ | async).length > 0 || (newPlugins$ | async).length > 0\"\n        [disabled]=\"isUpdateOngoing\"\n      >\n        {{ 'Continue' | translate }}\n      </button>\n    </div>\n  </ng-container>\n\n  <ng-template #updateProgressButtons>\n    <ng-container c8y-modal-footer-custom>\n      <div class=\"modal-footer\">\n        <button\n          class=\"btn btn-default\"\n          title=\"{{ 'Close' | translate }}\"\n          (click)=\"done()\"\n          [disabled]=\"isUpdateOngoing\"\n        >\n          {{ 'Close' | translate }}\n        </button>\n      </div>\n    </ng-container>\n  </ng-template>\n\n  <ng-template #updateProgress>\n    <c8y-loading\n      class=\"text-center d-block p-t-56 p-b-56 m-t-4 m-b-4\"\n      style=\"min-height: 180px\"\n      layout=\"application\"\n      *ngIf=\"isUpdateOngoing\"\n      [message]=\"'Updating\u2026' | translate\"\n    ></c8y-loading>\n\n    <c8y-operation-result\n      type=\"success\"\n      *ngIf=\"!isUpdateOngoing && !updateFailure\"\n      text=\"{{ 'Update completed' | translate }}\"\n      [size]=\"120\"\n      [vertical]=\"true\"\n    ></c8y-operation-result>\n    <c8y-operation-result\n      type=\"error\"\n      *ngIf=\"!isUpdateOngoing && updateFailure\"\n      text=\"{{ 'Failed to update application.' | translate }}\"\n      [size]=\"120\"\n      [vertical]=\"true\"\n    ></c8y-operation-result>\n  </ng-template>\n</c8y-modal>\n", dependencies: [{ kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "component", type: i2.OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "component", type: i2.ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "component", type: i2.ListGroupComponent, selector: "c8y-list-group" }, { kind: "component", type: i2.ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: i2.ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: i2.ListItemBodyComponent, selector: "c8y-list-item-body, c8y-li-body", inputs: ["body"] }, { kind: "component", type: i2.ListItemFooterComponent, selector: "c8y-list-item-footer, c8y-li-footer", inputs: ["footer"] }, { kind: "component", type: i2.ListItemCollapseComponent, selector: "c8y-list-item-collapse, c8y-li-collapse", inputs: ["collapseWay"] }, { kind: "component", type: PluginListComponent, selector: "c8y-plugin-list", inputs: ["plugins$", "emptyListText", "selectable", "hideSource", "installable", "package", "selectedPlugin"], outputs: ["selectedItems", "showOverview"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: UpdateApplicationModalComponent, isStandalone: true, selector: "c8y-update-application-modal", viewQueries: [{ propertyName: "modal", first: true, predicate: ["modal"], descendants: true }], ngImport: i0, template: "<c8y-modal\n  [title]=\"'Update application' | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n  #modal\n>\n  <ng-container c8y-modal-title>\n    <span class=\"dlt-c8y-icon-installing-updates\"></span>\n  </ng-container>\n\n  <ng-container\n    *ngIf=\"\n      (orphanedPlugins$ | async).length > 0 || (newPlugins$ | async).length > 0;\n      else updateProgress\n    \"\n  >\n    <p\n      class=\"text-center text-break-word p-24 text-14\"\n      translate\n    >\n      Updating this blueprint will change the default plugins. Review the plugin changes before\n      proceeding.\n    </p>\n    <c8y-list-group *ngIf=\"(orphanedPlugins$ | async).length > 0\">\n      <c8y-li [collapsed]=\"true\">\n        <c8y-li-icon>\n          <span class=\"badge badge-danger\">{{ (orphanedPlugins$ | async).length }}</span>\n        </c8y-li-icon>\n        <c8y-li-body>\n          <div translate>Orphaned plugins</div>\n        </c8y-li-body>\n        <c8y-li-footer translate>\n          Some plugins are not contained in the new version of this blueprint and will therefore get\n          removed.\n        </c8y-li-footer>\n        <c8y-li-collapse>\n          <c8y-plugin-list\n            class=\"m-t-16\"\n            [emptyListText]=\"'No plugins available' | translate\"\n            [plugins$]=\"orphanedPlugins$\"\n            [selectable]=\"false\"\n            [hideSource]=\"true\"\n          ></c8y-plugin-list>\n        </c8y-li-collapse>\n      </c8y-li>\n    </c8y-list-group>\n\n    <c8y-list-group *ngIf=\"(newPlugins$ | async).length > 0\">\n      <c8y-li [collapsed]=\"false\">\n        <c8y-li-icon>\n          <span class=\"badge badge-success\">{{ (newPlugins$ | async).length }}</span>\n        </c8y-li-icon>\n        <c8y-li-body>\n          <div translate>New plugins added</div>\n        </c8y-li-body>\n        <c8y-li-footer translate>\n          This blueprint will add new plugins. Please choose which you want to install.\n        </c8y-li-footer>\n        <c8y-li-collapse>\n          <c8y-plugin-list\n            class=\"m-t-16\"\n            [emptyListText]=\"'No plugins available' | translate\"\n            [plugins$]=\"newPlugins$\"\n            [selectable]=\"true\"\n            [hideSource]=\"false\"\n          ></c8y-plugin-list>\n        </c8y-li-collapse>\n      </c8y-li>\n    </c8y-list-group>\n  </ng-container>\n\n  <ng-container c8y-modal-footer-custom>\n    <div\n      class=\"modal-footer\"\n      *ngIf=\"\n        (orphanedPlugins$ | async).length > 0 || (newPlugins$ | async).length > 0;\n        else updateProgressButtons\n      \"\n    >\n      <button\n        class=\"btn btn-default\"\n        title=\"{{ 'Close' | translate }}\"\n        (click)=\"close()\"\n        [disabled]=\"isUpdateOngoing\"\n      >\n        {{ 'Close' | translate }}\n      </button>\n      <button\n        class=\"btn btn-primary\"\n        title=\"{{ 'Continue' | translate }}\"\n        (click)=\"updateApplication()\"\n        *ngIf=\"(orphanedPlugins$ | async).length > 0 || (newPlugins$ | async).length > 0\"\n        [disabled]=\"isUpdateOngoing\"\n      >\n        {{ 'Continue' | translate }}\n      </button>\n    </div>\n  </ng-container>\n\n  <ng-template #updateProgressButtons>\n    <ng-container c8y-modal-footer-custom>\n      <div class=\"modal-footer\">\n        <button\n          class=\"btn btn-default\"\n          title=\"{{ 'Close' | translate }}\"\n          (click)=\"done()\"\n          [disabled]=\"isUpdateOngoing\"\n        >\n          {{ 'Close' | translate }}\n        </button>\n      </div>\n    </ng-container>\n  </ng-template>\n\n  <ng-template #updateProgress>\n    <c8y-loading\n      class=\"text-center d-block p-t-56 p-b-56 m-t-4 m-b-4\"\n      style=\"min-height: 180px\"\n      layout=\"application\"\n      *ngIf=\"isUpdateOngoing\"\n      [message]=\"'Updating\u2026' | translate\"\n    ></c8y-loading>\n\n    <c8y-operation-result\n      type=\"success\"\n      *ngIf=\"!isUpdateOngoing && !updateFailure\"\n      text=\"{{ 'Update completed' | translate }}\"\n      [size]=\"120\"\n      [vertical]=\"true\"\n    ></c8y-operation-result>\n    <c8y-operation-result\n      type=\"error\"\n      *ngIf=\"!isUpdateOngoing && updateFailure\"\n      text=\"{{ 'Failed to update application.' | translate }}\"\n      [size]=\"120\"\n      [vertical]=\"true\"\n    ></c8y-operation-result>\n  </ng-template>\n</c8y-modal>\n", dependencies: [{ kind: "component", type: ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: ListGroupComponent, selector: "c8y-list-group" }, { 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: ListItemBodyComponent, selector: "c8y-list-item-body, c8y-li-body", inputs: ["body"] }, { kind: "component", type: ListItemFooterComponent, selector: "c8y-list-item-footer, c8y-li-footer", inputs: ["footer"] }, { kind: "component", type: ListItemCollapseComponent, selector: "c8y-list-item-collapse, c8y-li-collapse", inputs: ["collapseWay"] }, { kind: "component", type: PluginListComponent, selector: "c8y-plugin-list", inputs: ["plugins$", "emptyListText", "selectable", "hideSource", "installable", "package", "selectedPlugin"], outputs: ["selectedItems", "showOverview"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "component", type: OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UpdateApplicationModalComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-update-application-modal', standalone: false, template: "<c8y-modal\n  [title]=\"'Update application' | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n  #modal\n>\n  <ng-container c8y-modal-title>\n    <span class=\"dlt-c8y-icon-installing-updates\"></span>\n  </ng-container>\n\n  <ng-container\n    *ngIf=\"\n      (orphanedPlugins$ | async).length > 0 || (newPlugins$ | async).length > 0;\n      else updateProgress\n    \"\n  >\n    <p\n      class=\"text-center text-break-word p-24 text-14\"\n      translate\n    >\n      Updating this blueprint will change the default plugins. Review the plugin changes before\n      proceeding.\n    </p>\n    <c8y-list-group *ngIf=\"(orphanedPlugins$ | async).length > 0\">\n      <c8y-li [collapsed]=\"true\">\n        <c8y-li-icon>\n          <span class=\"badge badge-danger\">{{ (orphanedPlugins$ | async).length }}</span>\n        </c8y-li-icon>\n        <c8y-li-body>\n          <div translate>Orphaned plugins</div>\n        </c8y-li-body>\n        <c8y-li-footer translate>\n          Some plugins are not contained in the new version of this blueprint and will therefore get\n          removed.\n        </c8y-li-footer>\n        <c8y-li-collapse>\n          <c8y-plugin-list\n            class=\"m-t-16\"\n            [emptyListText]=\"'No plugins available' | translate\"\n            [plugins$]=\"orphanedPlugins$\"\n            [selectable]=\"false\"\n            [hideSource]=\"true\"\n          ></c8y-plugin-list>\n        </c8y-li-collapse>\n      </c8y-li>\n    </c8y-list-group>\n\n    <c8y-list-group *ngIf=\"(newPlugins$ | async).length > 0\">\n      <c8y-li [collapsed]=\"false\">\n        <c8y-li-icon>\n          <span class=\"badge badge-success\">{{ (newPlugins$ | async).length }}</span>\n        </c8y-li-icon>\n        <c8y-li-body>\n          <div translate>New plugins added</div>\n        </c8y-li-body>\n        <c8y-li-footer translate>\n          This blueprint will add new plugins. Please choose which you want to install.\n        </c8y-li-footer>\n        <c8y-li-collapse>\n          <c8y-plugin-list\n            class=\"m-t-16\"\n            [emptyListText]=\"'No plugins available' | translate\"\n            [plugins$]=\"newPlugins$\"\n            [selectable]=\"true\"\n            [hideSource]=\"false\"\n          ></c8y-plugin-list>\n        </c8y-li-collapse>\n      </c8y-li>\n    </c8y-list-group>\n  </ng-container>\n\n  <ng-container c8y-modal-footer-custom>\n    <div\n      class=\"modal-footer\"\n      *ngIf=\"\n        (orphanedPlugins$ | async).length > 0 || (newPlugins$ | async).length > 0;\n        else updateProgressButtons\n      \"\n    >\n      <button\n        class=\"btn btn-default\"\n        title=\"{{ 'Close' | translate }}\"\n        (click)=\"close()\"\n        [disabled]=\"isUpdateOngoing\"\n      >\n        {{ 'Close' | translate }}\n      </button>\n      <button\n        class=\"btn btn-primary\"\n        title=\"{{ 'Continue' | translate }}\"\n        (click)=\"updateApplication()\"\n        *ngIf=\"(orphanedPlugins$ | async).length > 0 || (newPlugins$ | async).length > 0\"\n        [disabled]=\"isUpdateOngoing\"\n      >\n        {{ 'Continue' | translate }}\n      </button>\n    </div>\n  </ng-container>\n\n  <ng-template #updateProgressButtons>\n    <ng-container c8y-modal-footer-custom>\n      <div class=\"modal-footer\">\n        <button\n          class=\"btn btn-default\"\n          title=\"{{ 'Close' | translate }}\"\n          (click)=\"done()\"\n          [disabled]=\"isUpdateOngoing\"\n        >\n          {{ 'Close' | translate }}\n        </button>\n      </div>\n    </ng-container>\n  </ng-template>\n\n  <ng-template #updateProgress>\n    <c8y-loading\n      class=\"text-center d-block p-t-56 p-b-56 m-t-4 m-b-4\"\n      style=\"min-height: 180px\"\n      layout=\"application\"\n      *ngIf=\"isUpdateOngoing\"\n      [message]=\"'Updating\u2026' | translate\"\n    ></c8y-loading>\n\n    <c8y-operation-result\n      type=\"success\"\n      *ngIf=\"!isUpdateOngoing && !updateFailure\"\n      text=\"{{ 'Update completed' | translate }}\"\n      [size]=\"120\"\n      [vertical]=\"true\"\n    ></c8y-operation-result>\n    <c8y-operation-result\n      type=\"error\"\n      *ngIf=\"!isUpdateOngoing && updateFailure\"\n      text=\"{{ 'Failed to update application.' | translate }}\"\n      [size]=\"120\"\n      [vertical]=\"true\"\n    ></c8y-operation-result>\n  </ng-template>\n</c8y-modal>\n" }]
+            args: [{ selector: 'c8y-update-application-modal', imports: [
+                        ModalComponent,
+                        NgIf,
+                        C8yTranslateDirective,
+                        ListGroupComponent,
+                        ListItemComponent,
+                        ListItemIconComponent,
+                        ListItemBodyComponent,
+                        ListItemFooterComponent,
+                        ListItemCollapseComponent,
+                        PluginListComponent,
+                        LoadingComponent,
+                        OperationResultComponent,
+                        C8yTranslatePipe,
+                        AsyncPipe
+                    ], template: "<c8y-modal\n  [title]=\"'Update application' | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n  #modal\n>\n  <ng-container c8y-modal-title>\n    <span class=\"dlt-c8y-icon-installing-updates\"></span>\n  </ng-container>\n\n  <ng-container\n    *ngIf=\"\n      (orphanedPlugins$ | async).length > 0 || (newPlugins$ | async).length > 0;\n      else updateProgress\n    \"\n  >\n    <p\n      class=\"text-center text-break-word p-24 text-14\"\n      translate\n    >\n      Updating this blueprint will change the default plugins. Review the plugin changes before\n      proceeding.\n    </p>\n    <c8y-list-group *ngIf=\"(orphanedPlugins$ | async).length > 0\">\n      <c8y-li [collapsed]=\"true\">\n        <c8y-li-icon>\n          <span class=\"badge badge-danger\">{{ (orphanedPlugins$ | async).length }}</span>\n        </c8y-li-icon>\n        <c8y-li-body>\n          <div translate>Orphaned plugins</div>\n        </c8y-li-body>\n        <c8y-li-footer translate>\n          Some plugins are not contained in the new version of this blueprint and will therefore get\n          removed.\n        </c8y-li-footer>\n        <c8y-li-collapse>\n          <c8y-plugin-list\n            class=\"m-t-16\"\n            [emptyListText]=\"'No plugins available' | translate\"\n            [plugins$]=\"orphanedPlugins$\"\n            [selectable]=\"false\"\n            [hideSource]=\"true\"\n          ></c8y-plugin-list>\n        </c8y-li-collapse>\n      </c8y-li>\n    </c8y-list-group>\n\n    <c8y-list-group *ngIf=\"(newPlugins$ | async).length > 0\">\n      <c8y-li [collapsed]=\"false\">\n        <c8y-li-icon>\n          <span class=\"badge badge-success\">{{ (newPlugins$ | async).length }}</span>\n        </c8y-li-icon>\n        <c8y-li-body>\n          <div translate>New plugins added</div>\n        </c8y-li-body>\n        <c8y-li-footer translate>\n          This blueprint will add new plugins. Please choose which you want to install.\n        </c8y-li-footer>\n        <c8y-li-collapse>\n          <c8y-plugin-list\n            class=\"m-t-16\"\n            [emptyListText]=\"'No plugins available' | translate\"\n            [plugins$]=\"newPlugins$\"\n            [selectable]=\"true\"\n            [hideSource]=\"false\"\n          ></c8y-plugin-list>\n        </c8y-li-collapse>\n      </c8y-li>\n    </c8y-list-group>\n  </ng-container>\n\n  <ng-container c8y-modal-footer-custom>\n    <div\n      class=\"modal-footer\"\n      *ngIf=\"\n        (orphanedPlugins$ | async).length > 0 || (newPlugins$ | async).length > 0;\n        else updateProgressButtons\n      \"\n    >\n      <button\n        class=\"btn btn-default\"\n        title=\"{{ 'Close' | translate }}\"\n        (click)=\"close()\"\n        [disabled]=\"isUpdateOngoing\"\n      >\n        {{ 'Close' | translate }}\n      </button>\n      <button\n        class=\"btn btn-primary\"\n        title=\"{{ 'Continue' | translate }}\"\n        (click)=\"updateApplication()\"\n        *ngIf=\"(orphanedPlugins$ | async).length > 0 || (newPlugins$ | async).length > 0\"\n        [disabled]=\"isUpdateOngoing\"\n      >\n        {{ 'Continue' | translate }}\n      </button>\n    </div>\n  </ng-container>\n\n  <ng-template #updateProgressButtons>\n    <ng-container c8y-modal-footer-custom>\n      <div class=\"modal-footer\">\n        <button\n          class=\"btn btn-default\"\n          title=\"{{ 'Close' | translate }}\"\n          (click)=\"done()\"\n          [disabled]=\"isUpdateOngoing\"\n        >\n          {{ 'Close' | translate }}\n        </button>\n      </div>\n    </ng-container>\n  </ng-template>\n\n  <ng-template #updateProgress>\n    <c8y-loading\n      class=\"text-center d-block p-t-56 p-b-56 m-t-4 m-b-4\"\n      style=\"min-height: 180px\"\n      layout=\"application\"\n      *ngIf=\"isUpdateOngoing\"\n      [message]=\"'Updating\u2026' | translate\"\n    ></c8y-loading>\n\n    <c8y-operation-result\n      type=\"success\"\n      *ngIf=\"!isUpdateOngoing && !updateFailure\"\n      text=\"{{ 'Update completed' | translate }}\"\n      [size]=\"120\"\n      [vertical]=\"true\"\n    ></c8y-operation-result>\n    <c8y-operation-result\n      type=\"error\"\n      *ngIf=\"!isUpdateOngoing && updateFailure\"\n      text=\"{{ 'Failed to update application.' | translate }}\"\n      [size]=\"120\"\n      [vertical]=\"true\"\n    ></c8y-operation-result>\n  </ng-template>\n</c8y-modal>\n" }]
         }], ctorParameters: () => [{ type: i4.InventoryService }, { type: i1.EcosystemService }, { type: i2.PluginsService }], propDecorators: { modal: [{
                 type: ViewChild,
                 args: ['modal', { static: false }]
@@ -1001,13 +643,41 @@ class ApplicationPropertiesComponent {
             this.alertService.warning(gettext('Unable to resolve versions of source package.'));
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ApplicationPropertiesComponent, deps: [{ token: i1$2.ActivatedRoute }, { token: i1.EcosystemService }, { token: i1$2.Router }, { token: i2$1.FormBuilder }, { token: i4.ApplicationService }, { token: i2.AlertService }, { token: i4.InventoryService }, { token: i2.Permissions }, { token: i2.ModalService }, { token: i6.TranslateService }, { token: i1$1.BsModalService }, { token: i2.GainsightService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ApplicationPropertiesComponent, isStandalone: false, selector: "c8y-application-properties", ngImport: i0, template: "<c8y-title>{{ application | humanizeAppName | async }}</c8y-title>\n\n<c8y-breadcrumb *ngIf=\"!isMicroservice\">\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-modules'\"\n    [label]=\"'Applications' | translate\"\n    [path]=\"'ecosystem/application/applications'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"breadcrumbConfig?.icon\"\n    *ngIf=\"isFeature\"\n    [label]=\"breadcrumbConfig?.label\"\n    [path]=\"breadcrumbConfig?.path\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"application | humanizeAppName | async\"></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"'Properties' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-breadcrumb *ngIf=\"isMicroservice\">\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"breadcrumbConfig?.icon\"\n    [label]=\"breadcrumbConfig?.label\"\n    [path]=\"breadcrumbConfig?.path\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"application | humanizeAppName | async\"></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"'Properties' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<div class=\"row\">\n  <div [ngClass]=\"{ 'col-md-8': !isActivityLogSupported, 'col-md-12': isActivityLogSupported }\">\n    <div\n      class=\"card content-fullpage\"\n      *ngIf=\"application\"\n      [ngClass]=\"{ 'd-grid grid__col--7-5--md': isActivityLogSupported }\"\n    >\n      <form\n        class=\"d-flex d-col content-fullpage\"\n        (ngSubmit)=\"formGroup.valid && save(formGroup.value)\"\n        [formGroup]=\"formGroup\"\n        novalidate\n      >\n        <div\n          class=\"d-contents\"\n          *ngIf=\"!isLoading\"\n        >\n          <div class=\"card-block separator-bottom large-padding flex-no-shrink\">\n            <div class=\"d-flex-md a-i-start text-center text-left-md\">\n              <c8y-app-icon\n                class=\"icon-48\"\n                *ngIf=\"!isPackage && !isFeature && !isMicroservice && !isExternal\"\n                [app]=\"application\"\n                [contextPath]=\"application.contextPath\"\n                [name]=\"application.name\"\n              ></c8y-app-icon>\n              <i\n                class=\"icon-48\"\n                c8yIcon=\"big-parcel\"\n                *ngIf=\"isPackage\"\n              ></i>\n              <i\n                class=\"icon-48\"\n                c8yIcon=\"tab\"\n                *ngIf=\"isFeature\"\n              ></i>\n              <i\n                class=\"icon-48\"\n                c8yIcon=\"microchip\"\n                *ngIf=\"isMicroservice\"\n              ></i>\n              <i\n                class=\"icon-48\"\n                c8yIcon=\"globe1\"\n                *ngIf=\"isExternal\"\n              ></i>\n\n              <div class=\"p-t-md-16 p-l-md-16 p-r-md-32 flex-grow\">\n                <p class=\"h4 text-medium m-b-8\">{{ application | humanizeAppName | async }}</p>\n                <p *ngIf=\"!isOwner\">\n                  <em class=\"text-muted\">\n                    {{\n                      formGroup?.controls?.description?.value || (noDescriptionLabel | translate)\n                    }}\n                  </em>\n                </p>\n                <div\n                  class=\"form-group m-b-0\"\n                  *ngIf=\"isOwner\"\n                >\n                  <label\n                    class=\"editable\"\n                    [ngClass]=\"{ updated: formGroup?.controls?.description?.dirty }\"\n                  >\n                    <textarea\n                      class=\"form-control no-resize\"\n                      placeholder=\"{{ noDescriptionLabel | translate }}\"\n                      name=\"description\"\n                      c8y-textarea-autoresize\n                      formControlName=\"description\"\n                    ></textarea>\n                  </label>\n                </div>\n              </div>\n              <div class=\"text-right-md m-t-4\">\n                <span\n                  class=\"label\"\n                  [ngClass]=\"appState?.class\"\n                >\n                  {{ appState?.label | translate }}\n                </span>\n                <div\n                  class=\"fit-w m-t-2\"\n                  *ngIf=\"application.manifest?.version\"\n                  data-cy=\"application-detail--version\"\n                >\n                  <label\n                    class=\"text-label-small\"\n                    translate\n                  >\n                    Version:\n                  </label>\n                  <small class=\"p-l-4 text-bold\">{{ application.manifest?.version }}</small>\n                </div>\n                <div\n                  class=\"fit-w m-t-2\"\n                  *ngIf=\"!isUnpacked\"\n                >\n                  <label\n                    class=\"text-label-small\"\n                    translate\n                  >\n                    Creation time:\n                  </label>\n                  <small class=\"p-l-4 text-bold\">\n                    {{ (binaryMo?.creationTime | c8yDate) || '---' }}\n                  </small>\n                </div>\n                <div class=\"m-t-8\">\n                  <button\n                    class=\"btn btn-default btn-sm\"\n                    [attr.aria-label]=\"\n                      'There\\'s a newer version available, click to update' | translate\n                    \"\n                    tooltip=\"{{\n                      'There\\'s a newer version available, click to update' | translate\n                    }}\"\n                    placement=\"top\"\n                    type=\"button\"\n                    *ngIf=\"isUpdateAvailable\"\n                    (click)=\"updateToLatestVersion()\"\n                    [delay]=\"300\"\n                  >\n                    <i [c8yIcon]=\"'installing-updates'\"></i>\n                    {{ 'Update available' | translate }}\n                  </button>\n                  <button\n                    class=\"btn btn-default btn-sm\"\n                    title=\"{{ 'Open' | translate }}\"\n                    type=\"button\"\n                    (click)=\"openApp(application)\"\n                    [disabled]=\"disableOpenInBrowser\"\n                    *ngIf=\"canOpenInBrowser\"\n                  >\n                    <i [c8yIcon]=\"'external-link'\"></i>\n                    {{ 'Open' | translate }}\n                  </button>\n                  <div *ngIf=\"canOpenInBrowser && disableOpenInBrowser\">\n                    <small\n                      class=\"text-muted\"\n                      translate\n                    >\n                      The application is overwritten by a custom application sharing the same path\n                    </small>\n                  </div>\n                  <span *ngIf=\"isCustomMicroservice\">\n                    <button\n                      class=\"btn btn-default btn-sm\"\n                      title=\"{{ 'Subscribe' | translate }}\"\n                      type=\"button\"\n                      (click)=\"subscribe()\"\n                      *ngIf=\"!isSubscribed\"\n                    >\n                      <i [c8yIcon]=\"'check-circle-o'\"></i>\n                      {{ 'Subscribe' | translate }}\n                    </button>\n                    <button\n                      class=\"btn btn-default btn-sm\"\n                      title=\"{{ 'Unsubscribe' | translate }}\"\n                      type=\"button\"\n                      (click)=\"unsubscribe()\"\n                      *ngIf=\"isSubscribed\"\n                    >\n                      <i [c8yIcon]=\"'minus-circle'\"></i>\n                      {{ 'Unsubscribe' | translate }}\n                    </button>\n                  </span>\n                </div>\n              </div>\n            </div>\n          </div>\n          <div class=\"inner-scroll bg-level-0 flex-grow\">\n            <div class=\"card-block large-padding\">\n              <div\n                class=\"row p-16\"\n                *ngIf=\"isPackage\"\n              >\n                <c8y-properties-list\n                  icon=\"info\"\n                  [title]=\"'Package details' | translate\"\n                  [data]=\"application.manifest\"\n                  [properties]=\"packageProperties\"\n                  [emptyLabel]=\"'---'\"\n                ></c8y-properties-list>\n              </div>\n              <div\n                class=\"row p-16\"\n                *ngIf=\"sourcePackage\"\n              >\n                <c8y-properties-list\n                  icon=\"info\"\n                  [title]=\"'Source package information' | translate\"\n                  [data]=\"sourcePackage.manifest\"\n                  [properties]=\"packageProperties\"\n                  [emptyLabel]=\"'---'\"\n                ></c8y-properties-list>\n              </div>\n              <div class=\"row\">\n                <div class=\"col-sm-5\">\n                  <c8y-form-group>\n                    <label for=\"appId\">ID</label>\n                    <input\n                      class=\"form-control\"\n                      id=\"appId\"\n                      name=\"id\"\n                      type=\"text\"\n                      autocomplete=\"off\"\n                      [readonly]=\"true\"\n                      formControlName=\"id\"\n                    />\n                  </c8y-form-group>\n                </div>\n                <div class=\"col-sm-7\">\n                  <c8y-form-group>\n                    <label>{{ 'Name' | translate }}</label>\n                    <input\n                      class=\"form-control\"\n                      placeholder=\"{{ 'e.g. My application' | translate }}\"\n                      name=\"name\"\n                      type=\"text\"\n                      required\n                      [readonly]=\"!isOwner\"\n                      formControlName=\"name\"\n                    />\n                  </c8y-form-group>\n                </div>\n              </div>\n\n              <div class=\"row\">\n                <div class=\"col-sm-5\">\n                  <c8y-form-group>\n                    <label>{{ 'Application key' | translate }}</label>\n                    <input\n                      class=\"form-control\"\n                      placeholder=\"{{ 'e.g. my-application-key' | translate }}\"\n                      name=\"key\"\n                      type=\"text\"\n                      required\n                      [readonly]=\"application.id || !isOwner\"\n                      formControlName=\"key\"\n                    />\n                  </c8y-form-group>\n                </div>\n\n                <div class=\"col-sm-7\" data-cy=\"application-detail--type\">\n                  <c8y-form-group>\n                    <label>{{ 'Type' | translate }}</label>\n                    <div>\n                      <div *ngIf=\"application.id\">\n                        <p class=\"form-control-static\">\n                          <i [c8yIcon]=\"iconMap[application.type]\"></i>\n                          <span>\n                            {{ application.type | translate }}\n                          </span>\n                        </p>\n                      </div>\n                    </div>\n                  </c8y-form-group>\n                </div>\n              </div>\n\n              <div [ngSwitch]=\"application.type\">\n                <div *ngSwitchCase=\"'HOSTED'\">\n                  <c8y-form-group>\n                    <label>{{ 'Path' | translate }}</label>\n                    <div class=\"input-group\">\n                      <span class=\"input-group-addon\">/apps/</span>\n                      <input\n                        class=\"form-control\"\n                        placeholder=\"{{ 'e.g. my-application`used in URL`' | translate }}\"\n                        name=\"contextPath\"\n                        type=\"text\"\n                        required\n                        [readOnly]=\"application.id || !isOwner\"\n                        formControlName=\"contextPath\"\n                      />\n                    </div>\n                  </c8y-form-group>\n                </div>\n\n                <div *ngSwitchCase=\"'MICROSERVICE'\">\n                  <c8y-form-group>\n                    <label>{{ 'Path' | translate }}</label>\n                    <div class=\"input-group\">\n                      <span class=\"input-group-addon\">/service/</span>\n                      <input\n                        class=\"form-control\"\n                        placeholder=\"{{ 'e.g. my-microservice`used in URL`' | translate }}\"\n                        name=\"contextPath\"\n                        type=\"text\"\n                        required\n                        [readOnly]=\"application.id || !isOwner\"\n                        formControlName=\"contextPath\"\n                      />\n                    </div>\n                  </c8y-form-group>\n                  <div class=\"row\">\n                    <div\n                      class=\"col-sm-4 m-b-16 flex-auto\"\n                      *ngIf=\"application.manifest.version\"\n                      data-cy=\"application-detail--version\"\n                    >\n                      <label>{{ 'Version' | translate }}</label>\n                      <p class=\"form-control-static\">\n                        {{ application.manifest.version }}\n                      </p>\n                    </div>\n                    <div\n                      class=\"col-sm-4 m-b-16 flex-auto\"\n                      *ngIf=\"application.manifest.isolation\"\n                      data-cy=\"application-detail--isolation\"\n                    >\n                      <label>{{ 'Isolation' | translate }}</label>\n                      <p class=\"form-control-static\">\n                        <span *ngIf=\"singleTenant\">\n                          <i\n                            class=\"c8y-icon-duocolor h4\"\n                            [c8yIcon]=\"'c8y-enterprise'\"\n                          ></i>\n                          {{ 'Single tenant' | translate }}\n                        </span>\n                        <span *ngIf=\"!singleTenant\">\n                          <i\n                            class=\"c8y-icon-duocolor icon-32\"\n                            [c8yIcon]=\"'c8y-sub-tenants'\"\n                          ></i>\n                          {{ 'Multi tenant' | translate }}\n                        </span>\n                      </p>\n                    </div>\n                    <div\n                      class=\"col-sm-4 m-b-16 flex-auto\"\n                      *ngIf=\"application.manifest.isolation\"\n                      data-cy=\"application-detail--billing-mode\"\n                    >\n                      <label>{{ 'Billing mode' | translate }}</label>\n                      <p class=\"form-control-static\">\n                        <span\n                          [tooltip]=\"'Resources usage assigned to: Owner' | translate\"\n                          *ngIf=\"subscription\"\n                        >\n                          {{ 'Subscription' | translate }}\n                        </span>\n                        <span\n                          [tooltip]=\"'Resources usage assigned to: Subscriber | translate'\"\n                          *ngIf=\"!subscription && singleTenant\"\n                        >\n                          {{ 'Resources' | translate }}\n                        </span>\n                        <span\n                          [tooltip]=\"'Resources usage assigned to: Owner' | translate\"\n                          *ngIf=\"!subscription && !singleTenant\"\n                        >\n                          {{ 'Resources' | translate }}\n                        </span>\n                      </p>\n                    </div>\n                  </div>\n\n                  <div\n                    class=\"legend form-block m-t-40\"\n                    *ngIf=\"application.manifest.provider\"\n                  >\n                    {{ 'Provider' | translate }}\n                  </div>\n                  <div\n                    class=\"list-inline\"\n                    *ngIf=\"application.manifest.provider\"\n                    data-cy=\"application-detail--provider\"\n                  >\n                    <div *ngIf=\"application.manifest.provider.name\">\n                      <div class=\"col-sm-4 m-b-16\">\n                        <label>{{ 'Name' | translate }}</label>\n                        <p class=\"form-control-static\">\n                          {{ application.manifest.provider.name }}\n                        </p>\n                      </div>\n                    </div>\n                    <div *ngIf=\"application.manifest.provider.domain\">\n                      <div class=\"col-sm-4 m-b-16\">\n                        <label>{{ 'Domain' | translate }}</label>\n                        <p class=\"form-control-static\">\n                          {{ application.manifest.provider.domain }}\n                        </p>\n                      </div>\n                    </div>\n                    <div *ngIf=\"application.manifest.provider.support\">\n                      <div class=\"col-sm-4 m-b-16\">\n                        <label>{{ 'Support' | translate }}</label>\n                        <p class=\"form-control-static\">\n                          {{ application.manifest.provider.support }}\n                        </p>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n\n                <div *ngSwitchCase=\"'EXTERNAL'\">\n                  <c8y-form-group>\n                    <label>{{ 'External URL' | translate }}</label>\n                    <input\n                      class=\"form-control\"\n                      placeholder=\"{{ 'e.g.' | translate }} http://www.example.com/\"\n                      name=\"externalUrl\"\n                      type=\"url\"\n                      required\n                      [pattern]=\"'^(?!javascript:).+'\"\n                      [readOnly]=\"!isOwner\"\n                      formControlName=\"externalUrl\"\n                    />\n                    <c8y-messages>\n                      <c8y-message\n                        [name]=\"'pattern'\"\n                        [text]=\"'Valid URL required.' | translate\"\n                      ></c8y-message>\n                    </c8y-messages>\n                  </c8y-form-group>\n                </div>\n\n                <div *ngIf=\"isOwner && !isCustomMicroservice\">\n                  <label>{{ 'Select icon' | translate }}</label>\n                  <c8y-icon-selector-wrapper\n                    name=\"icon\"\n                    formControlName=\"icon\"\n                  ></c8y-icon-selector-wrapper>\n                </div>\n              </div>\n            </div>\n          </div>\n          <ng-container *ngIf=\"isCustomMicroservice\">\n            <div\n              class=\"d-contents\"\n              *ngIf=\"!isLoading\"\n            >\n              <c8y-upload-archive\n                [(application)]=\"application\"\n                (refresh)=\"onNewArchive()\"\n              ></c8y-upload-archive>\n            </div>\n          </ng-container>\n          <div\n            class=\"card-footer separator\"\n            *ngIf=\"application && !!isOwner && hasAdminPermissions\"\n          >\n            <button\n              class=\"btn btn-default\"\n              title=\"{{ 'Cancel' | translate }}\"\n              type=\"button\"\n              (click)=\"cancel()\"\n            >\n              {{ 'Cancel' | translate }}\n            </button>\n            <button\n              class=\"btn btn-danger\"\n              title=\"{{ 'Delete' | translate }}\"\n              type=\"button\"\n              (click)=\"delete()\"\n              *ngIf=\"canDelete\"\n            >\n              {{ 'Delete' | translate }}\n            </button>\n            <button\n              class=\"btn btn-primary btn-form\"\n              title=\"{{ 'Save' | translate }}\"\n              type=\"submit\"\n              [disabled]=\"!application.type || formGroup.invalid || formGroup.pristine\"\n            >\n              {{ 'Save' | translate }}\n            </button>\n          </div>\n        </div>\n      </form>\n\n      <div\n        class=\"content-fullpage d-flex d-col bg-level-1\"\n        *ngIf=\"isActivityLogSupported\"\n      >\n        <div class=\"card-header separator\">\n          <div\n            class=\"card-title\"\n            translate\n          >\n            Activity log\n          </div>\n          <div class=\"m-l-auto\">\n            <button\n              class=\"btn btn-link btn-sm\"\n              title=\"{{ 'Reload' | translate }}\"\n              type=\"button\"\n              (click)=\"load()\"\n            >\n              <i\n                c8yIcon=\"refresh\"\n                [ngClass]=\"{ 'icon-spin': isLoading }\"\n              ></i>\n              {{ 'Reload' | translate }}\n            </button>\n          </div>\n        </div>\n        <div\n          class=\"p-16 text-center\"\n          *ngIf=\"isLoading\"\n        >\n          <c8y-loading></c8y-loading>\n        </div>\n        <c8y-activity-log\n          class=\"d-contents\"\n          *ngIf=\"!isLoading\"\n          [hasAdminPermissions]=\"hasAdminPermissions\"\n          [application]=\"application\"\n        ></c8y-activity-log>\n      </div>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "component", type: i2.AppIconComponent, selector: "c8y-app-icon", inputs: ["contextPath", "name", "app"] }, { kind: "component", type: i2.BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: i2.BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i2.LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "directive", type: i2.TextareaAutoresizeDirective, selector: "[c8y-textarea-autoresize]" }, { kind: "component", type: i2.TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "directive", type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "component", type: i2.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: i2.MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "component", type: i2.MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage"] }, { kind: "directive", type: i2.RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i2.PropertiesListComponent, selector: "c8y-properties-list", inputs: ["properties", "title", "icon", "data", "groups", "noParse", "emptyLabel"] }, { kind: "directive", type: i9.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: i1.UploadArchiveComponent, selector: "c8y-upload-archive", inputs: ["application", "uploadNewVersion", "preUploadCallback"], outputs: ["applicationChange", "refresh"] }, { kind: "component", type: i10.IconSelectorWrapperComponent, selector: "c8y-icon-selector-wrapper", inputs: ["canRemoveIcon", "selectedIcon", "iconSize"], outputs: ["onSelect"] }, { kind: "component", type: ActivityLogComponent, selector: "c8y-activity-log", inputs: ["application", "hasAdminPermissions"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.HumanizeAppNamePipe, name: "humanizeAppName" }, { kind: "pipe", type: i2.DatePipe, name: "c8yDate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ApplicationPropertiesComponent, deps: [{ token: i1$2.ActivatedRoute }, { token: i1.EcosystemService }, { token: i1$2.Router }, { token: i3.FormBuilder }, { token: i4.ApplicationService }, { token: i2.AlertService }, { token: i4.InventoryService }, { token: i2.Permissions }, { token: i2.ModalService }, { token: i6.TranslateService }, { token: i1$1.BsModalService }, { token: i2.GainsightService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ApplicationPropertiesComponent, isStandalone: true, selector: "c8y-application-properties", ngImport: i0, template: "<c8y-title>{{ application | humanizeAppName | async }}</c8y-title>\n\n<c8y-breadcrumb *ngIf=\"!isMicroservice\">\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-modules'\"\n    [label]=\"'Applications' | translate\"\n    [path]=\"'ecosystem/application/applications'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"breadcrumbConfig?.icon\"\n    *ngIf=\"isFeature\"\n    [label]=\"breadcrumbConfig?.label\"\n    [path]=\"breadcrumbConfig?.path\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"application | humanizeAppName | async\"></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"'Properties' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-breadcrumb *ngIf=\"isMicroservice\">\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"breadcrumbConfig?.icon\"\n    [label]=\"breadcrumbConfig?.label\"\n    [path]=\"breadcrumbConfig?.path\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"application | humanizeAppName | async\"></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"'Properties' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<div class=\"row\">\n  <div [ngClass]=\"{ 'col-md-8': !isActivityLogSupported, 'col-md-12': isActivityLogSupported }\">\n    <div\n      class=\"card content-fullpage\"\n      *ngIf=\"application\"\n      [ngClass]=\"{ 'd-grid grid__col--7-5--md': isActivityLogSupported }\"\n    >\n      <form\n        class=\"d-flex d-col content-fullpage\"\n        (ngSubmit)=\"formGroup.valid && save(formGroup.value)\"\n        [formGroup]=\"formGroup\"\n        novalidate\n      >\n        <div\n          class=\"d-contents\"\n          *ngIf=\"!isLoading\"\n        >\n          <div class=\"card-block separator-bottom large-padding flex-no-shrink\">\n            <div class=\"d-flex-md a-i-start text-center text-left-md\">\n              <c8y-app-icon\n                class=\"icon-48\"\n                *ngIf=\"!isPackage && !isFeature && !isMicroservice && !isExternal\"\n                [app]=\"application\"\n                [contextPath]=\"application.contextPath\"\n                [name]=\"application.name\"\n              ></c8y-app-icon>\n              <i\n                class=\"icon-48\"\n                c8yIcon=\"big-parcel\"\n                *ngIf=\"isPackage\"\n              ></i>\n              <i\n                class=\"icon-48\"\n                c8yIcon=\"tab\"\n                *ngIf=\"isFeature\"\n              ></i>\n              <i\n                class=\"icon-48\"\n                c8yIcon=\"microchip\"\n                *ngIf=\"isMicroservice\"\n              ></i>\n              <i\n                class=\"icon-48\"\n                c8yIcon=\"globe1\"\n                *ngIf=\"isExternal\"\n              ></i>\n\n              <div class=\"p-t-md-16 p-l-md-16 p-r-md-32 flex-grow\">\n                <p class=\"h4 text-medium m-b-8\">{{ application | humanizeAppName | async }}</p>\n                <p *ngIf=\"!isOwner\">\n                  <em class=\"text-muted\">\n                    {{\n                      formGroup?.controls?.description?.value || (noDescriptionLabel | translate)\n                    }}\n                  </em>\n                </p>\n                <div\n                  class=\"form-group m-b-0\"\n                  *ngIf=\"isOwner\"\n                >\n                  <label\n                    class=\"editable\"\n                    [ngClass]=\"{ updated: formGroup?.controls?.description?.dirty }\"\n                  >\n                    <textarea\n                      class=\"form-control no-resize\"\n                      placeholder=\"{{ noDescriptionLabel | translate }}\"\n                      name=\"description\"\n                      c8y-textarea-autoresize\n                      formControlName=\"description\"\n                    ></textarea>\n                  </label>\n                </div>\n              </div>\n              <div class=\"text-right-md m-t-4\">\n                <span\n                  class=\"label\"\n                  [ngClass]=\"appState?.class\"\n                >\n                  {{ appState?.label | translate }}\n                </span>\n                <div\n                  class=\"fit-w m-t-2\"\n                  *ngIf=\"application.manifest?.version\"\n                  data-cy=\"application-detail--version\"\n                >\n                  <label\n                    class=\"text-label-small\"\n                    translate\n                  >\n                    Version:\n                  </label>\n                  <small class=\"p-l-4 text-bold\">{{ application.manifest?.version }}</small>\n                </div>\n                <div\n                  class=\"fit-w m-t-2\"\n                  *ngIf=\"!isUnpacked\"\n                >\n                  <label\n                    class=\"text-label-small\"\n                    translate\n                  >\n                    Creation time:\n                  </label>\n                  <small class=\"p-l-4 text-bold\">\n                    {{ (binaryMo?.creationTime | c8yDate) || '---' }}\n                  </small>\n                </div>\n                <div class=\"m-t-8\">\n                  <button\n                    class=\"btn btn-default btn-sm\"\n                    [attr.aria-label]=\"\n                      'There\\'s a newer version available, click to update' | translate\n                    \"\n                    tooltip=\"{{\n                      'There\\'s a newer version available, click to update' | translate\n                    }}\"\n                    placement=\"top\"\n                    type=\"button\"\n                    *ngIf=\"isUpdateAvailable\"\n                    (click)=\"updateToLatestVersion()\"\n                    [delay]=\"300\"\n                  >\n                    <i [c8yIcon]=\"'installing-updates'\"></i>\n                    {{ 'Update available' | translate }}\n                  </button>\n                  <button\n                    class=\"btn btn-default btn-sm\"\n                    title=\"{{ 'Open' | translate }}\"\n                    type=\"button\"\n                    (click)=\"openApp(application)\"\n                    [disabled]=\"disableOpenInBrowser\"\n                    *ngIf=\"canOpenInBrowser\"\n                  >\n                    <i [c8yIcon]=\"'external-link'\"></i>\n                    {{ 'Open' | translate }}\n                  </button>\n                  <div *ngIf=\"canOpenInBrowser && disableOpenInBrowser\">\n                    <small\n                      class=\"text-muted\"\n                      translate\n                    >\n                      The application is overwritten by a custom application sharing the same path\n                    </small>\n                  </div>\n                  <span *ngIf=\"isCustomMicroservice\">\n                    <button\n                      class=\"btn btn-default btn-sm\"\n                      title=\"{{ 'Subscribe' | translate }}\"\n                      type=\"button\"\n                      (click)=\"subscribe()\"\n                      *ngIf=\"!isSubscribed\"\n                    >\n                      <i [c8yIcon]=\"'check-circle-o'\"></i>\n                      {{ 'Subscribe' | translate }}\n                    </button>\n                    <button\n                      class=\"btn btn-default btn-sm\"\n                      title=\"{{ 'Unsubscribe' | translate }}\"\n                      type=\"button\"\n                      (click)=\"unsubscribe()\"\n                      *ngIf=\"isSubscribed\"\n                    >\n                      <i [c8yIcon]=\"'minus-circle'\"></i>\n                      {{ 'Unsubscribe' | translate }}\n                    </button>\n                  </span>\n                </div>\n              </div>\n            </div>\n          </div>\n          <div class=\"inner-scroll bg-level-0 flex-grow\">\n            <div class=\"card-block large-padding\">\n              <div\n                class=\"row p-16\"\n                *ngIf=\"isPackage\"\n              >\n                <c8y-properties-list\n                  icon=\"info\"\n                  [title]=\"'Package details' | translate\"\n                  [data]=\"application.manifest\"\n                  [properties]=\"packageProperties\"\n                  [emptyLabel]=\"'---'\"\n                ></c8y-properties-list>\n              </div>\n              <div\n                class=\"row p-16\"\n                *ngIf=\"sourcePackage\"\n              >\n                <c8y-properties-list\n                  icon=\"info\"\n                  [title]=\"'Source package information' | translate\"\n                  [data]=\"sourcePackage.manifest\"\n                  [properties]=\"packageProperties\"\n                  [emptyLabel]=\"'---'\"\n                ></c8y-properties-list>\n              </div>\n              <div class=\"row\">\n                <div class=\"col-sm-5\">\n                  <c8y-form-group>\n                    <label for=\"appId\">ID</label>\n                    <input\n                      class=\"form-control\"\n                      id=\"appId\"\n                      name=\"id\"\n                      type=\"text\"\n                      autocomplete=\"off\"\n                      [readonly]=\"true\"\n                      formControlName=\"id\"\n                    />\n                  </c8y-form-group>\n                </div>\n                <div class=\"col-sm-7\">\n                  <c8y-form-group>\n                    <label>{{ 'Name' | translate }}</label>\n                    <input\n                      class=\"form-control\"\n                      placeholder=\"{{ 'e.g. My application' | translate }}\"\n                      name=\"name\"\n                      type=\"text\"\n                      required\n                      [readonly]=\"!isOwner\"\n                      formControlName=\"name\"\n                    />\n                  </c8y-form-group>\n                </div>\n              </div>\n\n              <div class=\"row\">\n                <div class=\"col-sm-5\">\n                  <c8y-form-group>\n                    <label>{{ 'Application key' | translate }}</label>\n                    <input\n                      class=\"form-control\"\n                      placeholder=\"{{ 'e.g. my-application-key' | translate }}\"\n                      name=\"key\"\n                      type=\"text\"\n                      required\n                      [readonly]=\"application.id || !isOwner\"\n                      formControlName=\"key\"\n                    />\n                  </c8y-form-group>\n                </div>\n\n                <div class=\"col-sm-7\" data-cy=\"application-detail--type\">\n                  <c8y-form-group>\n                    <label>{{ 'Type' | translate }}</label>\n                    <div>\n                      <div *ngIf=\"application.id\">\n                        <p class=\"form-control-static\">\n                          <i [c8yIcon]=\"iconMap[application.type]\"></i>\n                          <span>\n                            {{ application.type | translate }}\n                          </span>\n                        </p>\n                      </div>\n                    </div>\n                  </c8y-form-group>\n                </div>\n              </div>\n\n              <div [ngSwitch]=\"application.type\">\n                <div *ngSwitchCase=\"'HOSTED'\">\n                  <c8y-form-group>\n                    <label>{{ 'Path' | translate }}</label>\n                    <div class=\"input-group\">\n                      <span class=\"input-group-addon\">/apps/</span>\n                      <input\n                        class=\"form-control\"\n                        placeholder=\"{{ 'e.g. my-application`used in URL`' | translate }}\"\n                        name=\"contextPath\"\n                        type=\"text\"\n                        required\n                        [readOnly]=\"application.id || !isOwner\"\n                        formControlName=\"contextPath\"\n                      />\n                    </div>\n                  </c8y-form-group>\n                </div>\n\n                <div *ngSwitchCase=\"'MICROSERVICE'\">\n                  <c8y-form-group>\n                    <label>{{ 'Path' | translate }}</label>\n                    <div class=\"input-group\">\n                      <span class=\"input-group-addon\">/service/</span>\n                      <input\n                        class=\"form-control\"\n                        placeholder=\"{{ 'e.g. my-microservice`used in URL`' | translate }}\"\n                        name=\"contextPath\"\n                        type=\"text\"\n                        required\n                        [readOnly]=\"application.id || !isOwner\"\n                        formControlName=\"contextPath\"\n                      />\n                    </div>\n                  </c8y-form-group>\n                  <div class=\"row\">\n                    <div\n                      class=\"col-sm-4 m-b-16 flex-auto\"\n                      *ngIf=\"application.manifest.version\"\n                      data-cy=\"application-detail--version\"\n                    >\n                      <label>{{ 'Version' | translate }}</label>\n                      <p class=\"form-control-static\">\n                        {{ application.manifest.version }}\n                      </p>\n                    </div>\n                    <div\n                      class=\"col-sm-4 m-b-16 flex-auto\"\n                      *ngIf=\"application.manifest.isolation\"\n                      data-cy=\"application-detail--isolation\"\n                    >\n                      <label>{{ 'Isolation' | translate }}</label>\n                      <p class=\"form-control-static\">\n                        <span *ngIf=\"singleTenant\">\n                          <i\n                            class=\"c8y-icon-duocolor h4\"\n                            [c8yIcon]=\"'c8y-enterprise'\"\n                          ></i>\n                          {{ 'Single tenant' | translate }}\n                        </span>\n                        <span *ngIf=\"!singleTenant\">\n                          <i\n                            class=\"c8y-icon-duocolor icon-32\"\n                            [c8yIcon]=\"'c8y-sub-tenants'\"\n                          ></i>\n                          {{ 'Multi tenant' | translate }}\n                        </span>\n                      </p>\n                    </div>\n                    <div\n                      class=\"col-sm-4 m-b-16 flex-auto\"\n                      *ngIf=\"application.manifest.isolation\"\n                      data-cy=\"application-detail--billing-mode\"\n                    >\n                      <label>{{ 'Billing mode' | translate }}</label>\n                      <p class=\"form-control-static\">\n                        <span\n                          [tooltip]=\"'Resources usage assigned to: Owner' | translate\"\n                          *ngIf=\"subscription\"\n                        >\n                          {{ 'Subscription' | translate }}\n                        </span>\n                        <span\n                          [tooltip]=\"'Resources usage assigned to: Subscriber | translate'\"\n                          *ngIf=\"!subscription && singleTenant\"\n                        >\n                          {{ 'Resources' | translate }}\n                        </span>\n                        <span\n                          [tooltip]=\"'Resources usage assigned to: Owner' | translate\"\n                          *ngIf=\"!subscription && !singleTenant\"\n                        >\n                          {{ 'Resources' | translate }}\n                        </span>\n                      </p>\n                    </div>\n                  </div>\n\n                  <div\n                    class=\"legend form-block m-t-40\"\n                    *ngIf=\"application.manifest.provider\"\n                  >\n                    {{ 'Provider' | translate }}\n                  </div>\n                  <div\n                    class=\"list-inline\"\n                    *ngIf=\"application.manifest.provider\"\n                    data-cy=\"application-detail--provider\"\n                  >\n                    <div *ngIf=\"application.manifest.provider.name\">\n                      <div class=\"col-sm-4 m-b-16\">\n                        <label>{{ 'Name' | translate }}</label>\n                        <p class=\"form-control-static\">\n                          {{ application.manifest.provider.name }}\n                        </p>\n                      </div>\n                    </div>\n                    <div *ngIf=\"application.manifest.provider.domain\">\n                      <div class=\"col-sm-4 m-b-16\">\n                        <label>{{ 'Domain' | translate }}</label>\n                        <p class=\"form-control-static\">\n                          {{ application.manifest.provider.domain }}\n                        </p>\n                      </div>\n                    </div>\n                    <div *ngIf=\"application.manifest.provider.support\">\n                      <div class=\"col-sm-4 m-b-16\">\n                        <label>{{ 'Support' | translate }}</label>\n                        <p class=\"form-control-static\">\n                          {{ application.manifest.provider.support }}\n                        </p>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n\n                <div *ngSwitchCase=\"'EXTERNAL'\">\n                  <c8y-form-group>\n                    <label>{{ 'External URL' | translate }}</label>\n                    <input\n                      class=\"form-control\"\n                      placeholder=\"{{ 'e.g.' | translate }} http://www.example.com/\"\n                      name=\"externalUrl\"\n                      type=\"url\"\n                      required\n                      [pattern]=\"'^(?!javascript:).+'\"\n                      [readOnly]=\"!isOwner\"\n                      formControlName=\"externalUrl\"\n                    />\n                    <c8y-messages>\n                      <c8y-message\n                        [name]=\"'pattern'\"\n                        [text]=\"'Valid URL required.' | translate\"\n                      ></c8y-message>\n                    </c8y-messages>\n                  </c8y-form-group>\n                </div>\n\n                <div *ngIf=\"isOwner && !isCustomMicroservice\">\n                  <label>{{ 'Select icon' | translate }}</label>\n                  <c8y-icon-selector-wrapper\n                    name=\"icon\"\n                    formControlName=\"icon\"\n                  ></c8y-icon-selector-wrapper>\n                </div>\n              </div>\n            </div>\n          </div>\n          <ng-container *ngIf=\"isCustomMicroservice\">\n            <div\n              class=\"d-contents\"\n              *ngIf=\"!isLoading\"\n            >\n              <c8y-upload-archive\n                [(application)]=\"application\"\n                (refresh)=\"onNewArchive()\"\n              ></c8y-upload-archive>\n            </div>\n          </ng-container>\n          <div\n            class=\"card-footer separator\"\n            *ngIf=\"application && !!isOwner && hasAdminPermissions\"\n          >\n            <button\n              class=\"btn btn-default\"\n              title=\"{{ 'Cancel' | translate }}\"\n              type=\"button\"\n              (click)=\"cancel()\"\n            >\n              {{ 'Cancel' | translate }}\n            </button>\n            <button\n              class=\"btn btn-danger\"\n              title=\"{{ 'Delete' | translate }}\"\n              type=\"button\"\n              (click)=\"delete()\"\n              *ngIf=\"canDelete\"\n            >\n              {{ 'Delete' | translate }}\n            </button>\n            <button\n              class=\"btn btn-primary btn-form\"\n              title=\"{{ 'Save' | translate }}\"\n              type=\"submit\"\n              [disabled]=\"!application.type || formGroup.invalid || formGroup.pristine\"\n            >\n              {{ 'Save' | translate }}\n            </button>\n          </div>\n        </div>\n      </form>\n\n      <div\n        class=\"content-fullpage d-flex d-col bg-level-1\"\n        *ngIf=\"isActivityLogSupported\"\n      >\n        <div class=\"card-header separator\">\n          <div\n            class=\"card-title\"\n            translate\n          >\n            Activity log\n          </div>\n          <div class=\"m-l-auto\">\n            <button\n              class=\"btn btn-link btn-sm\"\n              title=\"{{ 'Reload' | translate }}\"\n              type=\"button\"\n              (click)=\"load()\"\n            >\n              <i\n                c8yIcon=\"refresh\"\n                [ngClass]=\"{ 'icon-spin': isLoading }\"\n              ></i>\n              {{ 'Reload' | translate }}\n            </button>\n          </div>\n        </div>\n        <div\n          class=\"p-16 text-center\"\n          *ngIf=\"isLoading\"\n        >\n          <c8y-loading></c8y-loading>\n        </div>\n        <c8y-activity-log\n          class=\"d-contents\"\n          *ngIf=\"!isLoading\"\n          [hasAdminPermissions]=\"hasAdminPermissions\"\n          [application]=\"application\"\n        ></c8y-activity-log>\n      </div>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "component", type: TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: AppIconComponent, selector: "c8y-app-icon", inputs: ["contextPath", "name", "app"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: TextareaAutoresizeDirective, selector: "[c8y-textarea-autoresize]" }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { 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: PropertiesListComponent, selector: "c8y-properties-list", inputs: ["properties", "title", "icon", "data", "groups", "noParse", "emptyLabel"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "directive", type: NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage"] }, { kind: "directive", type: MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "component", type: IconSelectorWrapperComponent, selector: "c8y-icon-selector-wrapper", inputs: ["canRemoveIcon", "selectedIcon", "iconSize"], outputs: ["onSelect"] }, { kind: "component", type: UploadArchiveComponent, selector: "c8y-upload-archive", inputs: ["application", "uploadNewVersion", "preUploadCallback"], outputs: ["applicationChange", "refresh"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "component", type: ActivityLogComponent, selector: "c8y-activity-log", inputs: ["application", "hasAdminPermissions"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: HumanizeAppNamePipe, name: "humanizeAppName" }, { kind: "pipe", type: DatePipe, name: "c8yDate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ApplicationPropertiesComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-application-properties', standalone: false, template: "<c8y-title>{{ application | humanizeAppName | async }}</c8y-title>\n\n<c8y-breadcrumb *ngIf=\"!isMicroservice\">\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-modules'\"\n    [label]=\"'Applications' | translate\"\n    [path]=\"'ecosystem/application/applications'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"breadcrumbConfig?.icon\"\n    *ngIf=\"isFeature\"\n    [label]=\"breadcrumbConfig?.label\"\n    [path]=\"breadcrumbConfig?.path\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"application | humanizeAppName | async\"></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"'Properties' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-breadcrumb *ngIf=\"isMicroservice\">\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"breadcrumbConfig?.icon\"\n    [label]=\"breadcrumbConfig?.label\"\n    [path]=\"breadcrumbConfig?.path\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"application | humanizeAppName | async\"></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"'Properties' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<div class=\"row\">\n  <div [ngClass]=\"{ 'col-md-8': !isActivityLogSupported, 'col-md-12': isActivityLogSupported }\">\n    <div\n      class=\"card content-fullpage\"\n      *ngIf=\"application\"\n      [ngClass]=\"{ 'd-grid grid__col--7-5--md': isActivityLogSupported }\"\n    >\n      <form\n        class=\"d-flex d-col content-fullpage\"\n        (ngSubmit)=\"formGroup.valid && save(formGroup.value)\"\n        [formGroup]=\"formGroup\"\n        novalidate\n      >\n        <div\n          class=\"d-contents\"\n          *ngIf=\"!isLoading\"\n        >\n          <div class=\"card-block separator-bottom large-padding flex-no-shrink\">\n            <div class=\"d-flex-md a-i-start text-center text-left-md\">\n              <c8y-app-icon\n                class=\"icon-48\"\n                *ngIf=\"!isPackage && !isFeature && !isMicroservice && !isExternal\"\n                [app]=\"application\"\n                [contextPath]=\"application.contextPath\"\n                [name]=\"application.name\"\n              ></c8y-app-icon>\n              <i\n                class=\"icon-48\"\n                c8yIcon=\"big-parcel\"\n                *ngIf=\"isPackage\"\n              ></i>\n              <i\n                class=\"icon-48\"\n                c8yIcon=\"tab\"\n                *ngIf=\"isFeature\"\n              ></i>\n              <i\n                class=\"icon-48\"\n                c8yIcon=\"microchip\"\n                *ngIf=\"isMicroservice\"\n              ></i>\n              <i\n                class=\"icon-48\"\n                c8yIcon=\"globe1\"\n                *ngIf=\"isExternal\"\n              ></i>\n\n              <div class=\"p-t-md-16 p-l-md-16 p-r-md-32 flex-grow\">\n                <p class=\"h4 text-medium m-b-8\">{{ application | humanizeAppName | async }}</p>\n                <p *ngIf=\"!isOwner\">\n                  <em class=\"text-muted\">\n                    {{\n                      formGroup?.controls?.description?.value || (noDescriptionLabel | translate)\n                    }}\n                  </em>\n                </p>\n                <div\n                  class=\"form-group m-b-0\"\n                  *ngIf=\"isOwner\"\n                >\n                  <label\n                    class=\"editable\"\n                    [ngClass]=\"{ updated: formGroup?.controls?.description?.dirty }\"\n                  >\n                    <textarea\n                      class=\"form-control no-resize\"\n                      placeholder=\"{{ noDescriptionLabel | translate }}\"\n                      name=\"description\"\n                      c8y-textarea-autoresize\n                      formControlName=\"description\"\n                    ></textarea>\n                  </label>\n                </div>\n              </div>\n              <div class=\"text-right-md m-t-4\">\n                <span\n                  class=\"label\"\n                  [ngClass]=\"appState?.class\"\n                >\n                  {{ appState?.label | translate }}\n                </span>\n                <div\n                  class=\"fit-w m-t-2\"\n                  *ngIf=\"application.manifest?.version\"\n                  data-cy=\"application-detail--version\"\n                >\n                  <label\n                    class=\"text-label-small\"\n                    translate\n                  >\n                    Version:\n                  </label>\n                  <small class=\"p-l-4 text-bold\">{{ application.manifest?.version }}</small>\n                </div>\n                <div\n                  class=\"fit-w m-t-2\"\n                  *ngIf=\"!isUnpacked\"\n                >\n                  <label\n                    class=\"text-label-small\"\n                    translate\n                  >\n                    Creation time:\n                  </label>\n                  <small class=\"p-l-4 text-bold\">\n                    {{ (binaryMo?.creationTime | c8yDate) || '---' }}\n                  </small>\n                </div>\n                <div class=\"m-t-8\">\n                  <button\n                    class=\"btn btn-default btn-sm\"\n                    [attr.aria-label]=\"\n                      'There\\'s a newer version available, click to update' | translate\n                    \"\n                    tooltip=\"{{\n                      'There\\'s a newer version available, click to update' | translate\n                    }}\"\n                    placement=\"top\"\n                    type=\"button\"\n                    *ngIf=\"isUpdateAvailable\"\n                    (click)=\"updateToLatestVersion()\"\n                    [delay]=\"300\"\n                  >\n                    <i [c8yIcon]=\"'installing-updates'\"></i>\n                    {{ 'Update available' | translate }}\n                  </button>\n                  <button\n                    class=\"btn btn-default btn-sm\"\n                    title=\"{{ 'Open' | translate }}\"\n                    type=\"button\"\n                    (click)=\"openApp(application)\"\n                    [disabled]=\"disableOpenInBrowser\"\n                    *ngIf=\"canOpenInBrowser\"\n                  >\n                    <i [c8yIcon]=\"'external-link'\"></i>\n                    {{ 'Open' | translate }}\n                  </button>\n                  <div *ngIf=\"canOpenInBrowser && disableOpenInBrowser\">\n                    <small\n                      class=\"text-muted\"\n                      translate\n                    >\n                      The application is overwritten by a custom application sharing the same path\n                    </small>\n                  </div>\n                  <span *ngIf=\"isCustomMicroservice\">\n                    <button\n                      class=\"btn btn-default btn-sm\"\n                      title=\"{{ 'Subscribe' | translate }}\"\n                      type=\"button\"\n                      (click)=\"subscribe()\"\n                      *ngIf=\"!isSubscribed\"\n                    >\n                      <i [c8yIcon]=\"'check-circle-o'\"></i>\n                      {{ 'Subscribe' | translate }}\n                    </button>\n                    <button\n                      class=\"btn btn-default btn-sm\"\n                      title=\"{{ 'Unsubscribe' | translate }}\"\n                      type=\"button\"\n                      (click)=\"unsubscribe()\"\n                      *ngIf=\"isSubscribed\"\n                    >\n                      <i [c8yIcon]=\"'minus-circle'\"></i>\n                      {{ 'Unsubscribe' | translate }}\n                    </button>\n                  </span>\n                </div>\n              </div>\n            </div>\n          </div>\n          <div class=\"inner-scroll bg-level-0 flex-grow\">\n            <div class=\"card-block large-padding\">\n              <div\n                class=\"row p-16\"\n                *ngIf=\"isPackage\"\n              >\n                <c8y-properties-list\n                  icon=\"info\"\n                  [title]=\"'Package details' | translate\"\n                  [data]=\"application.manifest\"\n                  [properties]=\"packageProperties\"\n                  [emptyLabel]=\"'---'\"\n                ></c8y-properties-list>\n              </div>\n              <div\n                class=\"row p-16\"\n                *ngIf=\"sourcePackage\"\n              >\n                <c8y-properties-list\n                  icon=\"info\"\n                  [title]=\"'Source package information' | translate\"\n                  [data]=\"sourcePackage.manifest\"\n                  [properties]=\"packageProperties\"\n                  [emptyLabel]=\"'---'\"\n                ></c8y-properties-list>\n              </div>\n              <div class=\"row\">\n                <div class=\"col-sm-5\">\n                  <c8y-form-group>\n                    <label for=\"appId\">ID</label>\n                    <input\n                      class=\"form-control\"\n                      id=\"appId\"\n                      name=\"id\"\n                      type=\"text\"\n                      autocomplete=\"off\"\n                      [readonly]=\"true\"\n                      formControlName=\"id\"\n                    />\n                  </c8y-form-group>\n                </div>\n                <div class=\"col-sm-7\">\n                  <c8y-form-group>\n                    <label>{{ 'Name' | translate }}</label>\n                    <input\n                      class=\"form-control\"\n                      placeholder=\"{{ 'e.g. My application' | translate }}\"\n                      name=\"name\"\n                      type=\"text\"\n                      required\n                      [readonly]=\"!isOwner\"\n                      formControlName=\"name\"\n                    />\n                  </c8y-form-group>\n                </div>\n              </div>\n\n              <div class=\"row\">\n                <div class=\"col-sm-5\">\n                  <c8y-form-group>\n                    <label>{{ 'Application key' | translate }}</label>\n                    <input\n                      class=\"form-control\"\n                      placeholder=\"{{ 'e.g. my-application-key' | translate }}\"\n                      name=\"key\"\n                      type=\"text\"\n                      required\n                      [readonly]=\"application.id || !isOwner\"\n                      formControlName=\"key\"\n                    />\n                  </c8y-form-group>\n                </div>\n\n                <div class=\"col-sm-7\" data-cy=\"application-detail--type\">\n                  <c8y-form-group>\n                    <label>{{ 'Type' | translate }}</label>\n                    <div>\n                      <div *ngIf=\"application.id\">\n                        <p class=\"form-control-static\">\n                          <i [c8yIcon]=\"iconMap[application.type]\"></i>\n                          <span>\n                            {{ application.type | translate }}\n                          </span>\n                        </p>\n                      </div>\n                    </div>\n                  </c8y-form-group>\n                </div>\n              </div>\n\n              <div [ngSwitch]=\"application.type\">\n                <div *ngSwitchCase=\"'HOSTED'\">\n                  <c8y-form-group>\n                    <label>{{ 'Path' | translate }}</label>\n                    <div class=\"input-group\">\n                      <span class=\"input-group-addon\">/apps/</span>\n                      <input\n                        class=\"form-control\"\n                        placeholder=\"{{ 'e.g. my-application`used in URL`' | translate }}\"\n                        name=\"contextPath\"\n                        type=\"text\"\n                        required\n                        [readOnly]=\"application.id || !isOwner\"\n                        formControlName=\"contextPath\"\n                      />\n                    </div>\n                  </c8y-form-group>\n                </div>\n\n                <div *ngSwitchCase=\"'MICROSERVICE'\">\n                  <c8y-form-group>\n                    <label>{{ 'Path' | translate }}</label>\n                    <div class=\"input-group\">\n                      <span class=\"input-group-addon\">/service/</span>\n                      <input\n                        class=\"form-control\"\n                        placeholder=\"{{ 'e.g. my-microservice`used in URL`' | translate }}\"\n                        name=\"contextPath\"\n                        type=\"text\"\n                        required\n                        [readOnly]=\"application.id || !isOwner\"\n                        formControlName=\"contextPath\"\n                      />\n                    </div>\n                  </c8y-form-group>\n                  <div class=\"row\">\n                    <div\n                      class=\"col-sm-4 m-b-16 flex-auto\"\n                      *ngIf=\"application.manifest.version\"\n                      data-cy=\"application-detail--version\"\n                    >\n                      <label>{{ 'Version' | translate }}</label>\n                      <p class=\"form-control-static\">\n                        {{ application.manifest.version }}\n                      </p>\n                    </div>\n                    <div\n                      class=\"col-sm-4 m-b-16 flex-auto\"\n                      *ngIf=\"application.manifest.isolation\"\n                      data-cy=\"application-detail--isolation\"\n                    >\n                      <label>{{ 'Isolation' | translate }}</label>\n                      <p class=\"form-control-static\">\n                        <span *ngIf=\"singleTenant\">\n                          <i\n                            class=\"c8y-icon-duocolor h4\"\n                            [c8yIcon]=\"'c8y-enterprise'\"\n                          ></i>\n                          {{ 'Single tenant' | translate }}\n                        </span>\n                        <span *ngIf=\"!singleTenant\">\n                          <i\n                            class=\"c8y-icon-duocolor icon-32\"\n                            [c8yIcon]=\"'c8y-sub-tenants'\"\n                          ></i>\n                          {{ 'Multi tenant' | translate }}\n                        </span>\n                      </p>\n                    </div>\n                    <div\n                      class=\"col-sm-4 m-b-16 flex-auto\"\n                      *ngIf=\"application.manifest.isolation\"\n                      data-cy=\"application-detail--billing-mode\"\n                    >\n                      <label>{{ 'Billing mode' | translate }}</label>\n                      <p class=\"form-control-static\">\n                        <span\n                          [tooltip]=\"'Resources usage assigned to: Owner' | translate\"\n                          *ngIf=\"subscription\"\n                        >\n                          {{ 'Subscription' | translate }}\n                        </span>\n                        <span\n                          [tooltip]=\"'Resources usage assigned to: Subscriber | translate'\"\n                          *ngIf=\"!subscription && singleTenant\"\n                        >\n                          {{ 'Resources' | translate }}\n                        </span>\n                        <span\n                          [tooltip]=\"'Resources usage assigned to: Owner' | translate\"\n                          *ngIf=\"!subscription && !singleTenant\"\n                        >\n                          {{ 'Resources' | translate }}\n                        </span>\n                      </p>\n                    </div>\n                  </div>\n\n                  <div\n                    class=\"legend form-block m-t-40\"\n                    *ngIf=\"application.manifest.provider\"\n                  >\n                    {{ 'Provider' | translate }}\n                  </div>\n                  <div\n                    class=\"list-inline\"\n                    *ngIf=\"application.manifest.provider\"\n                    data-cy=\"application-detail--provider\"\n                  >\n                    <div *ngIf=\"application.manifest.provider.name\">\n                      <div class=\"col-sm-4 m-b-16\">\n                        <label>{{ 'Name' | translate }}</label>\n                        <p class=\"form-control-static\">\n                          {{ application.manifest.provider.name }}\n                        </p>\n                      </div>\n                    </div>\n                    <div *ngIf=\"application.manifest.provider.domain\">\n                      <div class=\"col-sm-4 m-b-16\">\n                        <label>{{ 'Domain' | translate }}</label>\n                        <p class=\"form-control-static\">\n                          {{ application.manifest.provider.domain }}\n                        </p>\n                      </div>\n                    </div>\n                    <div *ngIf=\"application.manifest.provider.support\">\n                      <div class=\"col-sm-4 m-b-16\">\n                        <label>{{ 'Support' | translate }}</label>\n                        <p class=\"form-control-static\">\n                          {{ application.manifest.provider.support }}\n                        </p>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n\n                <div *ngSwitchCase=\"'EXTERNAL'\">\n                  <c8y-form-group>\n                    <label>{{ 'External URL' | translate }}</label>\n                    <input\n                      class=\"form-control\"\n                      placeholder=\"{{ 'e.g.' | translate }} http://www.example.com/\"\n                      name=\"externalUrl\"\n                      type=\"url\"\n                      required\n                      [pattern]=\"'^(?!javascript:).+'\"\n                      [readOnly]=\"!isOwner\"\n                      formControlName=\"externalUrl\"\n                    />\n                    <c8y-messages>\n                      <c8y-message\n                        [name]=\"'pattern'\"\n                        [text]=\"'Valid URL required.' | translate\"\n                      ></c8y-message>\n                    </c8y-messages>\n                  </c8y-form-group>\n                </div>\n\n                <div *ngIf=\"isOwner && !isCustomMicroservice\">\n                  <label>{{ 'Select icon' | translate }}</label>\n                  <c8y-icon-selector-wrapper\n                    name=\"icon\"\n                    formControlName=\"icon\"\n                  ></c8y-icon-selector-wrapper>\n                </div>\n              </div>\n            </div>\n          </div>\n          <ng-container *ngIf=\"isCustomMicroservice\">\n            <div\n              class=\"d-contents\"\n              *ngIf=\"!isLoading\"\n            >\n              <c8y-upload-archive\n                [(application)]=\"application\"\n                (refresh)=\"onNewArchive()\"\n              ></c8y-upload-archive>\n            </div>\n          </ng-container>\n          <div\n            class=\"card-footer separator\"\n            *ngIf=\"application && !!isOwner && hasAdminPermissions\"\n          >\n            <button\n              class=\"btn btn-default\"\n              title=\"{{ 'Cancel' | translate }}\"\n              type=\"button\"\n              (click)=\"cancel()\"\n            >\n              {{ 'Cancel' | translate }}\n            </button>\n            <button\n              class=\"btn btn-danger\"\n              title=\"{{ 'Delete' | translate }}\"\n              type=\"button\"\n              (click)=\"delete()\"\n              *ngIf=\"canDelete\"\n            >\n              {{ 'Delete' | translate }}\n            </button>\n            <button\n              class=\"btn btn-primary btn-form\"\n              title=\"{{ 'Save' | translate }}\"\n              type=\"submit\"\n              [disabled]=\"!application.type || formGroup.invalid || formGroup.pristine\"\n            >\n              {{ 'Save' | translate }}\n            </button>\n          </div>\n        </div>\n      </form>\n\n      <div\n        class=\"content-fullpage d-flex d-col bg-level-1\"\n        *ngIf=\"isActivityLogSupported\"\n      >\n        <div class=\"card-header separator\">\n          <div\n            class=\"card-title\"\n            translate\n          >\n            Activity log\n          </div>\n          <div class=\"m-l-auto\">\n            <button\n              class=\"btn btn-link btn-sm\"\n              title=\"{{ 'Reload' | translate }}\"\n              type=\"button\"\n              (click)=\"load()\"\n            >\n              <i\n                c8yIcon=\"refresh\"\n                [ngClass]=\"{ 'icon-spin': isLoading }\"\n              ></i>\n              {{ 'Reload' | translate }}\n            </button>\n          </div>\n        </div>\n        <div\n          class=\"p-16 text-center\"\n          *ngIf=\"isLoading\"\n        >\n          <c8y-loading></c8y-loading>\n        </div>\n        <c8y-activity-log\n          class=\"d-contents\"\n          *ngIf=\"!isLoading\"\n          [hasAdminPermissions]=\"hasAdminPermissions\"\n          [application]=\"application\"\n        ></c8y-activity-log>\n      </div>\n    </div>\n  </div>\n</div>\n" }]
-        }], ctorParameters: () => [{ type: i1$2.ActivatedRoute }, { type: i1.EcosystemService }, { type: i1$2.Router }, { type: i2$1.FormBuilder }, { type: i4.ApplicationService }, { type: i2.AlertService }, { type: i4.InventoryService }, { type: i2.Permissions }, { type: i2.ModalService }, { type: i6.TranslateService }, { type: i1$1.BsModalService }, { type: i2.GainsightService }] });
+            args: [{ selector: 'c8y-application-properties', imports: [
+                        TitleComponent,
+                        NgIf,
+                        BreadcrumbComponent,
+                        BreadcrumbItemComponent,
+                        NgClass,
+                        FormsModule,
+                        ReactiveFormsModule,
+                        AppIconComponent,
+                        IconDirective,
+                        TextareaAutoresizeDirective,
+                        C8yTranslateDirective,
+                        TooltipDirective,
+                        PropertiesListComponent,
+                        FormGroupComponent,
+                        RequiredInputPlaceholderDirective,
+                        NgSwitch,
+                        NgSwitchCase,
+                        MessagesComponent,
+                        MessageDirective,
+                        IconSelectorWrapperComponent,
+                        UploadArchiveComponent,
+                        LoadingComponent,
+                        ActivityLogComponent,
+                        C8yTranslatePipe,
+                        AsyncPipe,
+                        HumanizeAppNamePipe,
+                        DatePipe
+                    ], template: "<c8y-title>{{ application | humanizeAppName | async }}</c8y-title>\n\n<c8y-breadcrumb *ngIf=\"!isMicroservice\">\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-modules'\"\n    [label]=\"'Applications' | translate\"\n    [path]=\"'ecosystem/application/applications'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"breadcrumbConfig?.icon\"\n    *ngIf=\"isFeature\"\n    [label]=\"breadcrumbConfig?.label\"\n    [path]=\"breadcrumbConfig?.path\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"application | humanizeAppName | async\"></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"'Properties' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-breadcrumb *ngIf=\"isMicroservice\">\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"breadcrumbConfig?.icon\"\n    [label]=\"breadcrumbConfig?.label\"\n    [path]=\"breadcrumbConfig?.path\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"application | humanizeAppName | async\"></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"'Properties' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<div class=\"row\">\n  <div [ngClass]=\"{ 'col-md-8': !isActivityLogSupported, 'col-md-12': isActivityLogSupported }\">\n    <div\n      class=\"card content-fullpage\"\n      *ngIf=\"application\"\n      [ngClass]=\"{ 'd-grid grid__col--7-5--md': isActivityLogSupported }\"\n    >\n      <form\n        class=\"d-flex d-col content-fullpage\"\n        (ngSubmit)=\"formGroup.valid && save(formGroup.value)\"\n        [formGroup]=\"formGroup\"\n        novalidate\n      >\n        <div\n          class=\"d-contents\"\n          *ngIf=\"!isLoading\"\n        >\n          <div class=\"card-block separator-bottom large-padding flex-no-shrink\">\n            <div class=\"d-flex-md a-i-start text-center text-left-md\">\n              <c8y-app-icon\n                class=\"icon-48\"\n                *ngIf=\"!isPackage && !isFeature && !isMicroservice && !isExternal\"\n                [app]=\"application\"\n                [contextPath]=\"application.contextPath\"\n                [name]=\"application.name\"\n              ></c8y-app-icon>\n              <i\n                class=\"icon-48\"\n                c8yIcon=\"big-parcel\"\n                *ngIf=\"isPackage\"\n              ></i>\n              <i\n                class=\"icon-48\"\n                c8yIcon=\"tab\"\n                *ngIf=\"isFeature\"\n              ></i>\n              <i\n                class=\"icon-48\"\n                c8yIcon=\"microchip\"\n                *ngIf=\"isMicroservice\"\n              ></i>\n              <i\n                class=\"icon-48\"\n                c8yIcon=\"globe1\"\n                *ngIf=\"isExternal\"\n              ></i>\n\n              <div class=\"p-t-md-16 p-l-md-16 p-r-md-32 flex-grow\">\n                <p class=\"h4 text-medium m-b-8\">{{ application | humanizeAppName | async }}</p>\n                <p *ngIf=\"!isOwner\">\n                  <em class=\"text-muted\">\n                    {{\n                      formGroup?.controls?.description?.value || (noDescriptionLabel | translate)\n                    }}\n                  </em>\n                </p>\n                <div\n                  class=\"form-group m-b-0\"\n                  *ngIf=\"isOwner\"\n                >\n                  <label\n                    class=\"editable\"\n                    [ngClass]=\"{ updated: formGroup?.controls?.description?.dirty }\"\n                  >\n                    <textarea\n                      class=\"form-control no-resize\"\n                      placeholder=\"{{ noDescriptionLabel | translate }}\"\n                      name=\"description\"\n                      c8y-textarea-autoresize\n                      formControlName=\"description\"\n                    ></textarea>\n                  </label>\n                </div>\n              </div>\n              <div class=\"text-right-md m-t-4\">\n                <span\n                  class=\"label\"\n                  [ngClass]=\"appState?.class\"\n                >\n                  {{ appState?.label | translate }}\n                </span>\n                <div\n                  class=\"fit-w m-t-2\"\n                  *ngIf=\"application.manifest?.version\"\n                  data-cy=\"application-detail--version\"\n                >\n                  <label\n                    class=\"text-label-small\"\n                    translate\n                  >\n                    Version:\n                  </label>\n                  <small class=\"p-l-4 text-bold\">{{ application.manifest?.version }}</small>\n                </div>\n                <div\n                  class=\"fit-w m-t-2\"\n                  *ngIf=\"!isUnpacked\"\n                >\n                  <label\n                    class=\"text-label-small\"\n                    translate\n                  >\n                    Creation time:\n                  </label>\n                  <small class=\"p-l-4 text-bold\">\n                    {{ (binaryMo?.creationTime | c8yDate) || '---' }}\n                  </small>\n                </div>\n                <div class=\"m-t-8\">\n                  <button\n                    class=\"btn btn-default btn-sm\"\n                    [attr.aria-label]=\"\n                      'There\\'s a newer version available, click to update' | translate\n                    \"\n                    tooltip=\"{{\n                      'There\\'s a newer version available, click to update' | translate\n                    }}\"\n                    placement=\"top\"\n                    type=\"button\"\n                    *ngIf=\"isUpdateAvailable\"\n                    (click)=\"updateToLatestVersion()\"\n                    [delay]=\"300\"\n                  >\n                    <i [c8yIcon]=\"'installing-updates'\"></i>\n                    {{ 'Update available' | translate }}\n                  </button>\n                  <button\n                    class=\"btn btn-default btn-sm\"\n                    title=\"{{ 'Open' | translate }}\"\n                    type=\"button\"\n                    (click)=\"openApp(application)\"\n                    [disabled]=\"disableOpenInBrowser\"\n                    *ngIf=\"canOpenInBrowser\"\n                  >\n                    <i [c8yIcon]=\"'external-link'\"></i>\n                    {{ 'Open' | translate }}\n                  </button>\n                  <div *ngIf=\"canOpenInBrowser && disableOpenInBrowser\">\n                    <small\n                      class=\"text-muted\"\n                      translate\n                    >\n                      The application is overwritten by a custom application sharing the same path\n                    </small>\n                  </div>\n                  <span *ngIf=\"isCustomMicroservice\">\n                    <button\n                      class=\"btn btn-default btn-sm\"\n                      title=\"{{ 'Subscribe' | translate }}\"\n                      type=\"button\"\n                      (click)=\"subscribe()\"\n                      *ngIf=\"!isSubscribed\"\n                    >\n                      <i [c8yIcon]=\"'check-circle-o'\"></i>\n                      {{ 'Subscribe' | translate }}\n                    </button>\n                    <button\n                      class=\"btn btn-default btn-sm\"\n                      title=\"{{ 'Unsubscribe' | translate }}\"\n                      type=\"button\"\n                      (click)=\"unsubscribe()\"\n                      *ngIf=\"isSubscribed\"\n                    >\n                      <i [c8yIcon]=\"'minus-circle'\"></i>\n                      {{ 'Unsubscribe' | translate }}\n                    </button>\n                  </span>\n                </div>\n              </div>\n            </div>\n          </div>\n          <div class=\"inner-scroll bg-level-0 flex-grow\">\n            <div class=\"card-block large-padding\">\n              <div\n                class=\"row p-16\"\n                *ngIf=\"isPackage\"\n              >\n                <c8y-properties-list\n                  icon=\"info\"\n                  [title]=\"'Package details' | translate\"\n                  [data]=\"application.manifest\"\n                  [properties]=\"packageProperties\"\n                  [emptyLabel]=\"'---'\"\n                ></c8y-properties-list>\n              </div>\n              <div\n                class=\"row p-16\"\n                *ngIf=\"sourcePackage\"\n              >\n                <c8y-properties-list\n                  icon=\"info\"\n                  [title]=\"'Source package information' | translate\"\n                  [data]=\"sourcePackage.manifest\"\n                  [properties]=\"packageProperties\"\n                  [emptyLabel]=\"'---'\"\n                ></c8y-properties-list>\n              </div>\n              <div class=\"row\">\n                <div class=\"col-sm-5\">\n                  <c8y-form-group>\n                    <label for=\"appId\">ID</label>\n                    <input\n                      class=\"form-control\"\n                      id=\"appId\"\n                      name=\"id\"\n                      type=\"text\"\n                      autocomplete=\"off\"\n                      [readonly]=\"true\"\n                      formControlName=\"id\"\n                    />\n                  </c8y-form-group>\n                </div>\n                <div class=\"col-sm-7\">\n                  <c8y-form-group>\n                    <label>{{ 'Name' | translate }}</label>\n                    <input\n                      class=\"form-control\"\n                      placeholder=\"{{ 'e.g. My application' | translate }}\"\n                      name=\"name\"\n                      type=\"text\"\n                      required\n                      [readonly]=\"!isOwner\"\n                      formControlName=\"name\"\n                    />\n                  </c8y-form-group>\n                </div>\n              </div>\n\n              <div class=\"row\">\n                <div class=\"col-sm-5\">\n                  <c8y-form-group>\n                    <label>{{ 'Application key' | translate }}</label>\n                    <input\n                      class=\"form-control\"\n                      placeholder=\"{{ 'e.g. my-application-key' | translate }}\"\n                      name=\"key\"\n                      type=\"text\"\n                      required\n                      [readonly]=\"application.id || !isOwner\"\n                      formControlName=\"key\"\n                    />\n                  </c8y-form-group>\n                </div>\n\n                <div class=\"col-sm-7\" data-cy=\"application-detail--type\">\n                  <c8y-form-group>\n                    <label>{{ 'Type' | translate }}</label>\n                    <div>\n                      <div *ngIf=\"application.id\">\n                        <p class=\"form-control-static\">\n                          <i [c8yIcon]=\"iconMap[application.type]\"></i>\n                          <span>\n                            {{ application.type | translate }}\n                          </span>\n                        </p>\n                      </div>\n                    </div>\n                  </c8y-form-group>\n                </div>\n              </div>\n\n              <div [ngSwitch]=\"application.type\">\n                <div *ngSwitchCase=\"'HOSTED'\">\n                  <c8y-form-group>\n                    <label>{{ 'Path' | translate }}</label>\n                    <div class=\"input-group\">\n                      <span class=\"input-group-addon\">/apps/</span>\n                      <input\n                        class=\"form-control\"\n                        placeholder=\"{{ 'e.g. my-application`used in URL`' | translate }}\"\n                        name=\"contextPath\"\n                        type=\"text\"\n                        required\n                        [readOnly]=\"application.id || !isOwner\"\n                        formControlName=\"contextPath\"\n                      />\n                    </div>\n                  </c8y-form-group>\n                </div>\n\n                <div *ngSwitchCase=\"'MICROSERVICE'\">\n                  <c8y-form-group>\n                    <label>{{ 'Path' | translate }}</label>\n                    <div class=\"input-group\">\n                      <span class=\"input-group-addon\">/service/</span>\n                      <input\n                        class=\"form-control\"\n                        placeholder=\"{{ 'e.g. my-microservice`used in URL`' | translate }}\"\n                        name=\"contextPath\"\n                        type=\"text\"\n                        required\n                        [readOnly]=\"application.id || !isOwner\"\n                        formControlName=\"contextPath\"\n                      />\n                    </div>\n                  </c8y-form-group>\n                  <div class=\"row\">\n                    <div\n                      class=\"col-sm-4 m-b-16 flex-auto\"\n                      *ngIf=\"application.manifest.version\"\n                      data-cy=\"application-detail--version\"\n                    >\n                      <label>{{ 'Version' | translate }}</label>\n                      <p class=\"form-control-static\">\n                        {{ application.manifest.version }}\n                      </p>\n                    </div>\n                    <div\n                      class=\"col-sm-4 m-b-16 flex-auto\"\n                      *ngIf=\"application.manifest.isolation\"\n                      data-cy=\"application-detail--isolation\"\n                    >\n                      <label>{{ 'Isolation' | translate }}</label>\n                      <p class=\"form-control-static\">\n                        <span *ngIf=\"singleTenant\">\n                          <i\n                            class=\"c8y-icon-duocolor h4\"\n                            [c8yIcon]=\"'c8y-enterprise'\"\n                          ></i>\n                          {{ 'Single tenant' | translate }}\n                        </span>\n                        <span *ngIf=\"!singleTenant\">\n                          <i\n                            class=\"c8y-icon-duocolor icon-32\"\n                            [c8yIcon]=\"'c8y-sub-tenants'\"\n                          ></i>\n                          {{ 'Multi tenant' | translate }}\n                        </span>\n                      </p>\n                    </div>\n                    <div\n                      class=\"col-sm-4 m-b-16 flex-auto\"\n                      *ngIf=\"application.manifest.isolation\"\n                      data-cy=\"application-detail--billing-mode\"\n                    >\n                      <label>{{ 'Billing mode' | translate }}</label>\n                      <p class=\"form-control-static\">\n                        <span\n                          [tooltip]=\"'Resources usage assigned to: Owner' | translate\"\n                          *ngIf=\"subscription\"\n                        >\n                          {{ 'Subscription' | translate }}\n                        </span>\n                        <span\n                          [tooltip]=\"'Resources usage assigned to: Subscriber | translate'\"\n                          *ngIf=\"!subscription && singleTenant\"\n                        >\n                          {{ 'Resources' | translate }}\n                        </span>\n                        <span\n                          [tooltip]=\"'Resources usage assigned to: Owner' | translate\"\n                          *ngIf=\"!subscription && !singleTenant\"\n                        >\n                          {{ 'Resources' | translate }}\n                        </span>\n                      </p>\n                    </div>\n                  </div>\n\n                  <div\n                    class=\"legend form-block m-t-40\"\n                    *ngIf=\"application.manifest.provider\"\n                  >\n                    {{ 'Provider' | translate }}\n                  </div>\n                  <div\n                    class=\"list-inline\"\n                    *ngIf=\"application.manifest.provider\"\n                    data-cy=\"application-detail--provider\"\n                  >\n                    <div *ngIf=\"application.manifest.provider.name\">\n                      <div class=\"col-sm-4 m-b-16\">\n                        <label>{{ 'Name' | translate }}</label>\n                        <p class=\"form-control-static\">\n                          {{ application.manifest.provider.name }}\n                        </p>\n                      </div>\n                    </div>\n                    <div *ngIf=\"application.manifest.provider.domain\">\n                      <div class=\"col-sm-4 m-b-16\">\n                        <label>{{ 'Domain' | translate }}</label>\n                        <p class=\"form-control-static\">\n                          {{ application.manifest.provider.domain }}\n                        </p>\n                      </div>\n                    </div>\n                    <div *ngIf=\"application.manifest.provider.support\">\n                      <div class=\"col-sm-4 m-b-16\">\n                        <label>{{ 'Support' | translate }}</label>\n                        <p class=\"form-control-static\">\n                          {{ application.manifest.provider.support }}\n                        </p>\n                      </div>\n                    </div>\n                  </div>\n                </div>\n\n                <div *ngSwitchCase=\"'EXTERNAL'\">\n                  <c8y-form-group>\n                    <label>{{ 'External URL' | translate }}</label>\n                    <input\n                      class=\"form-control\"\n                      placeholder=\"{{ 'e.g.' | translate }} http://www.example.com/\"\n                      name=\"externalUrl\"\n                      type=\"url\"\n                      required\n                      [pattern]=\"'^(?!javascript:).+'\"\n                      [readOnly]=\"!isOwner\"\n                      formControlName=\"externalUrl\"\n                    />\n                    <c8y-messages>\n                      <c8y-message\n                        [name]=\"'pattern'\"\n                        [text]=\"'Valid URL required.' | translate\"\n                      ></c8y-message>\n                    </c8y-messages>\n                  </c8y-form-group>\n                </div>\n\n                <div *ngIf=\"isOwner && !isCustomMicroservice\">\n                  <label>{{ 'Select icon' | translate }}</label>\n                  <c8y-icon-selector-wrapper\n                    name=\"icon\"\n                    formControlName=\"icon\"\n                  ></c8y-icon-selector-wrapper>\n                </div>\n              </div>\n            </div>\n          </div>\n          <ng-container *ngIf=\"isCustomMicroservice\">\n            <div\n              class=\"d-contents\"\n              *ngIf=\"!isLoading\"\n            >\n              <c8y-upload-archive\n                [(application)]=\"application\"\n                (refresh)=\"onNewArchive()\"\n              ></c8y-upload-archive>\n            </div>\n          </ng-container>\n          <div\n            class=\"card-footer separator\"\n            *ngIf=\"application && !!isOwner && hasAdminPermissions\"\n          >\n            <button\n              class=\"btn btn-default\"\n              title=\"{{ 'Cancel' | translate }}\"\n              type=\"button\"\n              (click)=\"cancel()\"\n            >\n              {{ 'Cancel' | translate }}\n            </button>\n            <button\n              class=\"btn btn-danger\"\n              title=\"{{ 'Delete' | translate }}\"\n              type=\"button\"\n              (click)=\"delete()\"\n              *ngIf=\"canDelete\"\n            >\n              {{ 'Delete' | translate }}\n            </button>\n            <button\n              class=\"btn btn-primary btn-form\"\n              title=\"{{ 'Save' | translate }}\"\n              type=\"submit\"\n              [disabled]=\"!application.type || formGroup.invalid || formGroup.pristine\"\n            >\n              {{ 'Save' | translate }}\n            </button>\n          </div>\n        </div>\n      </form>\n\n      <div\n        class=\"content-fullpage d-flex d-col bg-level-1\"\n        *ngIf=\"isActivityLogSupported\"\n      >\n        <div class=\"card-header separator\">\n          <div\n            class=\"card-title\"\n            translate\n          >\n            Activity log\n          </div>\n          <div class=\"m-l-auto\">\n            <button\n              class=\"btn btn-link btn-sm\"\n              title=\"{{ 'Reload' | translate }}\"\n              type=\"button\"\n              (click)=\"load()\"\n            >\n              <i\n                c8yIcon=\"refresh\"\n                [ngClass]=\"{ 'icon-spin': isLoading }\"\n              ></i>\n              {{ 'Reload' | translate }}\n            </button>\n          </div>\n        </div>\n        <div\n          class=\"p-16 text-center\"\n          *ngIf=\"isLoading\"\n        >\n          <c8y-loading></c8y-loading>\n        </div>\n        <c8y-activity-log\n          class=\"d-contents\"\n          *ngIf=\"!isLoading\"\n          [hasAdminPermissions]=\"hasAdminPermissions\"\n          [application]=\"application\"\n        ></c8y-activity-log>\n      </div>\n    </div>\n  </div>\n</div>\n" }]
+        }], ctorParameters: () => [{ type: i1$2.ActivatedRoute }, { type: i1.EcosystemService }, { type: i1$2.Router }, { type: i3.FormBuilder }, { type: i4.ApplicationService }, { type: i2.AlertService }, { type: i4.InventoryService }, { type: i2.Permissions }, { type: i2.ModalService }, { type: i6.TranslateService }, { type: i1$1.BsModalService }, { type: i2.GainsightService }] });
 
 class ApplicationPropertiesGuard {
     constructor(ecosystemService) {
@@ -1068,13 +738,26 @@ class AddExternalApplicationComponent {
             externalUrl: ['', Validators.required]
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AddExternalApplicationComponent, deps: [{ token: i4.ApplicationService }, { token: i2$1.FormBuilder }, { token: i2.AlertService }, { token: i2.WizardComponent }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: AddExternalApplicationComponent, isStandalone: false, selector: "c8y-add-external-application", ngImport: i0, template: "<form *ngIf=\"!createdApp; else appCreated\" [formGroup]=\"formGroup\" novalidate>\n  <c8y-wizard-header>\n    <i [c8yIcon]=\"'cloud-link'\"></i>\n    <h4 translate id=\"modal-title\">Add external application</h4>\n  </c8y-wizard-header>\n\n  <c8y-wizard-body>\n    <p class=\"p-16 text-medium text-center bg-level-0 separator-bottom sticky-top\">\n      {{ 'Provide external application details' | translate }}\n    </p>\n    <div class=\"modal-body p-t-8\" id=\"modal-body\">\n      <c8y-form-group>\n        <label style=\"text-align: left\">{{ 'Name' | translate }}</label>\n        <input\n          class=\"form-control\"\n          formControlName=\"name\"\n          name=\"name\"\n          placeholder=\"{{ 'e.g. My application' | translate }}\"\n          required\n          type=\"text\"\n        />\n      </c8y-form-group>\n\n      <c8y-form-group>\n        <label style=\"text-align: left\">{{ 'Application key' | translate }}</label>\n        <input\n          class=\"form-control\"\n          formControlName=\"key\"\n          name=\"key\"\n          placeholder=\"{{ 'e.g. my-external-application-key' | translate }}\"\n          required\n          type=\"text\"\n        />\n      </c8y-form-group>\n\n      <c8y-form-group>\n        <label style=\"text-align: left\">{{ 'External URL' | translate }}</label>\n        <input\n          [pattern]=\"'^(?!javascript:).+'\"\n          class=\"form-control\"\n          formControlName=\"externalUrl\"\n          name=\"externalUrl\"\n          placeholder=\"{{ 'e.g.' | translate }} https://www.example.com\"\n          required\n          type=\"url\"\n        />\n      </c8y-form-group>\n    </div>\n  </c8y-wizard-body>\n\n  <c8y-wizard-footer>\n    <button\n      (click)=\"back()\"\n      class=\"btn btn-default\"\n      title=\"{{ 'Back' | translate }}\"\n      translate\n      type=\"button\"\n    >\n      Back\n    </button>\n    <button (click)=\"cancel()\" class=\"btn btn-default\" title=\"{{ 'Cancel' | translate }}\" translate>\n      Cancel\n    </button>\n    <button\n      (click)=\"save(formGroup.value)\"\n      [disabled]=\"formGroup.invalid || formGroup.pristine\"\n      class=\"btn btn-primary btn-form\"\n      title=\"{{ 'Add application' | translate }}\"\n      type=\"button\"\n    >\n      {{ 'Add application' | translate }}\n    </button>\n  </c8y-wizard-footer>\n</form>\n<ng-template #appCreated>\n  <c8y-wizard-body>\n    <div class=\"d-flex d-col j-c-center a-i-center\" style=\"min-height: 324px\">\n      <c8y-operation-result\n        text=\"{{ 'Application created' | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n        type=\"success\"\n        class=\"lead\"\n      ></c8y-operation-result>\n    </div>\n  </c8y-wizard-body>\n  <c8y-wizard-footer>\n    <button (click)=\"done()\" class=\"btn btn-default\" title=\"{{ 'Done' | translate }}\" translate>\n      Done\n    </button>\n    <a\n      (click)=\"$event.stopPropagation()\"\n      [href]=\"formGroup.value.externalUrl\"\n      target=\"_blank\"\n      rel=\"noopener noreferrer\"\n      class=\"btn btn-primary\"\n      title=\"{{ 'Open' | translate }}\"\n    >\n      <i c8yIcon=\"external-link\" class=\"m-r-4\"></i>\n      {{ 'Open' | translate }}\n    </a>\n  </c8y-wizard-footer>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "directive", type: i2$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "component", type: i2.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: i2.RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "component", type: i2.WizardHeaderComponent, selector: "c8y-wizard-header" }, { kind: "component", type: i2.WizardBodyComponent, selector: "c8y-wizard-body" }, { kind: "component", type: i2.WizardFooterComponent, selector: "c8y-wizard-footer" }, { kind: "directive", type: i2$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AddExternalApplicationComponent, deps: [{ token: i4.ApplicationService }, { token: i3.FormBuilder }, { token: i2.AlertService }, { token: i2.WizardComponent }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: AddExternalApplicationComponent, isStandalone: true, selector: "c8y-add-external-application", ngImport: i0, template: "<form *ngIf=\"!createdApp; else appCreated\" [formGroup]=\"formGroup\" novalidate>\n  <c8y-wizard-header>\n    <i [c8yIcon]=\"'cloud-link'\"></i>\n    <h4 translate id=\"modal-title\">Add external application</h4>\n  </c8y-wizard-header>\n\n  <c8y-wizard-body>\n    <p class=\"p-16 text-medium text-center bg-level-0 separator-bottom sticky-top\">\n      {{ 'Provide external application details' | translate }}\n    </p>\n    <div class=\"modal-body p-t-8\" id=\"modal-body\">\n      <c8y-form-group>\n        <label style=\"text-align: left\">{{ 'Name' | translate }}</label>\n        <input\n          class=\"form-control\"\n          formControlName=\"name\"\n          name=\"name\"\n          placeholder=\"{{ 'e.g. My application' | translate }}\"\n          required\n          type=\"text\"\n        />\n      </c8y-form-group>\n\n      <c8y-form-group>\n        <label style=\"text-align: left\">{{ 'Application key' | translate }}</label>\n        <input\n          class=\"form-control\"\n          formControlName=\"key\"\n          name=\"key\"\n          placeholder=\"{{ 'e.g. my-external-application-key' | translate }}\"\n          required\n          type=\"text\"\n        />\n      </c8y-form-group>\n\n      <c8y-form-group>\n        <label style=\"text-align: left\">{{ 'External URL' | translate }}</label>\n        <input\n          [pattern]=\"'^(?!javascript:).+'\"\n          class=\"form-control\"\n          formControlName=\"externalUrl\"\n          name=\"externalUrl\"\n          placeholder=\"{{ 'e.g.' | translate }} https://www.example.com\"\n          required\n          type=\"url\"\n        />\n      </c8y-form-group>\n    </div>\n  </c8y-wizard-body>\n\n  <c8y-wizard-footer>\n    <button\n      (click)=\"back()\"\n      class=\"btn btn-default\"\n      title=\"{{ 'Back' | translate }}\"\n      translate\n      type=\"button\"\n    >\n      Back\n    </button>\n    <button (click)=\"cancel()\" class=\"btn btn-default\" title=\"{{ 'Cancel' | translate }}\" translate>\n      Cancel\n    </button>\n    <button\n      (click)=\"save(formGroup.value)\"\n      [disabled]=\"formGroup.invalid || formGroup.pristine\"\n      class=\"btn btn-primary btn-form\"\n      title=\"{{ 'Add application' | translate }}\"\n      type=\"button\"\n    >\n      {{ 'Add application' | translate }}\n    </button>\n  </c8y-wizard-footer>\n</form>\n<ng-template #appCreated>\n  <c8y-wizard-body>\n    <div class=\"d-flex d-col j-c-center a-i-center\" style=\"min-height: 324px\">\n      <c8y-operation-result\n        text=\"{{ 'Application created' | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n        type=\"success\"\n        class=\"lead\"\n      ></c8y-operation-result>\n    </div>\n  </c8y-wizard-body>\n  <c8y-wizard-footer>\n    <button (click)=\"done()\" class=\"btn btn-default\" title=\"{{ 'Done' | translate }}\" translate>\n      Done\n    </button>\n    <a\n      (click)=\"$event.stopPropagation()\"\n      [href]=\"formGroup.value.externalUrl\"\n      target=\"_blank\"\n      rel=\"noopener noreferrer\"\n      class=\"btn btn-primary\"\n      title=\"{{ 'Open' | translate }}\"\n    >\n      <i c8yIcon=\"external-link\" class=\"m-r-4\"></i>\n      {{ 'Open' | translate }}\n    </a>\n  </c8y-wizard-footer>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: WizardHeaderComponent, selector: "c8y-wizard-header" }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: WizardBodyComponent, selector: "c8y-wizard-body" }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "component", type: WizardFooterComponent, selector: "c8y-wizard-footer" }, { kind: "component", type: OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AddExternalApplicationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-add-external-application', standalone: false, template: "<form *ngIf=\"!createdApp; else appCreated\" [formGroup]=\"formGroup\" novalidate>\n  <c8y-wizard-header>\n    <i [c8yIcon]=\"'cloud-link'\"></i>\n    <h4 translate id=\"modal-title\">Add external application</h4>\n  </c8y-wizard-header>\n\n  <c8y-wizard-body>\n    <p class=\"p-16 text-medium text-center bg-level-0 separator-bottom sticky-top\">\n      {{ 'Provide external application details' | translate }}\n    </p>\n    <div class=\"modal-body p-t-8\" id=\"modal-body\">\n      <c8y-form-group>\n        <label style=\"text-align: left\">{{ 'Name' | translate }}</label>\n        <input\n          class=\"form-control\"\n          formControlName=\"name\"\n          name=\"name\"\n          placeholder=\"{{ 'e.g. My application' | translate }}\"\n          required\n          type=\"text\"\n        />\n      </c8y-form-group>\n\n      <c8y-form-group>\n        <label style=\"text-align: left\">{{ 'Application key' | translate }}</label>\n        <input\n          class=\"form-control\"\n          formControlName=\"key\"\n          name=\"key\"\n          placeholder=\"{{ 'e.g. my-external-application-key' | translate }}\"\n          required\n          type=\"text\"\n        />\n      </c8y-form-group>\n\n      <c8y-form-group>\n        <label style=\"text-align: left\">{{ 'External URL' | translate }}</label>\n        <input\n          [pattern]=\"'^(?!javascript:).+'\"\n          class=\"form-control\"\n          formControlName=\"externalUrl\"\n          name=\"externalUrl\"\n          placeholder=\"{{ 'e.g.' | translate }} https://www.example.com\"\n          required\n          type=\"url\"\n        />\n      </c8y-form-group>\n    </div>\n  </c8y-wizard-body>\n\n  <c8y-wizard-footer>\n    <button\n      (click)=\"back()\"\n      class=\"btn btn-default\"\n      title=\"{{ 'Back' | translate }}\"\n      translate\n      type=\"button\"\n    >\n      Back\n    </button>\n    <button (click)=\"cancel()\" class=\"btn btn-default\" title=\"{{ 'Cancel' | translate }}\" translate>\n      Cancel\n    </button>\n    <button\n      (click)=\"save(formGroup.value)\"\n      [disabled]=\"formGroup.invalid || formGroup.pristine\"\n      class=\"btn btn-primary btn-form\"\n      title=\"{{ 'Add application' | translate }}\"\n      type=\"button\"\n    >\n      {{ 'Add application' | translate }}\n    </button>\n  </c8y-wizard-footer>\n</form>\n<ng-template #appCreated>\n  <c8y-wizard-body>\n    <div class=\"d-flex d-col j-c-center a-i-center\" style=\"min-height: 324px\">\n      <c8y-operation-result\n        text=\"{{ 'Application created' | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n        type=\"success\"\n        class=\"lead\"\n      ></c8y-operation-result>\n    </div>\n  </c8y-wizard-body>\n  <c8y-wizard-footer>\n    <button (click)=\"done()\" class=\"btn btn-default\" title=\"{{ 'Done' | translate }}\" translate>\n      Done\n    </button>\n    <a\n      (click)=\"$event.stopPropagation()\"\n      [href]=\"formGroup.value.externalUrl\"\n      target=\"_blank\"\n      rel=\"noopener noreferrer\"\n      class=\"btn btn-primary\"\n      title=\"{{ 'Open' | translate }}\"\n    >\n      <i c8yIcon=\"external-link\" class=\"m-r-4\"></i>\n      {{ 'Open' | translate }}\n    </a>\n  </c8y-wizard-footer>\n</ng-template>\n" }]
-        }], ctorParameters: () => [{ type: i4.ApplicationService }, { type: i2$1.FormBuilder }, { type: i2.AlertService }, { type: i2.WizardComponent }] });
+            args: [{ selector: 'c8y-add-external-application', imports: [
+                        NgIf,
+                        FormsModule,
+                        ReactiveFormsModule,
+                        WizardHeaderComponent,
+                        IconDirective,
+                        C8yTranslateDirective,
+                        WizardBodyComponent,
+                        FormGroupComponent,
+                        RequiredInputPlaceholderDirective,
+                        WizardFooterComponent,
+                        OperationResultComponent,
+                        C8yTranslatePipe
+                    ], template: "<form *ngIf=\"!createdApp; else appCreated\" [formGroup]=\"formGroup\" novalidate>\n  <c8y-wizard-header>\n    <i [c8yIcon]=\"'cloud-link'\"></i>\n    <h4 translate id=\"modal-title\">Add external application</h4>\n  </c8y-wizard-header>\n\n  <c8y-wizard-body>\n    <p class=\"p-16 text-medium text-center bg-level-0 separator-bottom sticky-top\">\n      {{ 'Provide external application details' | translate }}\n    </p>\n    <div class=\"modal-body p-t-8\" id=\"modal-body\">\n      <c8y-form-group>\n        <label style=\"text-align: left\">{{ 'Name' | translate }}</label>\n        <input\n          class=\"form-control\"\n          formControlName=\"name\"\n          name=\"name\"\n          placeholder=\"{{ 'e.g. My application' | translate }}\"\n          required\n          type=\"text\"\n        />\n      </c8y-form-group>\n\n      <c8y-form-group>\n        <label style=\"text-align: left\">{{ 'Application key' | translate }}</label>\n        <input\n          class=\"form-control\"\n          formControlName=\"key\"\n          name=\"key\"\n          placeholder=\"{{ 'e.g. my-external-application-key' | translate }}\"\n          required\n          type=\"text\"\n        />\n      </c8y-form-group>\n\n      <c8y-form-group>\n        <label style=\"text-align: left\">{{ 'External URL' | translate }}</label>\n        <input\n          [pattern]=\"'^(?!javascript:).+'\"\n          class=\"form-control\"\n          formControlName=\"externalUrl\"\n          name=\"externalUrl\"\n          placeholder=\"{{ 'e.g.' | translate }} https://www.example.com\"\n          required\n          type=\"url\"\n        />\n      </c8y-form-group>\n    </div>\n  </c8y-wizard-body>\n\n  <c8y-wizard-footer>\n    <button\n      (click)=\"back()\"\n      class=\"btn btn-default\"\n      title=\"{{ 'Back' | translate }}\"\n      translate\n      type=\"button\"\n    >\n      Back\n    </button>\n    <button (click)=\"cancel()\" class=\"btn btn-default\" title=\"{{ 'Cancel' | translate }}\" translate>\n      Cancel\n    </button>\n    <button\n      (click)=\"save(formGroup.value)\"\n      [disabled]=\"formGroup.invalid || formGroup.pristine\"\n      class=\"btn btn-primary btn-form\"\n      title=\"{{ 'Add application' | translate }}\"\n      type=\"button\"\n    >\n      {{ 'Add application' | translate }}\n    </button>\n  </c8y-wizard-footer>\n</form>\n<ng-template #appCreated>\n  <c8y-wizard-body>\n    <div class=\"d-flex d-col j-c-center a-i-center\" style=\"min-height: 324px\">\n      <c8y-operation-result\n        text=\"{{ 'Application created' | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n        type=\"success\"\n        class=\"lead\"\n      ></c8y-operation-result>\n    </div>\n  </c8y-wizard-body>\n  <c8y-wizard-footer>\n    <button (click)=\"done()\" class=\"btn btn-default\" title=\"{{ 'Done' | translate }}\" translate>\n      Done\n    </button>\n    <a\n      (click)=\"$event.stopPropagation()\"\n      [href]=\"formGroup.value.externalUrl\"\n      target=\"_blank\"\n      rel=\"noopener noreferrer\"\n      class=\"btn btn-primary\"\n      title=\"{{ 'Open' | translate }}\"\n    >\n      <i c8yIcon=\"external-link\" class=\"m-r-4\"></i>\n      {{ 'Open' | translate }}\n    </a>\n  </c8y-wizard-footer>\n</ng-template>\n" }]
+        }], ctorParameters: () => [{ type: i4.ApplicationService }, { type: i3.FormBuilder }, { type: i2.AlertService }, { type: i2.WizardComponent }] });
 
 class AddWebApplicationComponent {
     constructor(ecosystemService) {
@@ -1092,14 +775,14 @@ class AddWebApplicationComponent {
         return this.ecosystemService.uploadArchiveToApp(file, app);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AddWebApplicationComponent, deps: [{ token: i1.EcosystemService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: AddWebApplicationComponent, isStandalone: false, selector: "c8y-add-web-application", ngImport: i0, template: `<c8y-add-application
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: AddWebApplicationComponent, isStandalone: true, selector: "c8y-add-web-application", ngImport: i0, template: `<c8y-add-application
     [headerIcon]="'upload'"
     [headerText]="headerText"
     [successText]="successText"
     [createApplicationHandler]="createApplicationHandler"
     [uploadApplicationHandler]="uploadApplicationHandler"
     [canGoBack]="true"
-  ></c8y-add-application>`, isInline: true, dependencies: [{ kind: "component", type: i1.AddApplicationComponent, selector: "c8y-add-application", inputs: ["headerText", "headerIcon", "successText", "createApplicationHandler", "uploadApplicationHandler", "canGoBack", "applicationType"] }] }); }
+  ></c8y-add-application>`, isInline: true, dependencies: [{ kind: "component", type: AddApplicationComponent, selector: "c8y-add-application", inputs: ["headerText", "headerIcon", "successText", "createApplicationHandler", "uploadApplicationHandler", "canGoBack", "applicationType"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AddWebApplicationComponent, decorators: [{
             type: Component,
@@ -1113,7 +796,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
     [uploadApplicationHandler]="uploadApplicationHandler"
     [canGoBack]="true"
   ></c8y-add-application>`,
-                    standalone: false
+                    imports: [AddApplicationComponent]
                 }]
         }], ctorParameters: () => [{ type: i1.EcosystemService }] });
 
@@ -1163,11 +846,29 @@ class ApplicationListComponent {
         this.filtersComponent.resetAllFilters();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ApplicationListComponent, deps: [{ token: i1.EcosystemService }, { token: i2.WizardModalService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ApplicationListComponent, isStandalone: false, selector: "c8y-application-list", viewQueries: [{ propertyName: "filtersComponent", first: true, predicate: ListFiltersComponent, descendants: true }], ngImport: i0, template: "<c8y-title>{{ 'Applications' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-modules'\"\n    [label]=\"'Applications' | translate\"\n    [path]=\"'ecosystem/application/applications'\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item\n  [placement]=\"'right'\"\n  *c8yIfAllowed=\"['ROLE_APPLICATION_MANAGEMENT_ADMIN']\"\n>\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Add application' | translate }}\"\n    (click)=\"addApplication()\"\n  >\n    <i c8yIcon=\"plus-circle\"></i>\n    {{ 'Add application' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    (click)=\"loadApplications()\"\n  >\n    <i\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': reloading }\"\n    ></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'left'\">\n  <c8y-list-filters\n    *ngIf=\"apps$ | async\"\n    (filterPipeChange)=\"setFilterPipe($event)\"\n    [packageAvailabilities]=\"packageAvailabilities\"\n  ></c8y-list-filters>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n  [placement]=\"'left'\"\n  itemClass=\"navbar-form hidden-xs\"\n>\n  <c8y-list-display-switch\n    (onListClassChange)=\"listClass = $event\"\n    [listLength]=\"(apps$ | async)?.length\"\n  ></c8y-list-display-switch>\n</c8y-action-bar-item>\n\n<c8y-help src=\"/docs/standard-tenant/ecosystem/#managing-applications\"></c8y-help>\n\n<div\n  class=\"c8y-empty-state text-center\"\n  *ngIf=\"(apps$ | async)?.length === 0\"\n>\n  <h1 class=\"c8y-icon c8y-icon-modules c8y-icon-duocolor\"></h1>\n  <h3 translate>No applications to display.</h3>\n  <p translate>Add your first application by clicking below.</p>\n  <p>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Add application' | translate }}\"\n      (click)=\"addApplication()\"\n    >\n      {{ 'Add application' | translate }}\n    </button>\n  </p>\n</div>\n\n<div\n  class=\"card-group\"\n  [ngClass]=\"listClass\"\n>\n  <div\n    class=\"page-sticky-header hidden-xs d-flex\"\n    *ngIf=\"(apps$ | async)?.length > 0\"\n  >\n    <div class=\"card-block card-column-40\">\n      <div class=\"card-appicon p-l-32 p-r-16 m-r-0 m-l-4\"></div>\n      {{ 'Application' | translate }}\n    </div>\n    <div class=\"card-block p-0 card-column-80 m-r-40\">\n      <div class=\"card-block card-column-80\">{{ 'Description' | translate }}</div>\n      <div class=\"card-block card-column-20\">{{ 'Type' | translate }}</div>\n      <div class=\"card-block card-column-20\"></div>\n    </div>\n  </div>\n  <div\n    class=\"col-xs-12 col-sm-4 col-md-3\"\n    *ngFor=\"let app of filteredApps$ | async\"\n  >\n    <c8y-application-card\n      class=\"d-contents\"\n      (onAppDeleted)=\"loadApplications()\"\n      (onAppCloned)=\"loadApplications()\"\n      [app]=\"app\"\n    ></c8y-application-card>\n  </div>\n</div>\n\n<c8y-ui-empty-state\n  [icon]=\"'search'\"\n  [title]=\"'No matching applications.' | translate\"\n  [subtitle]=\"'Refine your search terms and/or the filters' | translate\"\n  *ngIf=\"(apps$ | async)?.length > 0 && (filteredApps$ | async)?.length === 0\"\n>\n  <button\n    class=\"btn btn-primary\"\n    title=\"{{ 'Reset filters' | translate }}\"\n    type=\"button\"\n    (click)=\"resetFilters()\"\n  >\n    {{ 'Reset filters' | translate }}\n  </button>\n</c8y-ui-empty-state>\n", dependencies: [{ kind: "component", type: i2.ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "component", type: i2.BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: i2.BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "component", type: i2.EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.IfAllowedDirective, selector: "[c8yIfAllowed]", inputs: ["c8yIfAllowed", "c8yIfAllowedAllowAny"] }, { kind: "component", type: i2.TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "component", type: i2.HelpComponent, selector: "c8y-help", inputs: ["src", "isCollapsed", "priority", "icon"] }, { kind: "component", type: i2.ListDisplaySwitchComponent, selector: "c8y-list-display-switch", inputs: ["listKey", "listLength", "filterPipe"], outputs: ["onListClassChange"] }, { kind: "component", type: i1.ApplicationCardComponent, selector: "c8y-application-card", inputs: ["app", "canEdit"], outputs: ["onAppDeleted", "onAppCloned"] }, { kind: "component", type: i1.ListFiltersComponent, selector: "c8y-list-filters", inputs: ["packageTypes", "packageAvailabilities", "packageContents"], outputs: ["filterPipeChange"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ApplicationListComponent, isStandalone: true, selector: "c8y-application-list", viewQueries: [{ propertyName: "filtersComponent", first: true, predicate: ListFiltersComponent, descendants: true }], ngImport: i0, template: "<c8y-title>{{ 'Applications' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-modules'\"\n    [label]=\"'Applications' | translate\"\n    [path]=\"'ecosystem/application/applications'\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item\n  [placement]=\"'right'\"\n  *c8yIfAllowed=\"['ROLE_APPLICATION_MANAGEMENT_ADMIN']\"\n>\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Add application' | translate }}\"\n    (click)=\"addApplication()\"\n  >\n    <i c8yIcon=\"plus-circle\"></i>\n    {{ 'Add application' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    (click)=\"loadApplications()\"\n  >\n    <i\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': reloading }\"\n    ></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'left'\">\n  <c8y-list-filters\n    *ngIf=\"apps$ | async\"\n    (filterPipeChange)=\"setFilterPipe($event)\"\n    [packageAvailabilities]=\"packageAvailabilities\"\n  ></c8y-list-filters>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n  [placement]=\"'left'\"\n  itemClass=\"navbar-form hidden-xs\"\n>\n  <c8y-list-display-switch\n    (onListClassChange)=\"listClass = $event\"\n    [listLength]=\"(apps$ | async)?.length\"\n  ></c8y-list-display-switch>\n</c8y-action-bar-item>\n\n<c8y-help src=\"/docs/standard-tenant/ecosystem/#managing-applications\"></c8y-help>\n\n<div\n  class=\"c8y-empty-state text-center\"\n  *ngIf=\"(apps$ | async)?.length === 0\"\n>\n  <h1 class=\"c8y-icon c8y-icon-modules c8y-icon-duocolor\"></h1>\n  <h3 translate>No applications to display.</h3>\n  <p translate>Add your first application by clicking below.</p>\n  <p>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Add application' | translate }}\"\n      (click)=\"addApplication()\"\n    >\n      {{ 'Add application' | translate }}\n    </button>\n  </p>\n</div>\n\n<div\n  class=\"card-group\"\n  [ngClass]=\"listClass\"\n>\n  <div\n    class=\"page-sticky-header hidden-xs d-flex\"\n    *ngIf=\"(apps$ | async)?.length > 0\"\n  >\n    <div class=\"card-block card-column-40\">\n      <div class=\"card-appicon p-l-32 p-r-16 m-r-0 m-l-4\"></div>\n      {{ 'Application' | translate }}\n    </div>\n    <div class=\"card-block p-0 card-column-80 m-r-40\">\n      <div class=\"card-block card-column-80\">{{ 'Description' | translate }}</div>\n      <div class=\"card-block card-column-20\">{{ 'Type' | translate }}</div>\n      <div class=\"card-block card-column-20\"></div>\n    </div>\n  </div>\n  <div\n    class=\"col-xs-12 col-sm-4 col-md-3\"\n    *ngFor=\"let app of filteredApps$ | async\"\n  >\n    <c8y-application-card\n      class=\"d-contents\"\n      (onAppDeleted)=\"loadApplications()\"\n      (onAppCloned)=\"loadApplications()\"\n      [app]=\"app\"\n    ></c8y-application-card>\n  </div>\n</div>\n\n<c8y-ui-empty-state\n  [icon]=\"'search'\"\n  [title]=\"'No matching applications.' | translate\"\n  [subtitle]=\"'Refine your search terms and/or the filters' | translate\"\n  *ngIf=\"(apps$ | async)?.length > 0 && (filteredApps$ | async)?.length === 0\"\n>\n  <button\n    class=\"btn btn-primary\"\n    title=\"{{ 'Reset filters' | translate }}\"\n    type=\"button\"\n    (click)=\"resetFilters()\"\n  >\n    {{ 'Reset filters' | translate }}\n  </button>\n</c8y-ui-empty-state>\n", dependencies: [{ kind: "component", type: TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "component", type: BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "directive", type: IfAllowedDirective, selector: "[c8yIfAllowed]", inputs: ["c8yIfAllowed", "c8yIfAllowedAllowAny"] }, { kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ListFiltersComponent, selector: "c8y-list-filters", inputs: ["packageTypes", "packageAvailabilities", "packageContents"], outputs: ["filterPipeChange"] }, { kind: "component", type: ListDisplaySwitchComponent, selector: "c8y-list-display-switch", inputs: ["listKey", "listLength", "filterPipe"], outputs: ["onListClassChange"] }, { kind: "component", type: HelpComponent, selector: "c8y-help", inputs: ["src", "isCollapsed", "priority", "icon"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ApplicationCardComponent, selector: "c8y-application-card", inputs: ["app", "canEdit"], outputs: ["onAppDeleted", "onAppCloned"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ApplicationListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-application-list', standalone: false, template: "<c8y-title>{{ 'Applications' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-modules'\"\n    [label]=\"'Applications' | translate\"\n    [path]=\"'ecosystem/application/applications'\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item\n  [placement]=\"'right'\"\n  *c8yIfAllowed=\"['ROLE_APPLICATION_MANAGEMENT_ADMIN']\"\n>\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Add application' | translate }}\"\n    (click)=\"addApplication()\"\n  >\n    <i c8yIcon=\"plus-circle\"></i>\n    {{ 'Add application' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    (click)=\"loadApplications()\"\n  >\n    <i\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': reloading }\"\n    ></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'left'\">\n  <c8y-list-filters\n    *ngIf=\"apps$ | async\"\n    (filterPipeChange)=\"setFilterPipe($event)\"\n    [packageAvailabilities]=\"packageAvailabilities\"\n  ></c8y-list-filters>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n  [placement]=\"'left'\"\n  itemClass=\"navbar-form hidden-xs\"\n>\n  <c8y-list-display-switch\n    (onListClassChange)=\"listClass = $event\"\n    [listLength]=\"(apps$ | async)?.length\"\n  ></c8y-list-display-switch>\n</c8y-action-bar-item>\n\n<c8y-help src=\"/docs/standard-tenant/ecosystem/#managing-applications\"></c8y-help>\n\n<div\n  class=\"c8y-empty-state text-center\"\n  *ngIf=\"(apps$ | async)?.length === 0\"\n>\n  <h1 class=\"c8y-icon c8y-icon-modules c8y-icon-duocolor\"></h1>\n  <h3 translate>No applications to display.</h3>\n  <p translate>Add your first application by clicking below.</p>\n  <p>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Add application' | translate }}\"\n      (click)=\"addApplication()\"\n    >\n      {{ 'Add application' | translate }}\n    </button>\n  </p>\n</div>\n\n<div\n  class=\"card-group\"\n  [ngClass]=\"listClass\"\n>\n  <div\n    class=\"page-sticky-header hidden-xs d-flex\"\n    *ngIf=\"(apps$ | async)?.length > 0\"\n  >\n    <div class=\"card-block card-column-40\">\n      <div class=\"card-appicon p-l-32 p-r-16 m-r-0 m-l-4\"></div>\n      {{ 'Application' | translate }}\n    </div>\n    <div class=\"card-block p-0 card-column-80 m-r-40\">\n      <div class=\"card-block card-column-80\">{{ 'Description' | translate }}</div>\n      <div class=\"card-block card-column-20\">{{ 'Type' | translate }}</div>\n      <div class=\"card-block card-column-20\"></div>\n    </div>\n  </div>\n  <div\n    class=\"col-xs-12 col-sm-4 col-md-3\"\n    *ngFor=\"let app of filteredApps$ | async\"\n  >\n    <c8y-application-card\n      class=\"d-contents\"\n      (onAppDeleted)=\"loadApplications()\"\n      (onAppCloned)=\"loadApplications()\"\n      [app]=\"app\"\n    ></c8y-application-card>\n  </div>\n</div>\n\n<c8y-ui-empty-state\n  [icon]=\"'search'\"\n  [title]=\"'No matching applications.' | translate\"\n  [subtitle]=\"'Refine your search terms and/or the filters' | translate\"\n  *ngIf=\"(apps$ | async)?.length > 0 && (filteredApps$ | async)?.length === 0\"\n>\n  <button\n    class=\"btn btn-primary\"\n    title=\"{{ 'Reset filters' | translate }}\"\n    type=\"button\"\n    (click)=\"resetFilters()\"\n  >\n    {{ 'Reset filters' | translate }}\n  </button>\n</c8y-ui-empty-state>\n" }]
+            args: [{ selector: 'c8y-application-list', imports: [
+                        TitleComponent,
+                        BreadcrumbComponent,
+                        BreadcrumbItemComponent,
+                        IfAllowedDirective,
+                        ActionBarItemComponent,
+                        IconDirective,
+                        NgClass,
+                        NgIf,
+                        ListFiltersComponent,
+                        ListDisplaySwitchComponent,
+                        HelpComponent,
+                        C8yTranslateDirective,
+                        NgFor,
+                        ApplicationCardComponent,
+                        EmptyStateComponent,
+                        C8yTranslatePipe,
+                        AsyncPipe
+                    ], template: "<c8y-title>{{ 'Applications' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-modules'\"\n    [label]=\"'Applications' | translate\"\n    [path]=\"'ecosystem/application/applications'\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item\n  [placement]=\"'right'\"\n  *c8yIfAllowed=\"['ROLE_APPLICATION_MANAGEMENT_ADMIN']\"\n>\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Add application' | translate }}\"\n    (click)=\"addApplication()\"\n  >\n    <i c8yIcon=\"plus-circle\"></i>\n    {{ 'Add application' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    (click)=\"loadApplications()\"\n  >\n    <i\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': reloading }\"\n    ></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'left'\">\n  <c8y-list-filters\n    *ngIf=\"apps$ | async\"\n    (filterPipeChange)=\"setFilterPipe($event)\"\n    [packageAvailabilities]=\"packageAvailabilities\"\n  ></c8y-list-filters>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n  [placement]=\"'left'\"\n  itemClass=\"navbar-form hidden-xs\"\n>\n  <c8y-list-display-switch\n    (onListClassChange)=\"listClass = $event\"\n    [listLength]=\"(apps$ | async)?.length\"\n  ></c8y-list-display-switch>\n</c8y-action-bar-item>\n\n<c8y-help src=\"/docs/standard-tenant/ecosystem/#managing-applications\"></c8y-help>\n\n<div\n  class=\"c8y-empty-state text-center\"\n  *ngIf=\"(apps$ | async)?.length === 0\"\n>\n  <h1 class=\"c8y-icon c8y-icon-modules c8y-icon-duocolor\"></h1>\n  <h3 translate>No applications to display.</h3>\n  <p translate>Add your first application by clicking below.</p>\n  <p>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Add application' | translate }}\"\n      (click)=\"addApplication()\"\n    >\n      {{ 'Add application' | translate }}\n    </button>\n  </p>\n</div>\n\n<div\n  class=\"card-group\"\n  [ngClass]=\"listClass\"\n>\n  <div\n    class=\"page-sticky-header hidden-xs d-flex\"\n    *ngIf=\"(apps$ | async)?.length > 0\"\n  >\n    <div class=\"card-block card-column-40\">\n      <div class=\"card-appicon p-l-32 p-r-16 m-r-0 m-l-4\"></div>\n      {{ 'Application' | translate }}\n    </div>\n    <div class=\"card-block p-0 card-column-80 m-r-40\">\n      <div class=\"card-block card-column-80\">{{ 'Description' | translate }}</div>\n      <div class=\"card-block card-column-20\">{{ 'Type' | translate }}</div>\n      <div class=\"card-block card-column-20\"></div>\n    </div>\n  </div>\n  <div\n    class=\"col-xs-12 col-sm-4 col-md-3\"\n    *ngFor=\"let app of filteredApps$ | async\"\n  >\n    <c8y-application-card\n      class=\"d-contents\"\n      (onAppDeleted)=\"loadApplications()\"\n      (onAppCloned)=\"loadApplications()\"\n      [app]=\"app\"\n    ></c8y-application-card>\n  </div>\n</div>\n\n<c8y-ui-empty-state\n  [icon]=\"'search'\"\n  [title]=\"'No matching applications.' | translate\"\n  [subtitle]=\"'Refine your search terms and/or the filters' | translate\"\n  *ngIf=\"(apps$ | async)?.length > 0 && (filteredApps$ | async)?.length === 0\"\n>\n  <button\n    class=\"btn btn-primary\"\n    title=\"{{ 'Reset filters' | translate }}\"\n    type=\"button\"\n    (click)=\"resetFilters()\"\n  >\n    {{ 'Reset filters' | translate }}\n  </button>\n</c8y-ui-empty-state>\n" }]
         }], ctorParameters: () => [{ type: i1.EcosystemService }, { type: i2.WizardModalService }], propDecorators: { filtersComponent: [{
                 type: ViewChild,
                 args: [ListFiltersComponent]
@@ -1303,11 +1004,33 @@ class InstallFromPackageComponent {
         this.packages = applications.filter(app => this.ecosystemService.isPackageBlueprint(app));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: InstallFromPackageComponent, deps: [{ token: i1.EcosystemService }, { token: i4.ApplicationService }, { token: i2.WizardComponent }, { token: i2.PluginsService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: InstallFromPackageComponent, isStandalone: false, selector: "c8y-install-from-package", viewQueries: [{ propertyName: "applicationPropertiesForm", first: true, predicate: ApplicationPropertiesFormComponent, descendants: true }], ngImport: i0, template: "<c8y-wizard-header>\n  <i [c8yIcon]=\"'big-parcel'\"></i>\n  <h4\n    id=\"modal-title\"\n    translate\n  >\n    Install from extension package\n  </h4>\n</c8y-wizard-header>\n<c8y-wizard-body>\n  <ng-container *ngIf=\"!selectedPackage\">\n    <div\n      class=\"modal-inner-scroll\"\n      id=\"modal-body\"\n    >\n      <p class=\"p-16 text-medium text-center separator-bottom sticky-top bg-level-0\">\n        {{ 'Select from available extension packages' | translate }}\n      </p>\n\n      <c8y-ui-empty-state\n        [icon]=\"'big-parcel'\"\n        [title]=\"'No extension packages to display.' | translate\"\n        *ngIf=\"!packages?.length\"\n        [horizontal]=\"true\"\n      ></c8y-ui-empty-state>\n\n      <div\n        class=\"c8y-wizard-list-nav\"\n        style=\"min-height: 257px\"\n        *ngIf=\"packages?.length\"\n      >\n        <button\n          class=\"list-group-item text-truncate bg-component\"\n          title=\"{{ package.name }}\"\n          type=\"button\"\n          *ngFor=\"let package of packages\"\n          (click)=\"selectPackage(package)\"\n        >\n          <i\n            class=\"list-group-icon\"\n            c8yIcon=\"big-parcel\"\n          ></i>\n          <span [innerText]=\"package.name\"></span>\n        </button>\n      </div>\n    </div>\n  </ng-container>\n  <ng-container *ngIf=\"!isDeployed && selectedPackage\">\n    <p class=\"p-16 text-center text-medium separator-bottom sticky-top bg-level-0\">\n      {{ 'Provide application details' | translate }}\n    </p>\n    <div\n      class=\"d-flex d-col a-i-center j-c-center\"\n      style=\"min-height: 257px\"\n    >\n      <c8y-application-properties-form\n        class=\"d-block fit-w\"\n        *ngIf=\"!inProgress\"\n        [application]=\"newAppConfig\"\n      ></c8y-application-properties-form>\n\n      <ng-container *ngIf=\"!inProgress\">\n        <div\n          class=\"d-block fit-w bg-gray-white\"\n          [ngStyle]=\"{ padding: '0 16px' }\"\n        >\n          <label\n            for=\"packageVersion\"\n            translate\n          >\n            Use extension package version\n          </label>\n          <c8y-form-group>\n            <c8y-typeahead\n              placeholder=\"{{ 'Select or enter' | translate }}\"\n              name=\"packageVersion\"\n              [(ngModel)]=\"model.selected\"\n              (onSearch)=\"onInput.next($event)\"\n              [displayProperty]=\"'version'\"\n              [required]=\"true\"\n              [hideNew]=\"true\"\n              [container]=\"'body'\"\n            >\n              <c8y-li\n                class=\"p-l-8 p-r-8 c8y-list__item--link\"\n                *c8yFor=\"let version of versions$; loadMore: 'auto'; notFound: notFoundTemplate\"\n                (click)=\"onAppVersionSelect(version)\"\n                [active]=\"model.selected === version\"\n              >\n                <c8y-li-icon icon=\"big-parcel\"></c8y-li-icon>\n                <span\n                  [ngStyle]=\"{\n                    display: 'flex',\n                    'flex-direction': 'row',\n                    'align-content': 'center',\n                    'justify-content': 'space-between',\n                    'align-items': 'center'\n                  }\"\n                >\n                  <c8y-highlight\n                    [text]=\"version.version || '--'\"\n                    [pattern]=\"onInput | async\"\n                  ></c8y-highlight>\n\n                  <span>\n                    <span\n                      class=\"label label-info m-l-4\"\n                      *ngFor=\"let tag of version.tags\"\n                    >\n                      {{ tag }}\n                    </span>\n                  </span>\n                </span>\n              </c8y-li>\n              <ng-template #notFoundTemplate>\n                <c8y-li\n                  class=\"bg-gray-lighter p-8\"\n                  *ngIf=\"(onInput | async)?.length > 0 && (versions$ | async)?.data?.length === 0\"\n                >\n                  <span translate>No match found.</span>\n                </c8y-li>\n              </ng-template>\n            </c8y-typeahead>\n          </c8y-form-group>\n        </div>\n      </ng-container>\n\n      <c8y-loading\n        class=\"text-center d-block\"\n        [message]=\"'Installing\u2026' | translate\"\n        *ngIf=\"inProgress\"\n        layout=\"application\"\n      ></c8y-loading>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"isDeployed\">\n    <div\n      class=\"d-flex a-i-center j-c-center\"\n      style=\"min-height: 257px\"\n      *ngIf=\"deployedWithSuccess; else failedDeploy\"\n    >\n      <c8y-operation-result\n        class=\"lead\"\n        type=\"success\"\n        text=\"{{ 'Application created' | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n      ></c8y-operation-result>\n    </div>\n    <ng-template #failedDeploy>\n      <div\n        class=\"d-flex a-i-center j-c-center\"\n        style=\"min-height: 257px\"\n      >\n        <c8y-operation-result\n          class=\"lead\"\n          type=\"error\"\n          text=\"{{ 'Application creation failed' | translate }}\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n        ></c8y-operation-result>\n      </div>\n    </ng-template>\n  </ng-container>\n</c8y-wizard-body>\n\n<c8y-wizard-footer>\n  <button\n    class=\"btn btn-default\"\n    title=\"{{ 'Back' | translate }}\"\n    type=\"button\"\n    *ngIf=\"!isDeployed\"\n    (click)=\"selectedPackage ? clean() : back()\"\n    [disabled]=\"inProgress\"\n  >\n    {{ 'Back' | translate }}\n  </button>\n  <button\n    class=\"btn btn-default\"\n    title=\"{{ isDeployed && deployedWithSuccess ? ('Close' | translate) : ('Cancel' | translate) }}\"\n    type=\"button\"\n    (click)=\"cancel()\"\n  >\n    {{ isDeployed && deployedWithSuccess ? ('Close' | translate) : ('Cancel' | translate) }}\n  </button>\n\n  <button\n    class=\"btn btn-primary\"\n    title=\"{{ 'Install' | translate }}\"\n    type=\"button\"\n    (click)=\"deployApp()\"\n    [disabled]=\"inProgress || !packages?.length\"\n    *ngIf=\"!isDeployed\"\n  >\n    {{ 'Install' | translate }}\n  </button>\n</c8y-wizard-footer>\n", dependencies: [{ kind: "component", type: i2.EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.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: i2.LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "component", type: i2.OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "component", type: i2.HighlightComponent, selector: "c8y-highlight", inputs: ["pattern", "text", "elementClass", "shouldTrimPattern"] }, { kind: "component", type: i2.TypeaheadComponent, selector: "c8y-typeahead", inputs: ["required", "maxlength", "disabled", "allowFreeEntries", "placeholder", "displayProperty", "icon", "name", "autoClose", "hideNew", "container", "selected", "highlightFirstItem"], outputs: ["onSearch", "onIconClick"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "component", type: i2.ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: i2.ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: i2.WizardHeaderComponent, selector: "c8y-wizard-header" }, { kind: "component", type: i2.WizardBodyComponent, selector: "c8y-wizard-body" }, { kind: "component", type: i2.WizardFooterComponent, selector: "c8y-wizard-footer" }, { kind: "component", type: i1.ApplicationPropertiesFormComponent, selector: "c8y-application-properties-form", inputs: ["application", "disabled"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: InstallFromPackageComponent, isStandalone: true, selector: "c8y-install-from-package", viewQueries: [{ propertyName: "applicationPropertiesForm", first: true, predicate: ApplicationPropertiesFormComponent, descendants: true }], ngImport: i0, template: "<c8y-wizard-header>\n  <i [c8yIcon]=\"'big-parcel'\"></i>\n  <h4\n    id=\"modal-title\"\n    translate\n  >\n    Install from extension package\n  </h4>\n</c8y-wizard-header>\n<c8y-wizard-body>\n  <ng-container *ngIf=\"!selectedPackage\">\n    <div\n      class=\"modal-inner-scroll\"\n      id=\"modal-body\"\n    >\n      <p class=\"p-16 text-medium text-center separator-bottom sticky-top bg-level-0\">\n        {{ 'Select from available extension packages' | translate }}\n      </p>\n\n      <c8y-ui-empty-state\n        [icon]=\"'big-parcel'\"\n        [title]=\"'No extension packages to display.' | translate\"\n        *ngIf=\"!packages?.length\"\n        [horizontal]=\"true\"\n      ></c8y-ui-empty-state>\n\n      <div\n        class=\"c8y-wizard-list-nav\"\n        style=\"min-height: 257px\"\n        *ngIf=\"packages?.length\"\n      >\n        <button\n          class=\"list-group-item text-truncate bg-component\"\n          title=\"{{ package.name }}\"\n          type=\"button\"\n          *ngFor=\"let package of packages\"\n          (click)=\"selectPackage(package)\"\n        >\n          <i\n            class=\"list-group-icon\"\n            c8yIcon=\"big-parcel\"\n          ></i>\n          <span [innerText]=\"package.name\"></span>\n        </button>\n      </div>\n    </div>\n  </ng-container>\n  <ng-container *ngIf=\"!isDeployed && selectedPackage\">\n    <p class=\"p-16 text-center text-medium separator-bottom sticky-top bg-level-0\">\n      {{ 'Provide application details' | translate }}\n    </p>\n    <div\n      class=\"d-flex d-col a-i-center j-c-center\"\n      style=\"min-height: 257px\"\n    >\n      <c8y-application-properties-form\n        class=\"d-block fit-w\"\n        *ngIf=\"!inProgress\"\n        [application]=\"newAppConfig\"\n      ></c8y-application-properties-form>\n\n      <ng-container *ngIf=\"!inProgress\">\n        <div\n          class=\"d-block fit-w bg-gray-white\"\n          [ngStyle]=\"{ padding: '0 16px' }\"\n        >\n          <label\n            for=\"packageVersion\"\n            translate\n          >\n            Use extension package version\n          </label>\n          <c8y-form-group>\n            <c8y-typeahead\n              placeholder=\"{{ 'Select or enter' | translate }}\"\n              name=\"packageVersion\"\n              [(ngModel)]=\"model.selected\"\n              (onSearch)=\"onInput.next($event)\"\n              [displayProperty]=\"'version'\"\n              [required]=\"true\"\n              [hideNew]=\"true\"\n              [container]=\"'body'\"\n            >\n              <c8y-li\n                class=\"p-l-8 p-r-8 c8y-list__item--link\"\n                *c8yFor=\"let version of versions$; loadMore: 'auto'; notFound: notFoundTemplate\"\n                (click)=\"onAppVersionSelect(version)\"\n                [active]=\"model.selected === version\"\n              >\n                <c8y-li-icon icon=\"big-parcel\"></c8y-li-icon>\n                <span\n                  [ngStyle]=\"{\n                    display: 'flex',\n                    'flex-direction': 'row',\n                    'align-content': 'center',\n                    'justify-content': 'space-between',\n                    'align-items': 'center'\n                  }\"\n                >\n                  <c8y-highlight\n                    [text]=\"version.version || '--'\"\n                    [pattern]=\"onInput | async\"\n                  ></c8y-highlight>\n\n                  <span>\n                    <span\n                      class=\"label label-info m-l-4\"\n                      *ngFor=\"let tag of version.tags\"\n                    >\n                      {{ tag }}\n                    </span>\n                  </span>\n                </span>\n              </c8y-li>\n              <ng-template #notFoundTemplate>\n                <c8y-li\n                  class=\"bg-gray-lighter p-8\"\n                  *ngIf=\"(onInput | async)?.length > 0 && (versions$ | async)?.data?.length === 0\"\n                >\n                  <span translate>No match found.</span>\n                </c8y-li>\n              </ng-template>\n            </c8y-typeahead>\n          </c8y-form-group>\n        </div>\n      </ng-container>\n\n      <c8y-loading\n        class=\"text-center d-block\"\n        [message]=\"'Installing\u2026' | translate\"\n        *ngIf=\"inProgress\"\n        layout=\"application\"\n      ></c8y-loading>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"isDeployed\">\n    <div\n      class=\"d-flex a-i-center j-c-center\"\n      style=\"min-height: 257px\"\n      *ngIf=\"deployedWithSuccess; else failedDeploy\"\n    >\n      <c8y-operation-result\n        class=\"lead\"\n        type=\"success\"\n        text=\"{{ 'Application created' | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n      ></c8y-operation-result>\n    </div>\n    <ng-template #failedDeploy>\n      <div\n        class=\"d-flex a-i-center j-c-center\"\n        style=\"min-height: 257px\"\n      >\n        <c8y-operation-result\n          class=\"lead\"\n          type=\"error\"\n          text=\"{{ 'Application creation failed' | translate }}\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n        ></c8y-operation-result>\n      </div>\n    </ng-template>\n  </ng-container>\n</c8y-wizard-body>\n\n<c8y-wizard-footer>\n  <button\n    class=\"btn btn-default\"\n    title=\"{{ 'Back' | translate }}\"\n    type=\"button\"\n    *ngIf=\"!isDeployed\"\n    (click)=\"selectedPackage ? clean() : back()\"\n    [disabled]=\"inProgress\"\n  >\n    {{ 'Back' | translate }}\n  </button>\n  <button\n    class=\"btn btn-default\"\n    title=\"{{ isDeployed && deployedWithSuccess ? ('Close' | translate) : ('Cancel' | translate) }}\"\n    type=\"button\"\n    (click)=\"cancel()\"\n  >\n    {{ isDeployed && deployedWithSuccess ? ('Close' | translate) : ('Cancel' | translate) }}\n  </button>\n\n  <button\n    class=\"btn btn-primary\"\n    title=\"{{ 'Install' | translate }}\"\n    type=\"button\"\n    (click)=\"deployApp()\"\n    [disabled]=\"inProgress || !packages?.length\"\n    *ngIf=\"!isDeployed\"\n  >\n    {{ 'Install' | translate }}\n  </button>\n</c8y-wizard-footer>\n", dependencies: [{ kind: "component", type: WizardHeaderComponent, selector: "c8y-wizard-header" }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: WizardBodyComponent, selector: "c8y-wizard-body" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ApplicationPropertiesFormComponent, selector: "c8y-application-properties-form", inputs: ["application", "disabled"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "component", type: TypeaheadComponent, selector: "c8y-typeahead", inputs: ["required", "maxlength", "disabled", "allowFreeEntries", "placeholder", "displayProperty", "icon", "name", "autoClose", "hideNew", "container", "selected", "highlightFirstItem"], outputs: ["onSearch", "onIconClick"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { 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: 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: HighlightComponent, selector: "c8y-highlight", inputs: ["pattern", "text", "elementClass", "shouldTrimPattern"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "component", type: OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "component", type: WizardFooterComponent, selector: "c8y-wizard-footer" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: InstallFromPackageComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-install-from-package', standalone: false, template: "<c8y-wizard-header>\n  <i [c8yIcon]=\"'big-parcel'\"></i>\n  <h4\n    id=\"modal-title\"\n    translate\n  >\n    Install from extension package\n  </h4>\n</c8y-wizard-header>\n<c8y-wizard-body>\n  <ng-container *ngIf=\"!selectedPackage\">\n    <div\n      class=\"modal-inner-scroll\"\n      id=\"modal-body\"\n    >\n      <p class=\"p-16 text-medium text-center separator-bottom sticky-top bg-level-0\">\n        {{ 'Select from available extension packages' | translate }}\n      </p>\n\n      <c8y-ui-empty-state\n        [icon]=\"'big-parcel'\"\n        [title]=\"'No extension packages to display.' | translate\"\n        *ngIf=\"!packages?.length\"\n        [horizontal]=\"true\"\n      ></c8y-ui-empty-state>\n\n      <div\n        class=\"c8y-wizard-list-nav\"\n        style=\"min-height: 257px\"\n        *ngIf=\"packages?.length\"\n      >\n        <button\n          class=\"list-group-item text-truncate bg-component\"\n          title=\"{{ package.name }}\"\n          type=\"button\"\n          *ngFor=\"let package of packages\"\n          (click)=\"selectPackage(package)\"\n        >\n          <i\n            class=\"list-group-icon\"\n            c8yIcon=\"big-parcel\"\n          ></i>\n          <span [innerText]=\"package.name\"></span>\n        </button>\n      </div>\n    </div>\n  </ng-container>\n  <ng-container *ngIf=\"!isDeployed && selectedPackage\">\n    <p class=\"p-16 text-center text-medium separator-bottom sticky-top bg-level-0\">\n      {{ 'Provide application details' | translate }}\n    </p>\n    <div\n      class=\"d-flex d-col a-i-center j-c-center\"\n      style=\"min-height: 257px\"\n    >\n      <c8y-application-properties-form\n        class=\"d-block fit-w\"\n        *ngIf=\"!inProgress\"\n        [application]=\"newAppConfig\"\n      ></c8y-application-properties-form>\n\n      <ng-container *ngIf=\"!inProgress\">\n        <div\n          class=\"d-block fit-w bg-gray-white\"\n          [ngStyle]=\"{ padding: '0 16px' }\"\n        >\n          <label\n            for=\"packageVersion\"\n            translate\n          >\n            Use extension package version\n          </label>\n          <c8y-form-group>\n            <c8y-typeahead\n              placeholder=\"{{ 'Select or enter' | translate }}\"\n              name=\"packageVersion\"\n              [(ngModel)]=\"model.selected\"\n              (onSearch)=\"onInput.next($event)\"\n              [displayProperty]=\"'version'\"\n              [required]=\"true\"\n              [hideNew]=\"true\"\n              [container]=\"'body'\"\n            >\n              <c8y-li\n                class=\"p-l-8 p-r-8 c8y-list__item--link\"\n                *c8yFor=\"let version of versions$; loadMore: 'auto'; notFound: notFoundTemplate\"\n                (click)=\"onAppVersionSelect(version)\"\n                [active]=\"model.selected === version\"\n              >\n                <c8y-li-icon icon=\"big-parcel\"></c8y-li-icon>\n                <span\n                  [ngStyle]=\"{\n                    display: 'flex',\n                    'flex-direction': 'row',\n                    'align-content': 'center',\n                    'justify-content': 'space-between',\n                    'align-items': 'center'\n                  }\"\n                >\n                  <c8y-highlight\n                    [text]=\"version.version || '--'\"\n                    [pattern]=\"onInput | async\"\n                  ></c8y-highlight>\n\n                  <span>\n                    <span\n                      class=\"label label-info m-l-4\"\n                      *ngFor=\"let tag of version.tags\"\n                    >\n                      {{ tag }}\n                    </span>\n                  </span>\n                </span>\n              </c8y-li>\n              <ng-template #notFoundTemplate>\n                <c8y-li\n                  class=\"bg-gray-lighter p-8\"\n                  *ngIf=\"(onInput | async)?.length > 0 && (versions$ | async)?.data?.length === 0\"\n                >\n                  <span translate>No match found.</span>\n                </c8y-li>\n              </ng-template>\n            </c8y-typeahead>\n          </c8y-form-group>\n        </div>\n      </ng-container>\n\n      <c8y-loading\n        class=\"text-center d-block\"\n        [message]=\"'Installing\u2026' | translate\"\n        *ngIf=\"inProgress\"\n        layout=\"application\"\n      ></c8y-loading>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"isDeployed\">\n    <div\n      class=\"d-flex a-i-center j-c-center\"\n      style=\"min-height: 257px\"\n      *ngIf=\"deployedWithSuccess; else failedDeploy\"\n    >\n      <c8y-operation-result\n        class=\"lead\"\n        type=\"success\"\n        text=\"{{ 'Application created' | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n      ></c8y-operation-result>\n    </div>\n    <ng-template #failedDeploy>\n      <div\n        class=\"d-flex a-i-center j-c-center\"\n        style=\"min-height: 257px\"\n      >\n        <c8y-operation-result\n          class=\"lead\"\n          type=\"error\"\n          text=\"{{ 'Application creation failed' | translate }}\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n        ></c8y-operation-result>\n      </div>\n    </ng-template>\n  </ng-container>\n</c8y-wizard-body>\n\n<c8y-wizard-footer>\n  <button\n    class=\"btn btn-default\"\n    title=\"{{ 'Back' | translate }}\"\n    type=\"button\"\n    *ngIf=\"!isDeployed\"\n    (click)=\"selectedPackage ? clean() : back()\"\n    [disabled]=\"inProgress\"\n  >\n    {{ 'Back' | translate }}\n  </button>\n  <button\n    class=\"btn btn-default\"\n    title=\"{{ isDeployed && deployedWithSuccess ? ('Close' | translate) : ('Cancel' | translate) }}\"\n    type=\"button\"\n    (click)=\"cancel()\"\n  >\n    {{ isDeployed && deployedWithSuccess ? ('Close' | translate) : ('Cancel' | translate) }}\n  </button>\n\n  <button\n    class=\"btn btn-primary\"\n    title=\"{{ 'Install' | translate }}\"\n    type=\"button\"\n    (click)=\"deployApp()\"\n    [disabled]=\"inProgress || !packages?.length\"\n    *ngIf=\"!isDeployed\"\n  >\n    {{ 'Install' | translate }}\n  </button>\n</c8y-wizard-footer>\n" }]
+            args: [{ selector: 'c8y-install-from-package', imports: [
+                        WizardHeaderComponent,
+                        IconDirective,
+                        C8yTranslateDirective,
+                        WizardBodyComponent,
+                        NgIf,
+                        EmptyStateComponent,
+                        NgFor,
+                        ApplicationPropertiesFormComponent,
+                        NgStyle,
+                        FormGroupComponent,
+                        TypeaheadComponent,
+                        FormsModule,
+                        ForOfDirective,
+                        ListItemComponent,
+                        ListItemIconComponent,
+                        HighlightComponent,
+                        LoadingComponent,
+                        OperationResultComponent,
+                        WizardFooterComponent,
+                        C8yTranslatePipe,
+                        AsyncPipe
+                    ], template: "<c8y-wizard-header>\n  <i [c8yIcon]=\"'big-parcel'\"></i>\n  <h4\n    id=\"modal-title\"\n    translate\n  >\n    Install from extension package\n  </h4>\n</c8y-wizard-header>\n<c8y-wizard-body>\n  <ng-container *ngIf=\"!selectedPackage\">\n    <div\n      class=\"modal-inner-scroll\"\n      id=\"modal-body\"\n    >\n      <p class=\"p-16 text-medium text-center separator-bottom sticky-top bg-level-0\">\n        {{ 'Select from available extension packages' | translate }}\n      </p>\n\n      <c8y-ui-empty-state\n        [icon]=\"'big-parcel'\"\n        [title]=\"'No extension packages to display.' | translate\"\n        *ngIf=\"!packages?.length\"\n        [horizontal]=\"true\"\n      ></c8y-ui-empty-state>\n\n      <div\n        class=\"c8y-wizard-list-nav\"\n        style=\"min-height: 257px\"\n        *ngIf=\"packages?.length\"\n      >\n        <button\n          class=\"list-group-item text-truncate bg-component\"\n          title=\"{{ package.name }}\"\n          type=\"button\"\n          *ngFor=\"let package of packages\"\n          (click)=\"selectPackage(package)\"\n        >\n          <i\n            class=\"list-group-icon\"\n            c8yIcon=\"big-parcel\"\n          ></i>\n          <span [innerText]=\"package.name\"></span>\n        </button>\n      </div>\n    </div>\n  </ng-container>\n  <ng-container *ngIf=\"!isDeployed && selectedPackage\">\n    <p class=\"p-16 text-center text-medium separator-bottom sticky-top bg-level-0\">\n      {{ 'Provide application details' | translate }}\n    </p>\n    <div\n      class=\"d-flex d-col a-i-center j-c-center\"\n      style=\"min-height: 257px\"\n    >\n      <c8y-application-properties-form\n        class=\"d-block fit-w\"\n        *ngIf=\"!inProgress\"\n        [application]=\"newAppConfig\"\n      ></c8y-application-properties-form>\n\n      <ng-container *ngIf=\"!inProgress\">\n        <div\n          class=\"d-block fit-w bg-gray-white\"\n          [ngStyle]=\"{ padding: '0 16px' }\"\n        >\n          <label\n            for=\"packageVersion\"\n            translate\n          >\n            Use extension package version\n          </label>\n          <c8y-form-group>\n            <c8y-typeahead\n              placeholder=\"{{ 'Select or enter' | translate }}\"\n              name=\"packageVersion\"\n              [(ngModel)]=\"model.selected\"\n              (onSearch)=\"onInput.next($event)\"\n              [displayProperty]=\"'version'\"\n              [required]=\"true\"\n              [hideNew]=\"true\"\n              [container]=\"'body'\"\n            >\n              <c8y-li\n                class=\"p-l-8 p-r-8 c8y-list__item--link\"\n                *c8yFor=\"let version of versions$; loadMore: 'auto'; notFound: notFoundTemplate\"\n                (click)=\"onAppVersionSelect(version)\"\n                [active]=\"model.selected === version\"\n              >\n                <c8y-li-icon icon=\"big-parcel\"></c8y-li-icon>\n                <span\n                  [ngStyle]=\"{\n                    display: 'flex',\n                    'flex-direction': 'row',\n                    'align-content': 'center',\n                    'justify-content': 'space-between',\n                    'align-items': 'center'\n                  }\"\n                >\n                  <c8y-highlight\n                    [text]=\"version.version || '--'\"\n                    [pattern]=\"onInput | async\"\n                  ></c8y-highlight>\n\n                  <span>\n                    <span\n                      class=\"label label-info m-l-4\"\n                      *ngFor=\"let tag of version.tags\"\n                    >\n                      {{ tag }}\n                    </span>\n                  </span>\n                </span>\n              </c8y-li>\n              <ng-template #notFoundTemplate>\n                <c8y-li\n                  class=\"bg-gray-lighter p-8\"\n                  *ngIf=\"(onInput | async)?.length > 0 && (versions$ | async)?.data?.length === 0\"\n                >\n                  <span translate>No match found.</span>\n                </c8y-li>\n              </ng-template>\n            </c8y-typeahead>\n          </c8y-form-group>\n        </div>\n      </ng-container>\n\n      <c8y-loading\n        class=\"text-center d-block\"\n        [message]=\"'Installing\u2026' | translate\"\n        *ngIf=\"inProgress\"\n        layout=\"application\"\n      ></c8y-loading>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"isDeployed\">\n    <div\n      class=\"d-flex a-i-center j-c-center\"\n      style=\"min-height: 257px\"\n      *ngIf=\"deployedWithSuccess; else failedDeploy\"\n    >\n      <c8y-operation-result\n        class=\"lead\"\n        type=\"success\"\n        text=\"{{ 'Application created' | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n      ></c8y-operation-result>\n    </div>\n    <ng-template #failedDeploy>\n      <div\n        class=\"d-flex a-i-center j-c-center\"\n        style=\"min-height: 257px\"\n      >\n        <c8y-operation-result\n          class=\"lead\"\n          type=\"error\"\n          text=\"{{ 'Application creation failed' | translate }}\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n        ></c8y-operation-result>\n      </div>\n    </ng-template>\n  </ng-container>\n</c8y-wizard-body>\n\n<c8y-wizard-footer>\n  <button\n    class=\"btn btn-default\"\n    title=\"{{ 'Back' | translate }}\"\n    type=\"button\"\n    *ngIf=\"!isDeployed\"\n    (click)=\"selectedPackage ? clean() : back()\"\n    [disabled]=\"inProgress\"\n  >\n    {{ 'Back' | translate }}\n  </button>\n  <button\n    class=\"btn btn-default\"\n    title=\"{{ isDeployed && deployedWithSuccess ? ('Close' | translate) : ('Cancel' | translate) }}\"\n    type=\"button\"\n    (click)=\"cancel()\"\n  >\n    {{ isDeployed && deployedWithSuccess ? ('Close' | translate) : ('Cancel' | translate) }}\n  </button>\n\n  <button\n    class=\"btn btn-primary\"\n    title=\"{{ 'Install' | translate }}\"\n    type=\"button\"\n    (click)=\"deployApp()\"\n    [disabled]=\"inProgress || !packages?.length\"\n    *ngIf=\"!isDeployed\"\n  >\n    {{ 'Install' | translate }}\n  </button>\n</c8y-wizard-footer>\n" }]
         }], ctorParameters: () => [{ type: i1.EcosystemService }, { type: i4.ApplicationService }, { type: i2.WizardComponent }, { type: i2.PluginsService }], propDecorators: { applicationPropertiesForm: [{
                 type: ViewChild,
                 args: [ApplicationPropertiesFormComponent]
@@ -1345,841 +1068,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
             type: Injectable
         }], ctorParameters: () => [{ type: i1$2.Router }] });
 
-class OnlyLatestFilterComponent {
-    constructor(filterComponent) {
-        this.filterComponent = filterComponent;
-        this.filterLabel = gettext('Only latest versions');
-        this.onlyLatestFormControl = new FormControl(true);
-        this.filterComponent.formGroup.controls.custom.addControl(this.filterLabel, this.onlyLatestFormControl);
-        filterComponent.customFilters.set(this.filterLabel, (plugin, enabled) => {
-            return !enabled || !!plugin.tags?.includes('latest');
-        });
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: OnlyLatestFilterComponent, deps: [{ token: i1.ListFiltersComponent }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: OnlyLatestFilterComponent, isStandalone: false, selector: "c8y-only-latest-filter", ngImport: i0, template: "<label class=\"c8y-switch\">\n  <input\n    type=\"checkbox\"\n    checked=\"checked\"\n    [formControl]=\"onlyLatestFormControl\"\n  />\n  <span></span>\n  {{ 'Show only latest version of plugins' | translate }}\n</label>\n", dependencies: [{ kind: "directive", type: i2$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: OnlyLatestFilterComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'c8y-only-latest-filter', standalone: false, template: "<label class=\"c8y-switch\">\n  <input\n    type=\"checkbox\"\n    checked=\"checked\"\n    [formControl]=\"onlyLatestFormControl\"\n  />\n  <span></span>\n  {{ 'Show only latest version of plugins' | translate }}\n</label>\n" }]
-        }], ctorParameters: () => [{ type: i1.ListFiltersComponent }] });
-
-class InstallPluginComponent {
-    constructor(bottomDrawerRef, ecosystemService, pluginsService) {
-        this.bottomDrawerRef = bottomDrawerRef;
-        this.ecosystemService = ecosystemService;
-        this.pluginsService = pluginsService;
-        this.filteredPlugins$ = new BehaviorSubject([]);
-        this.selectedPlugins = [];
-        this.packageTypes = defaultPackageTypes;
-        this.result = new Promise((resolve, reject) => {
-            this._install = resolve;
-            this._cancel = reject;
-        });
-        this.onlyLatestPluginVersion = true;
-    }
-    setFilterPipe(filterPipe) {
-        this.filteredPlugins$ = this.plugins$.pipe(map$1(plugins => plugins.map(plugin => {
-            plugin.filterProps = this.ecosystemService.getAppFilterProps(plugin.originApp);
-            return plugin;
-        })), src => filterPipe(src));
-    }
-    cancel() {
-        this.bottomDrawerRef.close();
-        this._cancel();
-    }
-    install() {
-        this._install(this.selectedPlugins);
-        this.bottomDrawerRef.close();
-    }
-    async showPluginOverview(plugin) {
-        this.selectedPlugin = plugin;
-        const baseUrl = `/apps/${plugin.id}/`;
-        this.pluginBaseUrl = baseUrl;
-        this.pluginMarkdown = await this.pluginsService.getReadmeFileContent(baseUrl);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: InstallPluginComponent, deps: [{ token: i2.BottomDrawerRef }, { token: i1.EcosystemService }, { token: i2.PluginsService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: InstallPluginComponent, isStandalone: false, selector: "c8y-install-plugin", inputs: { plugins$: "plugins$" }, host: { classAttribute: "d-contents" }, ngImport: i0, template: "  <div class=\"card-header gap-8 d-col p-l-24 p-r-24 separator-bottom flex-no-shrink\">\n    <div\n      class=\"card-title h4 text-center\"\n      translate\n    >\n      Available plugins\n    </div>\n    <c8y-list-filters\n      (filterPipeChange)=\"setFilterPipe($event)\"\n      [packageTypes]=\"packageTypes\"\n    >\n      <c8y-archived-filter></c8y-archived-filter>\n      <c8y-only-latest-filter></c8y-only-latest-filter>\n    </c8y-list-filters>\n  </div>\n  <div class=\"d-grid grid__col--5-7--md min-height-0 flex-grow\">\n    <c8y-plugin-list\n      class=\"inner-scroll bg-level-1\"\n      (selectedItems)=\"selectedPlugins = $event\"\n      [emptyListText]=\"'No matching plugins' | translate\"\n      [plugins$]=\"filteredPlugins$\"\n      [selectable]=\"true\"\n      [selectedPlugin]=\"selectedPlugin\"\n      (showOverview)=\"showPluginOverview($event)\"\n    ></c8y-plugin-list>\n    <div class=\"inner-scroll bg-component\">\n      <div class=\"card-header separator sticky-top bg-inherit\"\n        *ngIf=\"pluginMarkdown\">\n        <button\n          class=\"m-l-auto btn-clean\"\n          title=\"{{ 'Close' | translate }}\"\n          type=\"button\"\n          (click)=\"selectedPlugin = null; pluginMarkdown = null\"\n        >\n          <i c8yIcon=\"times\"></i>\n        </button>\n      </div>\n      <div class=\"card-block p-l-24 p-r-24\">\n        <div\n          class=\"markdown-content\"\n          *ngIf=\"pluginMarkdown\"\n          [innerHTML]=\"pluginMarkdown | markdownToHtml: { baseUrl: pluginBaseUrl } | async\"\n        ></div>\n        <c8y-ui-empty-state\n          [icon]=\"'user-manual'\"\n          [title]=\"'No plugin selected' | translate\"\n          [subtitle]=\"\n            'Select a plugin from the list to view its documentation.' | translate\"\n          *ngIf=\"!pluginMarkdown\"\n          [horizontal]=\"true\"\n        >\n          <p>\n            <small >\n              {{ 'Documentation availability varies by plugin.' | translate }}\n            </small>\n          </p>\n       </c8y-ui-empty-state>\n      </div>\n    </div>\n  </div>\n  <div class=\"text-center card-footer p-24 separator\">\n    <button\n      class=\"btn btn-default\"\n      title=\"{{ 'Cancel' | translate }}\"\n      type=\"button\"\n      (click)=\"cancel()\"\n      data-cy=\"install-plugin--cancel-button\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Install' | translate }}\"\n      type=\"button\"\n      (click)=\"install()\"\n      [disabled]=\"selectedPlugins.length === 0\"\n      data-cy=\"install-plugin--install-button\"\n    >\n      {{ 'Install' | translate }}\n      <span\n        class=\"badge\"\n        *ngIf=\"selectedPlugins.length as length\"\n      >\n        {{ length }}\n      </span>\n    </button>\n  </div>\n\n", dependencies: [{ kind: "component", type: i2.EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1.ListFiltersComponent, selector: "c8y-list-filters", inputs: ["packageTypes", "packageAvailabilities", "packageContents"], outputs: ["filterPipeChange"] }, { kind: "component", type: i1.ArchivedFilterComponent, selector: "c8y-archived-filter" }, { kind: "component", type: PluginListComponent, selector: "c8y-plugin-list", inputs: ["plugins$", "emptyListText", "selectable", "hideSource", "installable", "package", "selectedPlugin"], outputs: ["selectedItems", "showOverview"] }, { kind: "component", type: OnlyLatestFilterComponent, selector: "c8y-only-latest-filter" }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.MarkdownToHtmlPipe, name: "markdownToHtml" }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: InstallPluginComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'c8y-install-plugin', host: { class: 'd-contents' }, standalone: false, template: "  <div class=\"card-header gap-8 d-col p-l-24 p-r-24 separator-bottom flex-no-shrink\">\n    <div\n      class=\"card-title h4 text-center\"\n      translate\n    >\n      Available plugins\n    </div>\n    <c8y-list-filters\n      (filterPipeChange)=\"setFilterPipe($event)\"\n      [packageTypes]=\"packageTypes\"\n    >\n      <c8y-archived-filter></c8y-archived-filter>\n      <c8y-only-latest-filter></c8y-only-latest-filter>\n    </c8y-list-filters>\n  </div>\n  <div class=\"d-grid grid__col--5-7--md min-height-0 flex-grow\">\n    <c8y-plugin-list\n      class=\"inner-scroll bg-level-1\"\n      (selectedItems)=\"selectedPlugins = $event\"\n      [emptyListText]=\"'No matching plugins' | translate\"\n      [plugins$]=\"filteredPlugins$\"\n      [selectable]=\"true\"\n      [selectedPlugin]=\"selectedPlugin\"\n      (showOverview)=\"showPluginOverview($event)\"\n    ></c8y-plugin-list>\n    <div class=\"inner-scroll bg-component\">\n      <div class=\"card-header separator sticky-top bg-inherit\"\n        *ngIf=\"pluginMarkdown\">\n        <button\n          class=\"m-l-auto btn-clean\"\n          title=\"{{ 'Close' | translate }}\"\n          type=\"button\"\n          (click)=\"selectedPlugin = null; pluginMarkdown = null\"\n        >\n          <i c8yIcon=\"times\"></i>\n        </button>\n      </div>\n      <div class=\"card-block p-l-24 p-r-24\">\n        <div\n          class=\"markdown-content\"\n          *ngIf=\"pluginMarkdown\"\n          [innerHTML]=\"pluginMarkdown | markdownToHtml: { baseUrl: pluginBaseUrl } | async\"\n        ></div>\n        <c8y-ui-empty-state\n          [icon]=\"'user-manual'\"\n          [title]=\"'No plugin selected' | translate\"\n          [subtitle]=\"\n            'Select a plugin from the list to view its documentation.' | translate\"\n          *ngIf=\"!pluginMarkdown\"\n          [horizontal]=\"true\"\n        >\n          <p>\n            <small >\n              {{ 'Documentation availability varies by plugin.' | translate }}\n            </small>\n          </p>\n       </c8y-ui-empty-state>\n      </div>\n    </div>\n  </div>\n  <div class=\"text-center card-footer p-24 separator\">\n    <button\n      class=\"btn btn-default\"\n      title=\"{{ 'Cancel' | translate }}\"\n      type=\"button\"\n      (click)=\"cancel()\"\n      data-cy=\"install-plugin--cancel-button\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Install' | translate }}\"\n      type=\"button\"\n      (click)=\"install()\"\n      [disabled]=\"selectedPlugins.length === 0\"\n      data-cy=\"install-plugin--install-button\"\n    >\n      {{ 'Install' | translate }}\n      <span\n        class=\"badge\"\n        *ngIf=\"selectedPlugins.length as length\"\n      >\n        {{ length }}\n      </span>\n    </button>\n  </div>\n\n" }]
-        }], ctorParameters: () => [{ type: i2.BottomDrawerRef }, { type: i1.EcosystemService }, { type: i2.PluginsService }], propDecorators: { plugins$: [{
-                type: Input
-            }] } });
-
-class LabelCellRendererComponent {
-    constructor(context) {
-        this.context = context;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: LabelCellRendererComponent, deps: [{ token: i2.CellRendererContext }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: LabelCellRendererComponent, isStandalone: false, selector: "c8y-label-cell-renderer", ngImport: i0, template: "<span class=\"label label-info\">{{ context.value }}</span>\n" }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: LabelCellRendererComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'c8y-label-cell-renderer', standalone: false, template: "<span class=\"label label-info\">{{ context.value }}</span>\n" }]
-        }], ctorParameters: () => [{ type: i2.CellRendererContext }] });
-
-class OrphanedStatusCellRendererComponent {
-    constructor(context) {
-        this.context = context;
-        this.label = this.getLabel(context.value);
-    }
-    getLabel(statusValue) {
-        switch (statusValue) {
-            case ApplicationPluginStatus.OUTDATED:
-                return {
-                    value: statusValue,
-                    text: gettext('OUTDATED`plugin status`'),
-                    class: 'label-warning'
-                };
-            case ApplicationPluginStatus.ORPHANED:
-                return {
-                    value: statusValue,
-                    text: gettext('ORPHANED`plugin status`'),
-                    class: 'label-danger'
-                };
-            case ApplicationPluginStatus.REVOKED:
-                return {
-                    value: statusValue,
-                    text: gettext('REVOKED`plugin status`'),
-                    class: 'label-danger'
-                };
-            case ApplicationPluginStatus.LATEST:
-                return {
-                    value: statusValue,
-                    text: gettext('LATEST`plugin status`'),
-                    class: 'label-success'
-                };
-            case ApplicationPluginStatus.AUTO:
-                return {
-                    value: statusValue,
-                    text: gettext('AUTO`plugin status`'),
-                    class: 'label-success'
-                };
-            default:
-                return null;
-        }
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: OrphanedStatusCellRendererComponent, deps: [{ token: i2.CellRendererContext }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: OrphanedStatusCellRendererComponent, isStandalone: false, selector: "c8y-orphaned-status-cell-renderer", ngImport: i0, template: "<span\n  *ngIf=\"label\"\n  class=\"label\"\n  [ngClass]=\"label.class\"\n  [title]=\"label.text | translate\"\n>\n  {{ label.text | translate }}\n</span>\n", dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: OrphanedStatusCellRendererComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'c8y-orphaned-status-cell-renderer', standalone: false, template: "<span\n  *ngIf=\"label\"\n  class=\"label\"\n  [ngClass]=\"label.class\"\n  [title]=\"label.text | translate\"\n>\n  {{ label.text | translate }}\n</span>\n" }]
-        }], ctorParameters: () => [{ type: i2.CellRendererContext }] });
-
-class UpdatePluginOfAppComponent {
-    constructor(bsModalRef, pluginsService, alert, ecosystemService, gainsightService) {
-        this.bsModalRef = bsModalRef;
-        this.pluginsService = pluginsService;
-        this.alert = alert;
-        this.ecosystemService = ecosystemService;
-        this.gainsightService = gainsightService;
-        this.CURRENT_LOCATION = location.href;
-        this.result = new Promise((resolve, reject) => {
-            this._install = resolve;
-            this._cancel = reject;
-        });
-        this.updateAll = true;
-    }
-    async update() {
-        const remotes = this.pluginsService.getMFRemotes(this.app);
-        const oldRemotePath = `${this.plugin.contextPath}@${this.plugin.version}`;
-        const newRemotePath = `${this.plugin.contextPath}@${this.applicationVersion.version}`;
-        let oldRemoteModules = [...(remotes[oldRemotePath] || [])];
-        if (!oldRemoteModules.length) {
-            this.alert.warning(gettext('Could not change the version of plugin.'));
-            this.cancel();
-            return;
-        }
-        const isArchived = await this.ecosystemService.verifyArchived([this.plugin]);
-        if (!isArchived) {
-            this.alert.warning(gettext('Plugin update aborted by user.'));
-            this.cancel();
-            return;
-        }
-        const result = await this.ecosystemService.verifyLicenses([this.plugin]);
-        if (!result) {
-            this.alert.warning(gettext('Plugin update aborted by user.'));
-            this.cancel();
-            return;
-        }
-        let remoteModulesOfNewVersion = [...(remotes[newRemotePath] || [])];
-        let olderVersions = {};
-        if (this.updateAll) {
-            olderVersions = Object.keys(remotes)
-                .filter(key => key.startsWith(`${this.plugin.contextPath}@`))
-                .reduceRight((prev, curr) => {
-                prev[curr] = undefined;
-                return prev;
-            }, {});
-            oldRemoteModules = Object.keys(olderVersions)
-                .map(version => remotes[version])
-                .reduceRight((prev, curr) => {
-                prev.push(...curr);
-                return prev;
-            }, []);
-            remoteModulesOfNewVersion.push(...oldRemoteModules);
-        }
-        else {
-            remoteModulesOfNewVersion.push(this.plugin.module);
-            olderVersions[oldRemotePath] = oldRemoteModules.filter(module => module !== this.plugin.module);
-            if (!olderVersions[oldRemotePath].length) {
-                olderVersions[oldRemotePath] = undefined;
-            }
-        }
-        remoteModulesOfNewVersion = uniq(remoteModulesOfNewVersion);
-        const newRemotes = {
-            ...remotes,
-            ...olderVersions,
-            [newRemotePath]: remoteModulesOfNewVersion
-        };
-        try {
-            await this.pluginsService.updateRemotesInAppConfig(this.app, newRemotes);
-            this.alert.success(gettext(`Switched the version of plugin.`));
-            this.gainsightService.triggerEvent(PRODUCT_EXPERIENCE_ECOSYSTEM.APPLICATIONS.EVENTS.INSTALLED_PLUGINS, {
-                component: PRODUCT_EXPERIENCE_ECOSYSTEM.APPLICATIONS.COMPONENTS.UPDATE_PLUGIN_OF_APP,
-                action: PRODUCT_EXPERIENCE_ECOSYSTEM.APPLICATIONS.ACTIONS.CHANGE_PLUGIN_VERSION,
-                result: PRODUCT_EXPERIENCE_ECOSYSTEM.APPLICATIONS.RESULTS.PLUGIN_VERSION_CHANGED,
-                url: this.CURRENT_LOCATION
-            });
-        }
-        catch (e) {
-            this.alert.addServerFailure(e);
-            this.gainsightService.triggerEvent(PRODUCT_EXPERIENCE_ECOSYSTEM.APPLICATIONS.EVENTS.INSTALLED_PLUGINS, {
-                component: PRODUCT_EXPERIENCE_ECOSYSTEM.APPLICATIONS.COMPONENTS.UPDATE_PLUGIN_OF_APP,
-                action: PRODUCT_EXPERIENCE_ECOSYSTEM.APPLICATIONS.ACTIONS.CHANGE_PLUGIN_VERSION,
-                result: PRODUCT_EXPERIENCE_ECOSYSTEM.APPLICATIONS.RESULTS.SERVER_FAILURE,
-                url: this.CURRENT_LOCATION
-            });
-        }
-        this.bsModalRef.hide();
-        this._install();
-    }
-    cancel() {
-        this.bsModalRef.hide();
-        this._cancel();
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UpdatePluginOfAppComponent, deps: [{ token: i1$1.BsModalRef }, { token: i2.PluginsService }, { token: i2.AlertService }, { token: i1.EcosystemService }, { token: i2.GainsightService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: UpdatePluginOfAppComponent, isStandalone: false, selector: "c8y-update-plugin-of-app", ngImport: i0, template: "<div class=\"viewport-modal\">\n  <div class=\"modal-header dialog-header\">\n    <i [c8yIcon]=\"'installing-updates'\"></i>\n    <h4\n      id=\"modal-title\"\n      *ngIf=\"!downgrade\"\n      translate\n    >\n      Update plugin\n    </h4>\n    <h4\n      id=\"modal-title\"\n      *ngIf=\"downgrade\"\n      translate\n    >\n      Downgrade plugin\n    </h4>\n  </div>\n  <div\n    class=\"inner-scroll\"\n    id=\"modal-body\"\n  >\n    <div class=\"card-block p-r-24 p-l-24 sticky-top bg-component separator-bottom\">\n      <c8y-package-version-select\n        [packageContextPath]=\"plugin?.contextPath\"\n        [(ngModel)]=\"applicationVersion\"\n      ></c8y-package-version-select>\n      <div\n        class=\"alert alert-info\"\n        role=\"alert\"\n        *ngIf=\"plugin?.version && plugin.version === applicationVersion?.version\"\n      >\n        <span\n          translate\n          ngNonBindable\n          [translateParams]=\"applicationVersion\"\n        >\n          Select another version, as {{ version }} is currently used.\n        </span>\n      </div>\n      <div class=\"form-group\">\n        <label class=\"c8y-checkbox\">\n          <input\n            type=\"checkbox\"\n            [(ngModel)]=\"updateAll\"\n          />\n          <span></span>\n          <span\n            translate\n            ngNonBindable\n            [translateParams]=\"plugin\"\n          >\n            Set version for all plugins using the same context path \"{{ contextPath }}\".\n          </span>\n        </label>\n      </div>\n      <p class=\"legend form-block\">\n        {{ 'Change log' | translate }}\n      </p>\n    </div>\n    <div class=\"card-block p-l-24 p-r-24\">\n\n      <div\n        class=\"markdown-content markdown-content--to-h3\"\n      >\n        <c8y-contents-changelog\n          [package]=\"plugin.originApp\"\n          [selectedVersion]=\"applicationVersion?.version\"\n          [previousVersion]=\"plugin?.version\"\n        ></c8y-contents-changelog>\n      </div>\n    </div>\n  </div>\n  <div class=\"modal-footer\">\n    <button\n      class=\"btn btn-default\"\n      title=\"{{ 'Cancel' | translate }}\"\n      type=\"button\"\n      (click)=\"cancel()\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Set version' | translate }}\"\n      [disabled]=\"!applicationVersion || plugin?.version === applicationVersion?.version\"\n      (click)=\"update()\"\n    >\n      {{ 'Set version' | translate }}\n    </button>\n  </div>\n</div>", dependencies: [{ kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i1.PackageVersionSelectComponent, selector: "c8y-package-version-select", inputs: ["label", "packageContextPath", "packageId"] }, { kind: "component", type: i1.PackageChangelogComponent, selector: "c8y-contents-changelog", inputs: ["package", "selectedVersion", "previousVersion"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UpdatePluginOfAppComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'c8y-update-plugin-of-app', standalone: false, template: "<div class=\"viewport-modal\">\n  <div class=\"modal-header dialog-header\">\n    <i [c8yIcon]=\"'installing-updates'\"></i>\n    <h4\n      id=\"modal-title\"\n      *ngIf=\"!downgrade\"\n      translate\n    >\n      Update plugin\n    </h4>\n    <h4\n      id=\"modal-title\"\n      *ngIf=\"downgrade\"\n      translate\n    >\n      Downgrade plugin\n    </h4>\n  </div>\n  <div\n    class=\"inner-scroll\"\n    id=\"modal-body\"\n  >\n    <div class=\"card-block p-r-24 p-l-24 sticky-top bg-component separator-bottom\">\n      <c8y-package-version-select\n        [packageContextPath]=\"plugin?.contextPath\"\n        [(ngModel)]=\"applicationVersion\"\n      ></c8y-package-version-select>\n      <div\n        class=\"alert alert-info\"\n        role=\"alert\"\n        *ngIf=\"plugin?.version && plugin.version === applicationVersion?.version\"\n      >\n        <span\n          translate\n          ngNonBindable\n          [translateParams]=\"applicationVersion\"\n        >\n          Select another version, as {{ version }} is currently used.\n        </span>\n      </div>\n      <div class=\"form-group\">\n        <label class=\"c8y-checkbox\">\n          <input\n            type=\"checkbox\"\n            [(ngModel)]=\"updateAll\"\n          />\n          <span></span>\n          <span\n            translate\n            ngNonBindable\n            [translateParams]=\"plugin\"\n          >\n            Set version for all plugins using the same context path \"{{ contextPath }}\".\n          </span>\n        </label>\n      </div>\n      <p class=\"legend form-block\">\n        {{ 'Change log' | translate }}\n      </p>\n    </div>\n    <div class=\"card-block p-l-24 p-r-24\">\n\n      <div\n        class=\"markdown-content markdown-content--to-h3\"\n      >\n        <c8y-contents-changelog\n          [package]=\"plugin.originApp\"\n          [selectedVersion]=\"applicationVersion?.version\"\n          [previousVersion]=\"plugin?.version\"\n        ></c8y-contents-changelog>\n      </div>\n    </div>\n  </div>\n  <div class=\"modal-footer\">\n    <button\n      class=\"btn btn-default\"\n      title=\"{{ 'Cancel' | translate }}\"\n      type=\"button\"\n      (click)=\"cancel()\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Set version' | translate }}\"\n      [disabled]=\"!applicationVersion || plugin?.version === applicationVersion?.version\"\n      (click)=\"update()\"\n    >\n      {{ 'Set version' | translate }}\n    </button>\n  </div>\n</div>" }]
-        }], ctorParameters: () => [{ type: i1$1.BsModalRef }, { type: i2.PluginsService }, { type: i2.AlertService }, { type: i1.EcosystemService }, { type: i2.GainsightService }] });
-
-class ApplicationPluginReadmeComponent {
-    constructor() {
-        this.bottomDrawerRef = inject(BottomDrawerRef);
-        this.pluginsService = inject(PluginsService);
-    }
-    async ngOnInit() {
-        const baseUrl = `/apps/${this.plugin.id}/`;
-        this.pluginBaseUrl = baseUrl;
-        this.pluginMarkdown = await this.pluginsService.getReadmeFileContent(baseUrl);
-    }
-    close() {
-        this.bottomDrawerRef.close();
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ApplicationPluginReadmeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ApplicationPluginReadmeComponent, isStandalone: false, selector: "c8y-application-plugin-readme", host: { classAttribute: "d-contents" }, ngImport: i0, template: "<div class=\"card-header gap-8 d-col p-l-24 p-r-24 separator-bottom flex-no-shrink\">\n  <span class=\"card-title h4 text-center\">\n    {{ plugin.name }}\n  </span>\n</div>\n<div class=\"inner-scroll flex-grow\">\n  <div\n    class=\"markdown-content col-lg-8 p-24 m-l-auto m-r-auto\"\n    style=\"float: none\"\n    *ngIf=\"pluginMarkdown\"\n    [innerHTML]=\"pluginMarkdown | markdownToHtml: { baseUrl: pluginBaseUrl } | async\"\n  ></div>\n  <div class=\"d-flex\">\n    <c8y-ui-empty-state\n      class=\"col-lg-3 col-sm-4 m-l-auto m-r-auto\"\n      [icon]=\"'user-manual'\"\n      [title]=\"'No README.md found for plugin' | translate\"\n      [subtitle]=\"\n        'To view the contents of &quot;README&quot;, add the file &quot;README.md&quot; to the plugin.'\n          | translate\n      \"\n      *ngIf=\"!pluginMarkdown\"\n      [horizontal]=\"true\"\n    ></c8y-ui-empty-state>\n  </div>\n</div>\n<div class=\"text-center card-footer p-24 separator\">\n  <button\n    class=\"btn btn-default\"\n    (click)=\"close()\"\n  >\n    {{ 'Close' | translate }}\n  </button>\n</div>\n", dependencies: [{ kind: "component", type: i2.EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.MarkdownToHtmlPipe, name: "markdownToHtml" }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ApplicationPluginReadmeComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'c8y-application-plugin-readme', host: { class: 'd-contents' }, standalone: false, template: "<div class=\"card-header gap-8 d-col p-l-24 p-r-24 separator-bottom flex-no-shrink\">\n  <span class=\"card-title h4 text-center\">\n    {{ plugin.name }}\n  </span>\n</div>\n<div class=\"inner-scroll flex-grow\">\n  <div\n    class=\"markdown-content col-lg-8 p-24 m-l-auto m-r-auto\"\n    style=\"float: none\"\n    *ngIf=\"pluginMarkdown\"\n    [innerHTML]=\"pluginMarkdown | markdownToHtml: { baseUrl: pluginBaseUrl } | async\"\n  ></div>\n  <div class=\"d-flex\">\n    <c8y-ui-empty-state\n      class=\"col-lg-3 col-sm-4 m-l-auto m-r-auto\"\n      [icon]=\"'user-manual'\"\n      [title]=\"'No README.md found for plugin' | translate\"\n      [subtitle]=\"\n        'To view the contents of &quot;README&quot;, add the file &quot;README.md&quot; to the plugin.'\n          | translate\n      \"\n      *ngIf=\"!pluginMarkdown\"\n      [horizontal]=\"true\"\n    ></c8y-ui-empty-state>\n  </div>\n</div>\n<div class=\"text-center card-footer p-24 separator\">\n  <button\n    class=\"btn btn-default\"\n    (click)=\"close()\"\n  >\n    {{ 'Close' | translate }}\n  </button>\n</div>\n" }]
-        }] });
-
-class ApplicationPluginsComponent {
-    constructor(activatedRoute, ecosystemService, bsModalService, pluginsService, alertService, gainsightService, bottomDrawerService) {
-        this.activatedRoute = activatedRoute;
-        this.ecosystemService = ecosystemService;
-        this.bsModalService = bsModalService;
-        this.pluginsService = pluginsService;
-        this.alertService = alertService;
-        this.gainsightService = gainsightService;
-        this.bottomDrawerService = bottomDrawerService;
-        this.PRODUCT_EXPERIENCE = PRODUCT_EXPERIENCE_ECOSYSTEM;
-        this.CURRENT_LOCATION = location.href;
-        this.remotePlugins$ = new BehaviorSubject({});
-        this.allAvailablePlugins$ = new BehaviorSubject([]);
-        this.selfPlugins$ = new BehaviorSubject([]);
-        this.installedPlugins$ = combineLatest([
-            this.remotePlugins$.pipe(map(remotes => PluginsService.convertInstalledRemotesToIds(remotes))),
-            this.allAvailablePlugins$
-        ]).pipe(map(([remotePlugins, allPlugins]) => this.getInstalledPlugins(allPlugins, remotePlugins)), shareReplay(1));
-        this.orphanedPlugins$ = this.installedPlugins$.pipe(map(plugins => plugins.filter(p => p.status === ApplicationPluginStatus.ORPHANED)));
-        this.isStandard$ = combineLatest([this.installedPlugins$, this.selfPlugins$]).pipe(map(([installedPlugins, selfPlugins]) => {
-            const manifestRemotes = this.app?.manifest?.remotes || {};
-            // ensure that every installed plugin is a self plugin or a plugin from the manifest
-            const allInstalledPluginsAreSelf = installedPlugins.every(p => selfPlugins.some(selfPlugin => selfPlugin.id === p.id) ||
-                (Array.isArray(manifestRemotes[p.contextPath]) &&
-                    manifestRemotes[p.contextPath].includes(p.module)));
-            // ensure that every self plugin is installed
-            const allSelfPluginsAreInstalled = selfPlugins.every(selfPlugin => installedPlugins.some(p => p.id === selfPlugin.id));
-            const configRemotes = this.app?.config?.remotes || {};
-            // ensure that every remote from the manifest is in the config
-            // if no config exists we are also all good
-            const everyRemoteFromManifestIsInConfig = !this.app?.config?.remotes ||
-                Object.keys(manifestRemotes).every(contextPath => Array.isArray(configRemotes[contextPath]) &&
-                    Array.isArray(manifestRemotes[contextPath]) &&
-                    manifestRemotes[contextPath].every(module => configRemotes[contextPath].includes(module)));
-            return (allInstalledPluginsAreSelf &&
-                allSelfPluginsAreInstalled &&
-                everyRemoteFromManifestIsInConfig);
-        }));
-        this.title = gettext('Installed plugins');
-        this.loadMoreItemsLabel = gettext('Load more packages');
-        this.loadingItemsLabel = gettext('Loading packages…');
-        this.actionControls = this.getActionControls();
-        this.bulkActionControls = this.getBulkActionControls();
-        this.headerActionControls = [];
-        this.noResultsMessage = gettext('No plugins to display.');
-        this.noDataMessage = gettext('No plugins installed.');
-        this.noResultsSubtitle = gettext('Refine your search terms or check your spelling.');
-        this.noDataSubtitle = gettext("This application doesn't have any plugin. Click below to install.");
-        this.pagination = {
-            pageSize: 10,
-            currentPage: 1
-        };
-        this.displayOptions = {
-            bordered: false,
-            striped: true,
-            filter: true,
-            gridHeader: true,
-            hover: true
-        };
-        this.columns = [
-            {
-                name: 'name',
-                header: gettext('Plugin name'),
-                path: 'name',
-                filterable: true
-            },
-            {
-                name: 'Version',
-                header: gettext('Version'),
-                path: 'version',
-                filterable: false
-            },
-            {
-                name: 'Tag',
-                header: gettext('Tag`noun`'),
-                path: 'installedViaTag',
-                filterable: false,
-                cellRendererComponent: LabelCellRendererComponent
-            },
-            {
-                name: 'description',
-                header: gettext('Description'),
-                path: 'description',
-                filterable: false,
-                cellCSSClassName: 'small'
-            },
-            {
-                name: 'contextPath',
-                header: gettext('Source'),
-                path: 'contextPath',
-                filterable: false,
-                cellRendererComponent: LabelCellRendererComponent
-            },
-            {
-                name: 'scope',
-                header: gettext('Scope'),
-                path: 'scope',
-                filterable: false,
-                visible: false,
-                cellRendererComponent: LabelCellRendererComponent
-            },
-            {
-                name: 'status',
-                header: gettext('Status'),
-                path: 'status',
-                filterable: false,
-                cellRendererComponent: OrphanedStatusCellRendererComponent
-            }
-        ];
-        this.destroy$ = new Subject();
-    }
-    ngOnInit() {
-        this.addInstallButtonToHeaderActionControls();
-        this.loadData();
-    }
-    async loadData() {
-        this.isLoading = true;
-        await this.getApplicationMO();
-        await this.getApplicationMFRemotes(this.app);
-        await this.getAllApplicationsMFExports(this.app);
-        await this.getAllSelfMFExports(this.app);
-        this.isLoading = false;
-    }
-    async resetToDefault() {
-        this.isLoading = true;
-        await this.pluginsService.resetRemotes(this.app);
-        await this.loadData();
-        this.alertService.success(gettext('The application was reset to its default plugins.'));
-    }
-    async installPlugins() {
-        let currentPlugin = null;
-        try {
-            this.gainsightService.triggerEvent(PRODUCT_EXPERIENCE_ECOSYSTEM.APPLICATIONS.EVENTS.INSTALLED_PLUGINS, {
-                component: PRODUCT_EXPERIENCE_ECOSYSTEM.APPLICATIONS.COMPONENTS.APPLICATION_PLUGINS,
-                action: PRODUCT_EXPERIENCE_ECOSYSTEM.APPLICATIONS.ACTIONS.INSTALL_PLUGINS_INITIATED,
-                url: this.CURRENT_LOCATION,
-                targetApplicationName: this.app.name,
-                targetApplicationContextPath: this.app.contextPath
-            });
-            const drawer = this.bottomDrawerService.openDrawer(InstallPluginComponent, {
-                initialState: this.getInstallModalInitState(),
-                closeOnNavigation: true
-            });
-            const pluginsToAdd = await drawer.instance.result;
-            const isArchived = await this.ecosystemService.verifyArchived(pluginsToAdd);
-            if (!isArchived) {
-                return;
-            }
-            const licensesVerifiedByUser = await this.ecosystemService.verifyLicenses(pluginsToAdd);
-            if (!licensesVerifiedByUser) {
-                return;
-            }
-            const verifyVersionCompatibility = await this.ecosystemService.verifyPluginVersionsCompatibility(pluginsToAdd, this.app);
-            if (!verifyVersionCompatibility) {
-                return;
-            }
-            this.isLoading = true;
-            await this.handleRemotesInstallation(pluginsToAdd);
-            this.alertService.success(gettext('Plugins installed.'));
-            pluginsToAdd.forEach(plugin => {
-                currentPlugin = plugin;
-                this.triggerPluginEvent(plugin, PRODUCT_EXPERIENCE_ECOSYSTEM.APPLICATIONS.RESULTS.PLUGIN_INSTALLED);
-            });
-        }
-        catch (ex) {
-            if (ex) {
-                this.alertService.addServerFailure(ex);
-                this.triggerPluginEvent(currentPlugin, PRODUCT_EXPERIENCE_ECOSYSTEM.APPLICATIONS.RESULTS.SERVER_FAILURE);
-            }
-        }
-        finally {
-            this.isLoading = false;
-        }
-    }
-    async removePlugins(plugins) {
-        let currentPlugin = null;
-        try {
-            this.isLoading = true;
-            const installedPlugins = await firstValueFrom(this.installedPlugins$);
-            const pluginsToRemove = installedPlugins.filter(p => plugins.includes(p.id));
-            const updatedRemotes = await this.pluginsService.removeRemotes(this.app, plugins.map(id => installedPlugins.find(p => p.id === id)));
-            this.emitRemotes(updatedRemotes);
-            this.isLoading = false;
-            this.dataGrid.cancel();
-            this.alertService.success(gettext('Plugins removed.'));
-            pluginsToRemove.forEach(plugin => {
-                currentPlugin = plugin;
-                this.triggerPluginEvent(plugin, PRODUCT_EXPERIENCE_ECOSYSTEM.APPLICATIONS.RESULTS.PLUGIN_REMOVED);
-            });
-        }
-        catch (ex) {
-            if (ex) {
-                this.alertService.addServerFailure(ex);
-                this.triggerPluginEvent(currentPlugin, PRODUCT_EXPERIENCE_ECOSYSTEM.APPLICATIONS.RESULTS.SERVER_FAILURE);
-            }
-        }
-        finally {
-            this.isLoading = false;
-        }
-    }
-    async cleanupOrphanedPlugins(plugins) {
-        const pluginIds = plugins.map(p => p.id);
-        await this.removePlugins(pluginIds);
-    }
-    getActionControls() {
-        return [
-            {
-                type: 'showReadme',
-                text: gettext('Show readme'),
-                icon: 'documents',
-                showIf: (plugin) => {
-                    return !!plugin.readmePath;
-                },
-                callback: plugin => this.showPluginReadme(plugin)
-            },
-            {
-                type: 'customUpdate',
-                text: gettext('Update'),
-                icon: 'installing-updates',
-                showIf: plugin => {
-                    return (plugin.status === ApplicationPluginStatus.OUTDATED ||
-                        plugin.status === ApplicationPluginStatus.REVOKED);
-                },
-                callback: plugin => this.updatePlugin(this.app, plugin)
-            },
-            {
-                type: 'customDowngrade',
-                text: gettext('Downgrade'),
-                icon: 'installing-updates',
-                showIf: (plugin) => {
-                    if (plugin.scope === PluginsExportScopes.SELF ||
-                        plugin.scope === PluginsExportScopes.SELF_OPTIONAL) {
-                        return false;
-                    }
-                    return plugin.status === ApplicationPluginStatus.LATEST;
-                },
-                callback: plugin => this.updatePlugin(this.app, plugin, true)
-            }
-        ];
-    }
-    showPluginReadme(plugin) {
-        this.bottomDrawerService.openDrawer(ApplicationPluginReadmeComponent, {
-            initialState: { plugin },
-            closeOnNavigation: true
-        });
-    }
-    getBulkActionControls() {
-        return [
-            {
-                type: 'customDelete',
-                text: gettext('Remove'),
-                icon: 'trash',
-                callback: plugins => this.removePlugins(plugins)
-            }
-        ];
-    }
-    async updatePlugin(app, plugin, downgrade = false) {
-        try {
-            await this.bsModalService.show(UpdatePluginOfAppComponent, {
-                class: 'modal-md',
-                ariaDescribedby: 'modal-body',
-                ariaLabelledBy: 'modal-title',
-                initialState: {
-                    app,
-                    plugin,
-                    downgrade
-                },
-                ignoreBackdropClick: true
-            }).content.result;
-            this.refresh();
-        }
-        catch (er) {
-            return;
-        }
-    }
-    refresh() {
-        this.loadData();
-    }
-    ngOnDestroy() {
-        this.destroy$.next();
-        this.destroy$.complete();
-    }
-    addInstallButtonToHeaderActionControls() {
-        if (this.appId) {
-            this.headerActionControls = [
-                {
-                    text: gettext('Install plugins'),
-                    callback: () => {
-                        this.installPlugins();
-                    },
-                    icon: 'plus-circle',
-                    type: 'custom'
-                }
-            ];
-        }
-    }
-    async handleRemotesInstallation(plugins) {
-        const updatedRemotes = await this.pluginsService.addRemotes(this.app, plugins);
-        return this.emitRemotes(updatedRemotes);
-    }
-    emitRemotes(pluginsConfig) {
-        const { remotes, excludedRemotes } = pluginsConfig;
-        // needed for first time adding/removing a plugin
-        if (!this.app.config) {
-            this.app.config = {};
-        }
-        this.app.config.remotes = remotes;
-        this.app.config.excludedRemotes = excludedRemotes;
-        const actualRemotes = this.pluginsService.getMFRemotes(this.app);
-        this.remotePlugins$.next(actualRemotes);
-        return { ...this.remotePlugins$.value };
-    }
-    async getApplicationMO() {
-        let id = this.appId;
-        if (!id) {
-            const { id: routeId } = this.activatedRoute.snapshot.parent.data.contextData;
-            id = routeId;
-        }
-        try {
-            this.app = await this.ecosystemService.getApplication(id);
-        }
-        catch (er) {
-            if (er) {
-                this.alertService.addServerFailure(er);
-            }
-        }
-        return this.app;
-    }
-    async getApplicationMFExports(app) {
-        const exports = this.pluginsService.getMFExports(app, [], true);
-        return exports;
-    }
-    async getApplicationMFRemotes(app) {
-        const appConfigRemotes = this.pluginsService.getMFRemotes(app);
-        this.remotePlugins$.next(appConfigRemotes || {});
-    }
-    async getAllApplicationsMFExports(app) {
-        const exportedByCurrentApp = await this.getApplicationMFExports(app);
-        const allAppsMFExports = await this.pluginsService.getAllMFExports(true);
-        this.allAvailablePlugins$.next([...allAppsMFExports, ...exportedByCurrentApp]);
-    }
-    async getAllSelfMFExports(app) {
-        const exportedByCurrentApp = await this.getApplicationMFExports(app);
-        this.selfPlugins$.next(exportedByCurrentApp.filter(({ scope }) => scope === 'self'));
-    }
-    getInstallModalInitState() {
-        return {
-            plugins$: combineLatest([this.allAvailablePlugins$, this.installedPlugins$]).pipe(map(([allPlugins, installedPlugins]) => {
-                // to not mutate the original array and objects contained in it
-                const allPluginsAsNewObjects = allPlugins.map(p => ({ ...p }));
-                for (const plugin of installedPlugins) {
-                    let installedPlugin = allPluginsAsNewObjects.find(p => p.id === plugin.id);
-                    if (!installedPlugin && plugin.installedViaTag) {
-                        installedPlugin = allPluginsAsNewObjects.find(p => p.contextPath === plugin.contextPath &&
-                            p.module === plugin.module &&
-                            p.tags?.includes(plugin.installedViaTag));
-                    }
-                    if (installedPlugin) {
-                        installedPlugin.installed = true;
-                        continue;
-                    }
-                }
-                return allPluginsAsNewObjects.map(p => ({ ...p, installed: !!p.installed }));
-            }), shareReplay(1))
-        };
-    }
-    getOrphanedPlugins(orphanedPluginIds, allPlugins) {
-        const orphanedPlugins = orphanedPluginIds.map(p => this.extractDetails(p));
-        const orphanedPluginsUpdated = orphanedPlugins.map(p => {
-            const pluginWithMatchingTag = allPlugins.find(tmp => tmp.contextPath === p.contextPath &&
-                tmp.module === p.module &&
-                tmp.tags?.includes(p.version || 'latest'));
-            if (pluginWithMatchingTag) {
-                return {
-                    ...pluginWithMatchingTag,
-                    id: p.id,
-                    status: ApplicationPluginStatus.AUTO,
-                    installedViaTag: p.version || 'latest'
-                };
-            }
-            const pluginInDifferentVersion = allPlugins.find(tmp => tmp.contextPath === p.contextPath && tmp.module === p.module);
-            if (pluginInDifferentVersion) {
-                return {
-                    ...pluginInDifferentVersion,
-                    version: p.version,
-                    id: p.id,
-                    status: ApplicationPluginStatus.OUTDATED
-                };
-            }
-            return p;
-        });
-        return orphanedPluginsUpdated;
-    }
-    splitOrphanedPluginsIntoOrphanedAndRevokedPlugins(allPlugins, orphanedPlugins) {
-        const revokedPlugins = new Array();
-        const actuallyOrphanedPlugins = new Array();
-        for (const plugin of orphanedPlugins) {
-            const foundFamiliarPlugin = allPlugins.find(plugin1 => plugin.contextPath === plugin1.contextPath && plugin.module === plugin1.module);
-            if (foundFamiliarPlugin) {
-                revokedPlugins.push(Object.assign({}, foundFamiliarPlugin, plugin, {
-                    status: ApplicationPluginStatus.REVOKED
-                }));
-            }
-            else {
-                actuallyOrphanedPlugins.push(plugin);
-            }
-        }
-        return { revokedPlugins, actuallyOrphanedPlugins };
-    }
-    getInstalledPlugins(allPlugins, remotePlugins) {
-        const availablePlugins = allPlugins
-            .filter(plugin => remotePlugins.includes(plugin.id))
-            .map(plugin => Object.assign(plugin, {
-            status: plugin.tags?.includes('latest')
-                ? ApplicationPluginStatus.LATEST
-                : ApplicationPluginStatus.OUTDATED
-        }));
-        const orphanedPluginIds = remotePlugins.filter(r => !availablePlugins.find(plugin => plugin.id === r));
-        const orphanedPlugins = this.getOrphanedPlugins(orphanedPluginIds, allPlugins);
-        const notActuallyOrphanedPlugins = orphanedPlugins.filter(p => p.status === ApplicationPluginStatus.AUTO);
-        const orphanedOrRevokedPlugins = orphanedPlugins.filter(p => p.status !== ApplicationPluginStatus.AUTO);
-        const { actuallyOrphanedPlugins, revokedPlugins } = this.splitOrphanedPluginsIntoOrphanedAndRevokedPlugins(allPlugins, orphanedOrRevokedPlugins);
-        return [
-            ...availablePlugins,
-            ...notActuallyOrphanedPlugins,
-            ...revokedPlugins,
-            ...actuallyOrphanedPlugins
-        ];
-    }
-    extractDetails(pluginId) {
-        const contextPath = this.getStringMatchingRegex(pluginId, /^[^@]*(@|\/)/);
-        const version = this.getStringMatchingRegex(pluginId, /@.*\//);
-        const module = this.getStringMatchingRegex(pluginId, /\/.*$/);
-        const unavailable = gettext('unavailable`plugin`');
-        return {
-            id: pluginId,
-            idLatest: `${contextPath}/${module}`,
-            path: '',
-            module,
-            name: module,
-            status: ApplicationPluginStatus.ORPHANED,
-            contextPath: contextPath,
-            description: unavailable,
-            version: version
-        };
-    }
-    getStringMatchingRegex(str, regex) {
-        const matches = str.match(regex);
-        const value = matches ? matches[0] : '';
-        return value.replace(/(@|\/)/g, '');
-    }
-    triggerPluginEvent(plugin, result) {
-        const pluginInfo = pick(plugin, [
-            'name',
-            'contextPath',
-            'module',
-            'version',
-            'type',
-            'id'
-        ]);
-        this.gainsightService.triggerEvent(PRODUCT_EXPERIENCE_ECOSYSTEM.APPLICATIONS.EVENTS.INSTALLED_PLUGINS, {
-            component: PRODUCT_EXPERIENCE_ECOSYSTEM.APPLICATIONS.COMPONENTS.APPLICATION_PLUGINS,
-            result,
-            url: this.CURRENT_LOCATION,
-            ...pluginInfo,
-            targetApplicationName: this.app.name,
-            targetApplicationContextPath: this.app.contextPath
-        });
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ApplicationPluginsComponent, deps: [{ token: i1$2.ActivatedRoute }, { token: i1.EcosystemService }, { token: i1$1.BsModalService }, { token: i2.PluginsService }, { token: i2.AlertService }, { token: i2.GainsightService }, { token: i2.BottomDrawerService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ApplicationPluginsComponent, isStandalone: false, selector: "c8y-app-plugins", inputs: { appId: "appId" }, viewQueries: [{ propertyName: "dataGrid", first: true, predicate: DataGridComponent, descendants: true }], ngImport: i0, template: "<c8y-title>{{ app | humanizeAppName | async }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-modules'\"\n    [label]=\"'Applications' | translate\"\n    [path]=\"'ecosystem/application/applications'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"app | humanizeAppName | async\"></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"'Plugins' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item\n  [placement]=\"'right'\"\n  *ngIf=\"!(isStandard$ | async)\"\n>\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Reset to default plugins' | translate }}\"\n    [ngClass]=\"{ 'btn-pending': isLoading }\"\n    (click)=\"resetToDefault()\"\n  >\n    <i c8yIcon=\"undo\"></i>\n    {{ 'Reset to default' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Install plugins' | translate }}\"\n    (click)=\"installPlugins()\"\n    [ngClass]=\"{ 'btn-pending': isLoading }\"\n  >\n    <i c8yIcon=\"plus-circle\"></i>\n    {{ 'Install plugins' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<ng-container *ngIf=\"orphanedPlugins$ | async as orphanedPlugins\">\n  <c8y-action-bar-item\n    *ngIf=\"orphanedPlugins?.length\"\n    [placement]=\"'right'\"\n  >\n    <button\n      class=\"btn btn-link\"\n      title=\"{{ 'Clean up orphaned plugins' | translate }}\"\n      (click)=\"cleanupOrphanedPlugins(orphanedPlugins)\"\n      [ngClass]=\"{ 'btn-pending': isLoading }\"\n    >\n      <i c8yIcon=\"erase\"></i>\n      {{ 'Clean up orphaned plugins' | translate }}\n    </button>\n  </c8y-action-bar-item>\n</ng-container>\n\n<div class=\"content-fullpage d-flex d-col border-top\">\n  <c8y-data-grid\n    class=\"d-contents\"\n    [title]=\"title\"\n    [loadMoreItemsLabel]=\"loadMoreItemsLabel\"\n    [loadingItemsLabel]=\"loadingItemsLabel\"\n    [displayOptions]=\"displayOptions\"\n    [columns]=\"columns\"\n    [rows]=\"installedPlugins$ | async\"\n    [pagination]=\"pagination\"\n    [selectable]=\"true\"\n    [actionControls]=\"actionControls\"\n    [bulkActionControls]=\"bulkActionControls\"\n    [headerActionControls]=\"headerActionControls\"\n    (onReload)=\"refresh()\"\n  >\n    <c8y-ui-empty-state\n      [icon]=\"stats?.size > 0 ? 'search' : 'plugin'\"\n      [title]=\"stats?.size > 0 ? (noResultsMessage | translate) : (noDataMessage | translate)\"\n      [subtitle]=\"stats?.size > 0 ? (noResultsSubtitle | translate) : (noDataSubtitle | translate)\"\n      *emptyStateContext=\"let stats\"\n      [horizontal]=\"stats?.size > 0\"\n    >\n      <p *ngIf=\"stats?.size === 0\">\n        <button\n          class=\"btn btn-primary btn-sm\"\n          title=\"{{ 'Install plugins' | translate }}\"\n          (click)=\"installPlugins()\"\n          [ngClass]=\"{ 'btn-pending': isLoading }\"\n          translate\n        >\n          Install plugins\n        </button>\n      </p>\n    </c8y-ui-empty-state>\n  </c8y-data-grid>\n</div>\n", dependencies: [{ kind: "component", type: i2.ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "component", type: i2.BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: i2.BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "component", type: i2.EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: i2.EmptyStateContextDirective, selector: "[emptyStateContext]" }, { kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.DataGridComponent, selector: "c8y-data-grid", inputs: ["title", "loadMoreItemsLabel", "loadingItemsLabel", "showSearch", "refresh", "columns", "rows", "pagination", "childNodePagination", "infiniteScroll", "serverSideDataCallback", "selectable", "singleSelection", "selectionPrimaryKey", "displayOptions", "actionControls", "bulkActionControls", "headerActionControls", "searchText", "configureColumnsEnabled", "showCounterWarning", "activeClassName", "expandableRows", "treeGrid", "hideReload", "childNodesProperty", "parentNodeLabelProperty"], outputs: ["rowMouseOver", "rowMouseLeave", "rowClick", "onConfigChange", "onBeforeFilter", "onBeforeSearch", "onFilter", "itemsSelect", "onReload", "onAddCustomColumn", "onRemoveCustomColumn", "onColumnFilterReset", "onSort", "onPageSizeChange", "onColumnReordered", "onColumnVisibilityChange"] }, { kind: "component", type: i2.TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.HumanizeAppNamePipe, name: "humanizeAppName" }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ApplicationPluginsComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'c8y-app-plugins', standalone: false, template: "<c8y-title>{{ app | humanizeAppName | async }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-modules'\"\n    [label]=\"'Applications' | translate\"\n    [path]=\"'ecosystem/application/applications'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"app | humanizeAppName | async\"></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"'Plugins' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item\n  [placement]=\"'right'\"\n  *ngIf=\"!(isStandard$ | async)\"\n>\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Reset to default plugins' | translate }}\"\n    [ngClass]=\"{ 'btn-pending': isLoading }\"\n    (click)=\"resetToDefault()\"\n  >\n    <i c8yIcon=\"undo\"></i>\n    {{ 'Reset to default' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Install plugins' | translate }}\"\n    (click)=\"installPlugins()\"\n    [ngClass]=\"{ 'btn-pending': isLoading }\"\n  >\n    <i c8yIcon=\"plus-circle\"></i>\n    {{ 'Install plugins' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<ng-container *ngIf=\"orphanedPlugins$ | async as orphanedPlugins\">\n  <c8y-action-bar-item\n    *ngIf=\"orphanedPlugins?.length\"\n    [placement]=\"'right'\"\n  >\n    <button\n      class=\"btn btn-link\"\n      title=\"{{ 'Clean up orphaned plugins' | translate }}\"\n      (click)=\"cleanupOrphanedPlugins(orphanedPlugins)\"\n      [ngClass]=\"{ 'btn-pending': isLoading }\"\n    >\n      <i c8yIcon=\"erase\"></i>\n      {{ 'Clean up orphaned plugins' | translate }}\n    </button>\n  </c8y-action-bar-item>\n</ng-container>\n\n<div class=\"content-fullpage d-flex d-col border-top\">\n  <c8y-data-grid\n    class=\"d-contents\"\n    [title]=\"title\"\n    [loadMoreItemsLabel]=\"loadMoreItemsLabel\"\n    [loadingItemsLabel]=\"loadingItemsLabel\"\n    [displayOptions]=\"displayOptions\"\n    [columns]=\"columns\"\n    [rows]=\"installedPlugins$ | async\"\n    [pagination]=\"pagination\"\n    [selectable]=\"true\"\n    [actionControls]=\"actionControls\"\n    [bulkActionControls]=\"bulkActionControls\"\n    [headerActionControls]=\"headerActionControls\"\n    (onReload)=\"refresh()\"\n  >\n    <c8y-ui-empty-state\n      [icon]=\"stats?.size > 0 ? 'search' : 'plugin'\"\n      [title]=\"stats?.size > 0 ? (noResultsMessage | translate) : (noDataMessage | translate)\"\n      [subtitle]=\"stats?.size > 0 ? (noResultsSubtitle | translate) : (noDataSubtitle | translate)\"\n      *emptyStateContext=\"let stats\"\n      [horizontal]=\"stats?.size > 0\"\n    >\n      <p *ngIf=\"stats?.size === 0\">\n        <button\n          class=\"btn btn-primary btn-sm\"\n          title=\"{{ 'Install plugins' | translate }}\"\n          (click)=\"installPlugins()\"\n          [ngClass]=\"{ 'btn-pending': isLoading }\"\n          translate\n        >\n          Install plugins\n        </button>\n      </p>\n    </c8y-ui-empty-state>\n  </c8y-data-grid>\n</div>\n" }]
-        }], ctorParameters: () => [{ type: i1$2.ActivatedRoute }, { type: i1.EcosystemService }, { type: i1$1.BsModalService }, { type: i2.PluginsService }, { type: i2.AlertService }, { type: i2.GainsightService }, { type: i2.BottomDrawerService }], propDecorators: { appId: [{
-                type: Input
-            }], dataGrid: [{
-                type: ViewChild,
-                args: [DataGridComponent, { static: false }]
-            }] } });
-
-class ApplicationPluginsGuard {
-    constructor(ecosystemService) {
-        this.ecosystemService = ecosystemService;
-    }
-    canActivate(route) {
-        const app = route.data.contextData || route.parent.data.contextData;
-        if (!app) {
-            return false;
-        }
-        const manifest = app.manifest;
-        if (!manifest) {
-            return false;
-        }
-        return (app.type === ApplicationType.HOSTED &&
-            this.ecosystemService.isOwner(app) &&
-            !this.ecosystemService.isPackage(app) &&
-            // apps like e.g. the public-options should not have the plugins tab
-            !manifest.noAppSwitcher);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ApplicationPluginsGuard, deps: [{ token: i1.EcosystemService }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ApplicationPluginsGuard }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ApplicationPluginsGuard, decorators: [{
-            type: Injectable
-        }], ctorParameters: () => [{ type: i1.EcosystemService }] });
-
-class ApplicationPluginsModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ApplicationPluginsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: ApplicationPluginsModule, declarations: [ApplicationPluginsComponent,
-            PluginListItemComponent,
-            InstallPluginComponent,
-            PluginListComponent,
-            AppsToUpdateRemotesSelectComponent,
-            AppStatePipe,
-            LabelCellRendererComponent,
-            OrphanedStatusCellRendererComponent,
-            UpdatePluginOfAppComponent,
-            OnlyLatestFilterComponent,
-            ApplicationPluginReadmeComponent], imports: [CoreModule, SharedEcosystemModule], exports: [ApplicationPluginsComponent,
-            PluginListItemComponent,
-            InstallPluginComponent,
-            PluginListComponent,
-            AppsToUpdateRemotesSelectComponent,
-            AppStatePipe,
-            LabelCellRendererComponent,
-            OrphanedStatusCellRendererComponent,
-            UpdatePluginOfAppComponent,
-            OnlyLatestFilterComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ApplicationPluginsModule, providers: [
-            ApplicationPluginsGuard,
-            hookRoute([
-                {
-                    path: 'plugins',
-                    component: ApplicationPluginsComponent,
-                    icon: 'plugin',
-                    label: gettext('Plugins'),
-                    context: ViewContext.Application,
-                    priority: 3,
-                    canActivate: [ApplicationPluginsGuard]
-                }
-            ])
-        ], imports: [CoreModule, SharedEcosystemModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ApplicationPluginsModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    imports: [CoreModule, SharedEcosystemModule],
-                    declarations: [
-                        ApplicationPluginsComponent,
-                        PluginListItemComponent,
-                        InstallPluginComponent,
-                        PluginListComponent,
-                        AppsToUpdateRemotesSelectComponent,
-                        AppStatePipe,
-                        LabelCellRendererComponent,
-                        OrphanedStatusCellRendererComponent,
-                        UpdatePluginOfAppComponent,
-                        OnlyLatestFilterComponent,
-                        ApplicationPluginReadmeComponent
-                    ],
-                    exports: [
-                        ApplicationPluginsComponent,
-                        PluginListItemComponent,
-                        InstallPluginComponent,
-                        PluginListComponent,
-                        AppsToUpdateRemotesSelectComponent,
-                        AppStatePipe,
-                        LabelCellRendererComponent,
-                        OrphanedStatusCellRendererComponent,
-                        UpdatePluginOfAppComponent,
-                        OnlyLatestFilterComponent
-                    ],
-                    providers: [
-                        ApplicationPluginsGuard,
-                        hookRoute([
-                            {
-                                path: 'plugins',
-                                component: ApplicationPluginsComponent,
-                                icon: 'plugin',
-                                label: gettext('Plugins'),
-                                context: ViewContext.Application,
-                                priority: 3,
-                                canActivate: [ApplicationPluginsGuard]
-                            }
-                        ])
-                    ]
-                }]
-        }] });
-
 class FeatureListComponent {
     constructor(ecosystemService) {
         this.ecosystemService = ecosystemService;
@@ -2200,11 +1088,27 @@ class FeatureListComponent {
         this.filtersComponent?.resetAllFilters();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: FeatureListComponent, deps: [{ token: i1.EcosystemService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: FeatureListComponent, isStandalone: false, selector: "c8y-feature-list", viewQueries: [{ propertyName: "filtersComponent", first: true, predicate: ListFiltersComponent, descendants: true }], ngImport: i0, template: "<c8y-title>{{ 'Features' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item [icon]=\"'c8y-atom'\" [label]=\"'Ecosystem' | translate\"></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-modules'\"\n    [label]=\"'Applications' | translate\"\n    [path]=\"'ecosystem/application/applications'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [icon]=\"'tab'\" [label]=\"'Features' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button (click)=\"reload$.next()\" class=\"btn btn-link\" title=\"{{ 'Reload' | translate }}\">\n    <i [ngClass]=\"{ 'icon-spin': reloading }\" c8yIcon=\"refresh\"></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'left'\">\n  <c8y-list-filters\n    *ngIf=\"features$ | async\"\n    (filterPipeChange)=\"setFilterPipe($event)\"\n  ></c8y-list-filters>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'left'\" itemClass=\"navbar-form hidden-xs\">\n  <c8y-list-display-switch\n    (onListClassChange)=\"listClass = $event\"\n    [listLength]=\"(features$ | async)?.length\"\n  ></c8y-list-display-switch>\n</c8y-action-bar-item>\n\n<div *ngIf=\"(features$ | async)?.length === 0\" class=\"c8y-empty-state text-center\">\n  <h1 class=\"c8y-icon c8y-icon-modules c8y-icon-duocolor\"></h1>\n  <h3 translate>No features to display.</h3>\n  <p translate>No additional features are subscribed to the tenant.</p>\n</div>\n\n<div [ngClass]=\"listClass\" class=\"card-group\">\n  <div class=\"page-sticky-header hidden-xs d-flex\" *ngIf=\"(features$ | async)?.length > 0\">\n    <div class=\"card-block card-column-40\">\n      <div class=\"card-appicon p-l-32 p-r-16 m-r-0 m-l-4\"></div>\n      {{ 'Feature' | translate }}\n    </div>\n    <div class=\"card-block p-0 card-column-80\">\n      <div class=\"card-block card-column-80\">{{ 'Description' | translate }}</div>\n      <div class=\"card-block card-column-20\">{{ 'Type' | translate }}</div>\n    </div>\n  </div>\n  <div *ngFor=\"let feature of filteredFeatures$ | async\" class=\"col-xs-12 col-sm-4 col-md-3\">\n    <c8y-application-card\n      [app]=\"feature\"\n      [canEdit]=\"false\"\n      class=\"d-contents\"\n    ></c8y-application-card>\n  </div>\n</div>\n\n<c8y-ui-empty-state\n  *ngIf=\"(features$ | async)?.length > 0 && (filteredFeatures$ | async)?.length === 0\"\n  [icon]=\"'search'\"\n  [title]=\"'No matching features.' | translate\"\n  [subtitle]=\"'Refine your search terms and/or the filters' | translate\"\n>\n  <button\n    class=\"btn btn-primary\"\n    type=\"button\"\n    title=\"{{ 'Reset filters' | translate }}\"\n    (click)=\"resetFilters()\"\n  >\n    {{ 'Reset filters' | translate }}\n  </button>\n</c8y-ui-empty-state>\n", dependencies: [{ kind: "component", type: i2.ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "component", type: i2.BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: i2.BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "component", type: i2.EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "component", type: i2.ListDisplaySwitchComponent, selector: "c8y-list-display-switch", inputs: ["listKey", "listLength", "filterPipe"], outputs: ["onListClassChange"] }, { kind: "component", type: i1.ApplicationCardComponent, selector: "c8y-application-card", inputs: ["app", "canEdit"], outputs: ["onAppDeleted", "onAppCloned"] }, { kind: "component", type: i1.ListFiltersComponent, selector: "c8y-list-filters", inputs: ["packageTypes", "packageAvailabilities", "packageContents"], outputs: ["filterPipeChange"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: FeatureListComponent, isStandalone: true, selector: "c8y-feature-list", viewQueries: [{ propertyName: "filtersComponent", first: true, predicate: ListFiltersComponent, descendants: true }], ngImport: i0, template: "<c8y-title>{{ 'Features' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item [icon]=\"'c8y-atom'\" [label]=\"'Ecosystem' | translate\"></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-modules'\"\n    [label]=\"'Applications' | translate\"\n    [path]=\"'ecosystem/application/applications'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [icon]=\"'tab'\" [label]=\"'Features' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button (click)=\"reload$.next()\" class=\"btn btn-link\" title=\"{{ 'Reload' | translate }}\">\n    <i [ngClass]=\"{ 'icon-spin': reloading }\" c8yIcon=\"refresh\"></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'left'\">\n  <c8y-list-filters\n    *ngIf=\"features$ | async\"\n    (filterPipeChange)=\"setFilterPipe($event)\"\n  ></c8y-list-filters>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'left'\" itemClass=\"navbar-form hidden-xs\">\n  <c8y-list-display-switch\n    (onListClassChange)=\"listClass = $event\"\n    [listLength]=\"(features$ | async)?.length\"\n  ></c8y-list-display-switch>\n</c8y-action-bar-item>\n\n<div *ngIf=\"(features$ | async)?.length === 0\" class=\"c8y-empty-state text-center\">\n  <h1 class=\"c8y-icon c8y-icon-modules c8y-icon-duocolor\"></h1>\n  <h3 translate>No features to display.</h3>\n  <p translate>No additional features are subscribed to the tenant.</p>\n</div>\n\n<div [ngClass]=\"listClass\" class=\"card-group\">\n  <div class=\"page-sticky-header hidden-xs d-flex\" *ngIf=\"(features$ | async)?.length > 0\">\n    <div class=\"card-block card-column-40\">\n      <div class=\"card-appicon p-l-32 p-r-16 m-r-0 m-l-4\"></div>\n      {{ 'Feature' | translate }}\n    </div>\n    <div class=\"card-block p-0 card-column-80\">\n      <div class=\"card-block card-column-80\">{{ 'Description' | translate }}</div>\n      <div class=\"card-block card-column-20\">{{ 'Type' | translate }}</div>\n    </div>\n  </div>\n  <div *ngFor=\"let feature of filteredFeatures$ | async\" class=\"col-xs-12 col-sm-4 col-md-3\">\n    <c8y-application-card\n      [app]=\"feature\"\n      [canEdit]=\"false\"\n      class=\"d-contents\"\n    ></c8y-application-card>\n  </div>\n</div>\n\n<c8y-ui-empty-state\n  *ngIf=\"(features$ | async)?.length > 0 && (filteredFeatures$ | async)?.length === 0\"\n  [icon]=\"'search'\"\n  [title]=\"'No matching features.' | translate\"\n  [subtitle]=\"'Refine your search terms and/or the filters' | translate\"\n>\n  <button\n    class=\"btn btn-primary\"\n    type=\"button\"\n    title=\"{{ 'Reset filters' | translate }}\"\n    (click)=\"resetFilters()\"\n  >\n    {{ 'Reset filters' | translate }}\n  </button>\n</c8y-ui-empty-state>\n", dependencies: [{ kind: "component", type: TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "component", type: BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ListFiltersComponent, selector: "c8y-list-filters", inputs: ["packageTypes", "packageAvailabilities", "packageContents"], outputs: ["filterPipeChange"] }, { kind: "component", type: ListDisplaySwitchComponent, selector: "c8y-list-display-switch", inputs: ["listKey", "listLength", "filterPipe"], outputs: ["onListClassChange"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ApplicationCardComponent, selector: "c8y-application-card", inputs: ["app", "canEdit"], outputs: ["onAppDeleted", "onAppCloned"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: FeatureListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-feature-list', standalone: false, template: "<c8y-title>{{ 'Features' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item [icon]=\"'c8y-atom'\" [label]=\"'Ecosystem' | translate\"></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-modules'\"\n    [label]=\"'Applications' | translate\"\n    [path]=\"'ecosystem/application/applications'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [icon]=\"'tab'\" [label]=\"'Features' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button (click)=\"reload$.next()\" class=\"btn btn-link\" title=\"{{ 'Reload' | translate }}\">\n    <i [ngClass]=\"{ 'icon-spin': reloading }\" c8yIcon=\"refresh\"></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'left'\">\n  <c8y-list-filters\n    *ngIf=\"features$ | async\"\n    (filterPipeChange)=\"setFilterPipe($event)\"\n  ></c8y-list-filters>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'left'\" itemClass=\"navbar-form hidden-xs\">\n  <c8y-list-display-switch\n    (onListClassChange)=\"listClass = $event\"\n    [listLength]=\"(features$ | async)?.length\"\n  ></c8y-list-display-switch>\n</c8y-action-bar-item>\n\n<div *ngIf=\"(features$ | async)?.length === 0\" class=\"c8y-empty-state text-center\">\n  <h1 class=\"c8y-icon c8y-icon-modules c8y-icon-duocolor\"></h1>\n  <h3 translate>No features to display.</h3>\n  <p translate>No additional features are subscribed to the tenant.</p>\n</div>\n\n<div [ngClass]=\"listClass\" class=\"card-group\">\n  <div class=\"page-sticky-header hidden-xs d-flex\" *ngIf=\"(features$ | async)?.length > 0\">\n    <div class=\"card-block card-column-40\">\n      <div class=\"card-appicon p-l-32 p-r-16 m-r-0 m-l-4\"></div>\n      {{ 'Feature' | translate }}\n    </div>\n    <div class=\"card-block p-0 card-column-80\">\n      <div class=\"card-block card-column-80\">{{ 'Description' | translate }}</div>\n      <div class=\"card-block card-column-20\">{{ 'Type' | translate }}</div>\n    </div>\n  </div>\n  <div *ngFor=\"let feature of filteredFeatures$ | async\" class=\"col-xs-12 col-sm-4 col-md-3\">\n    <c8y-application-card\n      [app]=\"feature\"\n      [canEdit]=\"false\"\n      class=\"d-contents\"\n    ></c8y-application-card>\n  </div>\n</div>\n\n<c8y-ui-empty-state\n  *ngIf=\"(features$ | async)?.length > 0 && (filteredFeatures$ | async)?.length === 0\"\n  [icon]=\"'search'\"\n  [title]=\"'No matching features.' | translate\"\n  [subtitle]=\"'Refine your search terms and/or the filters' | translate\"\n>\n  <button\n    class=\"btn btn-primary\"\n    type=\"button\"\n    title=\"{{ 'Reset filters' | translate }}\"\n    (click)=\"resetFilters()\"\n  >\n    {{ 'Reset filters' | translate }}\n  </button>\n</c8y-ui-empty-state>\n" }]
+            args: [{ selector: 'c8y-feature-list', imports: [
+                        TitleComponent,
+                        BreadcrumbComponent,
+                        BreadcrumbItemComponent,
+                        ActionBarItemComponent,
+                        IconDirective,
+                        NgClass,
+                        NgIf,
+                        ListFiltersComponent,
+                        ListDisplaySwitchComponent,
+                        C8yTranslateDirective,
+                        NgFor,
+                        ApplicationCardComponent,
+                        EmptyStateComponent,
+                        C8yTranslatePipe,
+                        AsyncPipe
+                    ], template: "<c8y-title>{{ 'Features' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item [icon]=\"'c8y-atom'\" [label]=\"'Ecosystem' | translate\"></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-modules'\"\n    [label]=\"'Applications' | translate\"\n    [path]=\"'ecosystem/application/applications'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [icon]=\"'tab'\" [label]=\"'Features' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button (click)=\"reload$.next()\" class=\"btn btn-link\" title=\"{{ 'Reload' | translate }}\">\n    <i [ngClass]=\"{ 'icon-spin': reloading }\" c8yIcon=\"refresh\"></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'left'\">\n  <c8y-list-filters\n    *ngIf=\"features$ | async\"\n    (filterPipeChange)=\"setFilterPipe($event)\"\n  ></c8y-list-filters>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'left'\" itemClass=\"navbar-form hidden-xs\">\n  <c8y-list-display-switch\n    (onListClassChange)=\"listClass = $event\"\n    [listLength]=\"(features$ | async)?.length\"\n  ></c8y-list-display-switch>\n</c8y-action-bar-item>\n\n<div *ngIf=\"(features$ | async)?.length === 0\" class=\"c8y-empty-state text-center\">\n  <h1 class=\"c8y-icon c8y-icon-modules c8y-icon-duocolor\"></h1>\n  <h3 translate>No features to display.</h3>\n  <p translate>No additional features are subscribed to the tenant.</p>\n</div>\n\n<div [ngClass]=\"listClass\" class=\"card-group\">\n  <div class=\"page-sticky-header hidden-xs d-flex\" *ngIf=\"(features$ | async)?.length > 0\">\n    <div class=\"card-block card-column-40\">\n      <div class=\"card-appicon p-l-32 p-r-16 m-r-0 m-l-4\"></div>\n      {{ 'Feature' | translate }}\n    </div>\n    <div class=\"card-block p-0 card-column-80\">\n      <div class=\"card-block card-column-80\">{{ 'Description' | translate }}</div>\n      <div class=\"card-block card-column-20\">{{ 'Type' | translate }}</div>\n    </div>\n  </div>\n  <div *ngFor=\"let feature of filteredFeatures$ | async\" class=\"col-xs-12 col-sm-4 col-md-3\">\n    <c8y-application-card\n      [app]=\"feature\"\n      [canEdit]=\"false\"\n      class=\"d-contents\"\n    ></c8y-application-card>\n  </div>\n</div>\n\n<c8y-ui-empty-state\n  *ngIf=\"(features$ | async)?.length > 0 && (filteredFeatures$ | async)?.length === 0\"\n  [icon]=\"'search'\"\n  [title]=\"'No matching features.' | translate\"\n  [subtitle]=\"'Refine your search terms and/or the filters' | translate\"\n>\n  <button\n    class=\"btn btn-primary\"\n    type=\"button\"\n    title=\"{{ 'Reset filters' | translate }}\"\n    (click)=\"resetFilters()\"\n  >\n    {{ 'Reset filters' | translate }}\n  </button>\n</c8y-ui-empty-state>\n" }]
         }], ctorParameters: () => [{ type: i1.EcosystemService }], propDecorators: { filtersComponent: [{
                 type: ViewChild,
                 args: [ListFiltersComponent]
@@ -2259,7 +1163,7 @@ class AddMicroserviceComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AddMicroserviceComponent, deps: [{ token: i1.EcosystemService }, { token: i2.ModalService }, { token: i4.TenantService }, { token: i2.DocsService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: AddMicroserviceComponent, isStandalone: false, selector: "c8y-add-microservice", ngImport: i0, template: `<div class="p-16" translate [translateParams]="{ slaHref: slaHref }" ngNonBindable>
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: AddMicroserviceComponent, isStandalone: true, selector: "c8y-add-microservice", ngImport: i0, template: `<div class="p-16" translate [translateParams]="{ slaHref: slaHref }" ngNonBindable>
       By uploading a microservice, you agree to the
       <a href="{{ slaHref }}" target="_blank" rel="noopener noreferrer"
         >Microservice Deployment SLA</a
@@ -2272,7 +1176,7 @@ class AddMicroserviceComponent {
       [successText]="successText"
       [createApplicationHandler]="createMicroserviceApplicationHandler"
       [uploadApplicationHandler]="uploadMicroserviceHandler"
-    ></c8y-add-application>`, isInline: true, dependencies: [{ kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: i1.AddApplicationComponent, selector: "c8y-add-application", inputs: ["headerText", "headerIcon", "successText", "createApplicationHandler", "uploadApplicationHandler", "canGoBack", "applicationType"] }] }); }
+    ></c8y-add-application>`, isInline: true, dependencies: [{ kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: AddApplicationComponent, selector: "c8y-add-application", inputs: ["headerText", "headerIcon", "successText", "createApplicationHandler", "uploadApplicationHandler", "canGoBack", "applicationType"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AddMicroserviceComponent, decorators: [{
             type: Component,
@@ -2292,7 +1196,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
       [createApplicationHandler]="createMicroserviceApplicationHandler"
       [uploadApplicationHandler]="uploadMicroserviceHandler"
     ></c8y-add-application>`,
-                    standalone: false
+                    imports: [C8yTranslateDirective, AddApplicationComponent]
                 }]
         }], ctorParameters: () => [{ type: i1.EcosystemService }, { type: i2.ModalService }, { type: i4.TenantService }, { type: i2.DocsService }] });
 
@@ -2339,11 +1243,29 @@ class MicroserviceListComponent {
         this.filtersComponent?.resetAllFilters();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: MicroserviceListComponent, deps: [{ token: i1.EcosystemService }, { token: i2.WizardModalService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: MicroserviceListComponent, isStandalone: false, selector: "c8y-microservice-list", viewQueries: [{ propertyName: "filtersComponent", first: true, predicate: ListFiltersComponent, descendants: true }], ngImport: i0, template: "<c8y-title>{{ 'Microservices' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'microchip'\"\n    [label]=\"'Microservices' | translate\"\n    [path]=\"'ecosystem/microservice/microservices'\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<ng-container *c8yIfAllowed=\"['ROLE_APPLICATION_MANAGEMENT_ADMIN']\">\n  <c8y-action-bar-item\n    [placement]=\"'right'\"\n    [priority]=\"100\"\n    *ngIf=\"isMicroserviceHostingAllowed$ | async\"\n  >\n    <button\n      class=\"btn btn-link\"\n      title=\"{{ 'Add microservice' | translate }}\"\n      (click)=\"addMicroservice()\"\n    >\n      <i c8yIcon=\"plus-circle\"></i>\n      {{ 'Add microservice' | translate }}\n    </button>\n  </c8y-action-bar-item>\n</ng-container>\n\n<c8y-help src=\"/docs/standard-tenant/ecosystem/#managing-microservices\"></c8y-help>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    (click)=\"reload$.next()\"\n  >\n    <i\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': reloading }\"\n    ></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'left'\">\n  <c8y-list-filters\n    *ngIf=\"microservices$ | async\"\n    (filterPipeChange)=\"setFilterPipe($event)\"\n    [packageAvailabilities]=\"packageAvailabilities\"\n  ></c8y-list-filters>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n  [placement]=\"'left'\"\n  itemClass=\"navbar-form hidden-xs\"\n>\n  <c8y-list-display-switch\n    (onListClassChange)=\"listClass = $event\"\n    [listLength]=\"(microservices$ | async)?.length\"\n  ></c8y-list-display-switch>\n</c8y-action-bar-item>\n\n<div\n  class=\"c8y-empty-state text-center\"\n  *ngIf=\"(microservices$ | async)?.length === 0\"\n>\n  <h1 class=\"c8y-icon c8y-icon-modules c8y-icon-duocolor\"></h1>\n  <h3 translate>No microservices to display.</h3>\n  <p translate>Add your first microservice by clicking below.</p>\n  <p>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Add microservice' | translate }}\"\n      (click)=\"addMicroservice()\"\n    >\n      {{ 'Add microservice' | translate }}\n    </button>\n  </p>\n</div>\n\n<div\n  class=\"card-group\"\n  [ngClass]=\"listClass\"\n>\n  <div\n    class=\"page-sticky-header hidden-xs d-flex\"\n    *ngIf=\"(microservices$ | async)?.length > 0\"\n  >\n    <div class=\"card-block card-column-40\">\n      <div class=\"card-appicon p-l-32 p-r-16 m-r-0 m-l-4\"></div>\n      {{ 'Microservice' | translate }}\n    </div>\n    <div class=\"card-block p-0 card-column-80 m-r-40\">\n      <div class=\"card-block card-column-80\">{{ 'Description' | translate }}</div>\n      <div class=\"card-block card-column-20\">{{ 'Type' | translate }}</div>\n      <div class=\"card-block card-column-20\"></div>\n    </div>\n  </div>\n  <div\n    class=\"col-xs-12 col-sm-4 col-md-3\"\n    *ngFor=\"let microservice of filteredMicroservices$ | async\"\n  >\n    <c8y-application-card\n      class=\"d-contents\"\n      (onAppDeleted)=\"loadMicroservices()\"\n      [app]=\"microservice\"\n    ></c8y-application-card>\n  </div>\n</div>\n\n<c8y-ui-empty-state\n  [icon]=\"'search'\"\n  [title]=\"'No matching microservices.' | translate\"\n  [subtitle]=\"'Refine your search terms and/or the filters' | translate\"\n  *ngIf=\"(microservices$ | async)?.length > 0 && (filteredMicroservices$ | async)?.length === 0\"\n>\n  <button\n    class=\"btn btn-primary\"\n    title=\"{{ 'Reset filters' | translate }}\"\n    type=\"button\"\n    (click)=\"resetFilters()\"\n  >\n    {{ 'Reset filters' | translate }}\n  </button>\n</c8y-ui-empty-state>\n", dependencies: [{ kind: "component", type: i2.ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "component", type: i2.BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: i2.BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "component", type: i2.EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.IfAllowedDirective, selector: "[c8yIfAllowed]", inputs: ["c8yIfAllowed", "c8yIfAllowedAllowAny"] }, { kind: "component", type: i2.TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "component", type: i2.HelpComponent, selector: "c8y-help", inputs: ["src", "isCollapsed", "priority", "icon"] }, { kind: "component", type: i2.ListDisplaySwitchComponent, selector: "c8y-list-display-switch", inputs: ["listKey", "listLength", "filterPipe"], outputs: ["onListClassChange"] }, { kind: "component", type: i1.ApplicationCardComponent, selector: "c8y-application-card", inputs: ["app", "canEdit"], outputs: ["onAppDeleted", "onAppCloned"] }, { kind: "component", type: i1.ListFiltersComponent, selector: "c8y-list-filters", inputs: ["packageTypes", "packageAvailabilities", "packageContents"], outputs: ["filterPipeChange"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: MicroserviceListComponent, isStandalone: true, selector: "c8y-microservice-list", viewQueries: [{ propertyName: "filtersComponent", first: true, predicate: ListFiltersComponent, descendants: true }], ngImport: i0, template: "<c8y-title>{{ 'Microservices' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'microchip'\"\n    [label]=\"'Microservices' | translate\"\n    [path]=\"'ecosystem/microservice/microservices'\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<ng-container *c8yIfAllowed=\"['ROLE_APPLICATION_MANAGEMENT_ADMIN']\">\n  <c8y-action-bar-item\n    [placement]=\"'right'\"\n    [priority]=\"100\"\n    *ngIf=\"isMicroserviceHostingAllowed$ | async\"\n  >\n    <button\n      class=\"btn btn-link\"\n      title=\"{{ 'Add microservice' | translate }}\"\n      (click)=\"addMicroservice()\"\n    >\n      <i c8yIcon=\"plus-circle\"></i>\n      {{ 'Add microservice' | translate }}\n    </button>\n  </c8y-action-bar-item>\n</ng-container>\n\n<c8y-help src=\"/docs/standard-tenant/ecosystem/#managing-microservices\"></c8y-help>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    (click)=\"reload$.next()\"\n  >\n    <i\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': reloading }\"\n    ></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'left'\">\n  <c8y-list-filters\n    *ngIf=\"microservices$ | async\"\n    (filterPipeChange)=\"setFilterPipe($event)\"\n    [packageAvailabilities]=\"packageAvailabilities\"\n  ></c8y-list-filters>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n  [placement]=\"'left'\"\n  itemClass=\"navbar-form hidden-xs\"\n>\n  <c8y-list-display-switch\n    (onListClassChange)=\"listClass = $event\"\n    [listLength]=\"(microservices$ | async)?.length\"\n  ></c8y-list-display-switch>\n</c8y-action-bar-item>\n\n<div\n  class=\"c8y-empty-state text-center\"\n  *ngIf=\"(microservices$ | async)?.length === 0\"\n>\n  <h1 class=\"c8y-icon c8y-icon-modules c8y-icon-duocolor\"></h1>\n  <h3 translate>No microservices to display.</h3>\n  <p translate>Add your first microservice by clicking below.</p>\n  <p>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Add microservice' | translate }}\"\n      (click)=\"addMicroservice()\"\n    >\n      {{ 'Add microservice' | translate }}\n    </button>\n  </p>\n</div>\n\n<div\n  class=\"card-group\"\n  [ngClass]=\"listClass\"\n>\n  <div\n    class=\"page-sticky-header hidden-xs d-flex\"\n    *ngIf=\"(microservices$ | async)?.length > 0\"\n  >\n    <div class=\"card-block card-column-40\">\n      <div class=\"card-appicon p-l-32 p-r-16 m-r-0 m-l-4\"></div>\n      {{ 'Microservice' | translate }}\n    </div>\n    <div class=\"card-block p-0 card-column-80 m-r-40\">\n      <div class=\"card-block card-column-80\">{{ 'Description' | translate }}</div>\n      <div class=\"card-block card-column-20\">{{ 'Type' | translate }}</div>\n      <div class=\"card-block card-column-20\"></div>\n    </div>\n  </div>\n  <div\n    class=\"col-xs-12 col-sm-4 col-md-3\"\n    *ngFor=\"let microservice of filteredMicroservices$ | async\"\n  >\n    <c8y-application-card\n      class=\"d-contents\"\n      (onAppDeleted)=\"loadMicroservices()\"\n      [app]=\"microservice\"\n    ></c8y-application-card>\n  </div>\n</div>\n\n<c8y-ui-empty-state\n  [icon]=\"'search'\"\n  [title]=\"'No matching microservices.' | translate\"\n  [subtitle]=\"'Refine your search terms and/or the filters' | translate\"\n  *ngIf=\"(microservices$ | async)?.length > 0 && (filteredMicroservices$ | async)?.length === 0\"\n>\n  <button\n    class=\"btn btn-primary\"\n    title=\"{{ 'Reset filters' | translate }}\"\n    type=\"button\"\n    (click)=\"resetFilters()\"\n  >\n    {{ 'Reset filters' | translate }}\n  </button>\n</c8y-ui-empty-state>\n", dependencies: [{ kind: "component", type: TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "component", type: BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "directive", type: IfAllowedDirective, selector: "[c8yIfAllowed]", inputs: ["c8yIfAllowed", "c8yIfAllowedAllowAny"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: HelpComponent, selector: "c8y-help", inputs: ["src", "isCollapsed", "priority", "icon"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ListFiltersComponent, selector: "c8y-list-filters", inputs: ["packageTypes", "packageAvailabilities", "packageContents"], outputs: ["filterPipeChange"] }, { kind: "component", type: ListDisplaySwitchComponent, selector: "c8y-list-display-switch", inputs: ["listKey", "listLength", "filterPipe"], outputs: ["onListClassChange"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ApplicationCardComponent, selector: "c8y-application-card", inputs: ["app", "canEdit"], outputs: ["onAppDeleted", "onAppCloned"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: MicroserviceListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-microservice-list', standalone: false, template: "<c8y-title>{{ 'Microservices' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'microchip'\"\n    [label]=\"'Microservices' | translate\"\n    [path]=\"'ecosystem/microservice/microservices'\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<ng-container *c8yIfAllowed=\"['ROLE_APPLICATION_MANAGEMENT_ADMIN']\">\n  <c8y-action-bar-item\n    [placement]=\"'right'\"\n    [priority]=\"100\"\n    *ngIf=\"isMicroserviceHostingAllowed$ | async\"\n  >\n    <button\n      class=\"btn btn-link\"\n      title=\"{{ 'Add microservice' | translate }}\"\n      (click)=\"addMicroservice()\"\n    >\n      <i c8yIcon=\"plus-circle\"></i>\n      {{ 'Add microservice' | translate }}\n    </button>\n  </c8y-action-bar-item>\n</ng-container>\n\n<c8y-help src=\"/docs/standard-tenant/ecosystem/#managing-microservices\"></c8y-help>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    (click)=\"reload$.next()\"\n  >\n    <i\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': reloading }\"\n    ></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'left'\">\n  <c8y-list-filters\n    *ngIf=\"microservices$ | async\"\n    (filterPipeChange)=\"setFilterPipe($event)\"\n    [packageAvailabilities]=\"packageAvailabilities\"\n  ></c8y-list-filters>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n  [placement]=\"'left'\"\n  itemClass=\"navbar-form hidden-xs\"\n>\n  <c8y-list-display-switch\n    (onListClassChange)=\"listClass = $event\"\n    [listLength]=\"(microservices$ | async)?.length\"\n  ></c8y-list-display-switch>\n</c8y-action-bar-item>\n\n<div\n  class=\"c8y-empty-state text-center\"\n  *ngIf=\"(microservices$ | async)?.length === 0\"\n>\n  <h1 class=\"c8y-icon c8y-icon-modules c8y-icon-duocolor\"></h1>\n  <h3 translate>No microservices to display.</h3>\n  <p translate>Add your first microservice by clicking below.</p>\n  <p>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Add microservice' | translate }}\"\n      (click)=\"addMicroservice()\"\n    >\n      {{ 'Add microservice' | translate }}\n    </button>\n  </p>\n</div>\n\n<div\n  class=\"card-group\"\n  [ngClass]=\"listClass\"\n>\n  <div\n    class=\"page-sticky-header hidden-xs d-flex\"\n    *ngIf=\"(microservices$ | async)?.length > 0\"\n  >\n    <div class=\"card-block card-column-40\">\n      <div class=\"card-appicon p-l-32 p-r-16 m-r-0 m-l-4\"></div>\n      {{ 'Microservice' | translate }}\n    </div>\n    <div class=\"card-block p-0 card-column-80 m-r-40\">\n      <div class=\"card-block card-column-80\">{{ 'Description' | translate }}</div>\n      <div class=\"card-block card-column-20\">{{ 'Type' | translate }}</div>\n      <div class=\"card-block card-column-20\"></div>\n    </div>\n  </div>\n  <div\n    class=\"col-xs-12 col-sm-4 col-md-3\"\n    *ngFor=\"let microservice of filteredMicroservices$ | async\"\n  >\n    <c8y-application-card\n      class=\"d-contents\"\n      (onAppDeleted)=\"loadMicroservices()\"\n      [app]=\"microservice\"\n    ></c8y-application-card>\n  </div>\n</div>\n\n<c8y-ui-empty-state\n  [icon]=\"'search'\"\n  [title]=\"'No matching microservices.' | translate\"\n  [subtitle]=\"'Refine your search terms and/or the filters' | translate\"\n  *ngIf=\"(microservices$ | async)?.length > 0 && (filteredMicroservices$ | async)?.length === 0\"\n>\n  <button\n    class=\"btn btn-primary\"\n    title=\"{{ 'Reset filters' | translate }}\"\n    type=\"button\"\n    (click)=\"resetFilters()\"\n  >\n    {{ 'Reset filters' | translate }}\n  </button>\n</c8y-ui-empty-state>\n" }]
+            args: [{ selector: 'c8y-microservice-list', imports: [
+                        TitleComponent,
+                        BreadcrumbComponent,
+                        BreadcrumbItemComponent,
+                        IfAllowedDirective,
+                        NgIf,
+                        ActionBarItemComponent,
+                        IconDirective,
+                        HelpComponent,
+                        NgClass,
+                        ListFiltersComponent,
+                        ListDisplaySwitchComponent,
+                        C8yTranslateDirective,
+                        NgFor,
+                        ApplicationCardComponent,
+                        EmptyStateComponent,
+                        C8yTranslatePipe,
+                        AsyncPipe
+                    ], template: "<c8y-title>{{ 'Microservices' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'microchip'\"\n    [label]=\"'Microservices' | translate\"\n    [path]=\"'ecosystem/microservice/microservices'\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<ng-container *c8yIfAllowed=\"['ROLE_APPLICATION_MANAGEMENT_ADMIN']\">\n  <c8y-action-bar-item\n    [placement]=\"'right'\"\n    [priority]=\"100\"\n    *ngIf=\"isMicroserviceHostingAllowed$ | async\"\n  >\n    <button\n      class=\"btn btn-link\"\n      title=\"{{ 'Add microservice' | translate }}\"\n      (click)=\"addMicroservice()\"\n    >\n      <i c8yIcon=\"plus-circle\"></i>\n      {{ 'Add microservice' | translate }}\n    </button>\n  </c8y-action-bar-item>\n</ng-container>\n\n<c8y-help src=\"/docs/standard-tenant/ecosystem/#managing-microservices\"></c8y-help>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    (click)=\"reload$.next()\"\n  >\n    <i\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': reloading }\"\n    ></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'left'\">\n  <c8y-list-filters\n    *ngIf=\"microservices$ | async\"\n    (filterPipeChange)=\"setFilterPipe($event)\"\n    [packageAvailabilities]=\"packageAvailabilities\"\n  ></c8y-list-filters>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n  [placement]=\"'left'\"\n  itemClass=\"navbar-form hidden-xs\"\n>\n  <c8y-list-display-switch\n    (onListClassChange)=\"listClass = $event\"\n    [listLength]=\"(microservices$ | async)?.length\"\n  ></c8y-list-display-switch>\n</c8y-action-bar-item>\n\n<div\n  class=\"c8y-empty-state text-center\"\n  *ngIf=\"(microservices$ | async)?.length === 0\"\n>\n  <h1 class=\"c8y-icon c8y-icon-modules c8y-icon-duocolor\"></h1>\n  <h3 translate>No microservices to display.</h3>\n  <p translate>Add your first microservice by clicking below.</p>\n  <p>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Add microservice' | translate }}\"\n      (click)=\"addMicroservice()\"\n    >\n      {{ 'Add microservice' | translate }}\n    </button>\n  </p>\n</div>\n\n<div\n  class=\"card-group\"\n  [ngClass]=\"listClass\"\n>\n  <div\n    class=\"page-sticky-header hidden-xs d-flex\"\n    *ngIf=\"(microservices$ | async)?.length > 0\"\n  >\n    <div class=\"card-block card-column-40\">\n      <div class=\"card-appicon p-l-32 p-r-16 m-r-0 m-l-4\"></div>\n      {{ 'Microservice' | translate }}\n    </div>\n    <div class=\"card-block p-0 card-column-80 m-r-40\">\n      <div class=\"card-block card-column-80\">{{ 'Description' | translate }}</div>\n      <div class=\"card-block card-column-20\">{{ 'Type' | translate }}</div>\n      <div class=\"card-block card-column-20\"></div>\n    </div>\n  </div>\n  <div\n    class=\"col-xs-12 col-sm-4 col-md-3\"\n    *ngFor=\"let microservice of filteredMicroservices$ | async\"\n  >\n    <c8y-application-card\n      class=\"d-contents\"\n      (onAppDeleted)=\"loadMicroservices()\"\n      [app]=\"microservice\"\n    ></c8y-application-card>\n  </div>\n</div>\n\n<c8y-ui-empty-state\n  [icon]=\"'search'\"\n  [title]=\"'No matching microservices.' | translate\"\n  [subtitle]=\"'Refine your search terms and/or the filters' | translate\"\n  *ngIf=\"(microservices$ | async)?.length > 0 && (filteredMicroservices$ | async)?.length === 0\"\n>\n  <button\n    class=\"btn btn-primary\"\n    title=\"{{ 'Reset filters' | translate }}\"\n    type=\"button\"\n    (click)=\"resetFilters()\"\n  >\n    {{ 'Reset filters' | translate }}\n  </button>\n</c8y-ui-empty-state>\n" }]
         }], ctorParameters: () => [{ type: i1.EcosystemService }, { type: i2.WizardModalService }, { type: i0.ChangeDetectorRef }], propDecorators: { filtersComponent: [{
                 type: ViewChild,
                 args: [ListFiltersComponent]
@@ -2368,14 +1290,14 @@ class AddPackageComponent {
         this.stepper.next();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AddPackageComponent, deps: [{ token: i1.EcosystemService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: AddPackageComponent, isStandalone: false, selector: "c8y-add-package", viewQueries: [{ propertyName: "stepper", first: true, predicate: C8yStepper, descendants: true, static: true }], ngImport: i0, template: `<c8y-add-application
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: AddPackageComponent, isStandalone: true, selector: "c8y-add-package", viewQueries: [{ propertyName: "stepper", first: true, predicate: C8yStepper, descendants: true, static: true }], ngImport: i0, template: `<c8y-add-application
     [headerIcon]="'big-parcel'"
     [headerText]="headerText"
     [successText]="successText"
     [createApplicationHandler]="createPackageAppHandler"
     [uploadApplicationHandler]="uploadPackageHandler"
     [applicationType]="'package'"
-  ></c8y-add-application>`, isInline: true, dependencies: [{ kind: "component", type: i1.AddApplicationComponent, selector: "c8y-add-application", inputs: ["headerText", "headerIcon", "successText", "createApplicationHandler", "uploadApplicationHandler", "canGoBack", "applicationType"] }] }); }
+  ></c8y-add-application>`, isInline: true, dependencies: [{ kind: "component", type: AddApplicationComponent, selector: "c8y-add-application", inputs: ["headerText", "headerIcon", "successText", "createApplicationHandler", "uploadApplicationHandler", "canGoBack", "applicationType"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AddPackageComponent, decorators: [{
             type: Component,
@@ -2389,7 +1311,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
     [uploadApplicationHandler]="uploadPackageHandler"
     [applicationType]="'package'"
   ></c8y-add-application>`,
-                    standalone: false
+                    imports: [AddApplicationComponent]
                 }]
         }], ctorParameters: () => [{ type: i1.EcosystemService }], propDecorators: { stepper: [{
                 type: ViewChild,
@@ -2512,11 +1434,26 @@ class DeployApplicationComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DeployApplicationComponent, deps: [{ token: i1.EcosystemService }, { token: i2.WizardComponent }, { token: i6.TranslateService }, { token: i2.PluginsService }, { token: i2.GainsightService }, { token: i1$2.Router }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DeployApplicationComponent, isStandalone: false, selector: "c8y-deploy-application", viewQueries: [{ propertyName: "applicationPropertiesForm", first: true, predicate: ApplicationPropertiesFormComponent, descendants: true }], ngImport: i0, template: "<c8y-wizard-header>\n  <div class=\"modal-header dialog-header\">\n    <i c8yIcon=\"output\"></i>\n    <h4 id=\"modal-title\">{{ 'Deploy application' | translate }}</h4>\n  </div>\n</c8y-wizard-header>\n\n<c8y-wizard-body id=\"modal-body\">\n  <ng-container *ngIf=\"!isDeployed\">\n    <div class=\"fadeIn animated d-flex a-i-center j-c-center d-col\" style=\"min-height: 309px\">\n      <p\n        class=\"bg-level-0 fit-w p-16 text-center text-medium sticky-top bg-level-0 separator-bottom\"\n        *ngIf=\"!inProgress\"\n      >\n        {{ headerText | translate }}\n      </p>\n      <c8y-application-properties-form\n        *ngIf=\"!inProgress\"\n        [application]=\"newAppConfig\"\n        class=\"d-block fit-w bg-level-1\"\n      ></c8y-application-properties-form>\n\n      <ng-container *ngIf=\"!inProgress\">\n        <div [ngStyle]=\"{ padding: '0 16px' }\" class=\"d-block fit-w bg-gray-white\">\n          <c8y-package-version-select\n            [ngModel]=\"model.selected\"\n            (ngModelChange)=\"onAppVersionSelect($event)\"\n            [packageId]=\"package?.id\"\n            [label]=\"'Use extension package version' | translate\"\n          ></c8y-package-version-select>\n        </div>\n      </ng-container>\n\n      <c8y-loading\n        *ngIf=\"inProgress\"\n        [message]=\"'Deploying\u2026' | translate\"\n        class=\"text-center\"\n        layout=\"application\"\n      ></c8y-loading>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"isDeployed\">\n    <div\n      *ngIf=\"deployedWithSuccess; else failedDeploy\"\n      class=\"modal-body fadeIn animated\"\n      style=\"min-height: 309px\"\n    >\n      <div class=\"d-flex a-i-center j-c-center d-col\">\n        <c8y-operation-result\n          type=\"success\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n          [text]=\"successMessageTemplate | translate: { packageName: package.name }\"\n          class=\"lead d-block m-b-16\"\n        ></c8y-operation-result>\n      </div>\n    </div>\n    <ng-template #failedDeploy>\n      <div class=\"modal-body fadeIn animated text-center\" style=\"min-height: 257px\">\n        <c8y-operation-result\n          type=\"error\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n          text=\"{{ 'Application creation failed' | translate }}\"\n          class=\"lead\"\n        ></c8y-operation-result>\n      </div>\n    </ng-template>\n  </ng-container>\n</c8y-wizard-body>\n\n<c8y-wizard-footer>\n  <button\n    (click)=\"cancel()\"\n    type=\"button\"\n    class=\"btn btn-default\"\n    data-cy=\"c8y-deploy-application--cancel-blueprint-button\"\n    title=\"{{ (isDeployed && deployedWithSuccess ? doneLabel : cancelLabel) | translate }}\"\n  >\n    {{ (isDeployed && deployedWithSuccess ? doneLabel : cancelLabel) | translate }}\n  </button>\n\n  <button\n    (click)=\"deployApp()\"\n    *ngIf=\"!isDeployed\"\n    [disabled]=\"inProgress || !canDeploy\"\n    [ngClass]=\"{ 'btn-pending': inProgress }\"\n    class=\"btn btn-primary\"\n    type=\"button\"\n    data-cy=\"c8y-deploy-application--deploy-blueprint-button\"\n    title=\"{{ 'Deploy' | translate }}\"\n  >\n    {{ 'Deploy' | translate }}\n  </button>\n\n  <button\n    (click)=\"open()\"\n    type=\"button\"\n    class=\"btn btn-primary\"\n    *ngIf=\"isDeployed && deployedWithSuccess\"\n    title=\"{{ 'Open the application details' | translate }}\"\n    translate\n  >\n    Open\n  </button>\n</c8y-wizard-footer>\n", dependencies: [{ kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "component", type: i2.OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.WizardHeaderComponent, selector: "c8y-wizard-header" }, { kind: "component", type: i2.WizardBodyComponent, selector: "c8y-wizard-body" }, { kind: "component", type: i2.WizardFooterComponent, selector: "c8y-wizard-footer" }, { kind: "component", type: i1.ApplicationPropertiesFormComponent, selector: "c8y-application-properties-form", inputs: ["application", "disabled"] }, { kind: "component", type: i1.PackageVersionSelectComponent, selector: "c8y-package-version-select", inputs: ["label", "packageContextPath", "packageId"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DeployApplicationComponent, isStandalone: true, selector: "c8y-deploy-application", viewQueries: [{ propertyName: "applicationPropertiesForm", first: true, predicate: ApplicationPropertiesFormComponent, descendants: true }], ngImport: i0, template: "<c8y-wizard-header>\n  <div class=\"modal-header dialog-header\">\n    <i c8yIcon=\"output\"></i>\n    <h4 id=\"modal-title\">{{ 'Deploy application' | translate }}</h4>\n  </div>\n</c8y-wizard-header>\n\n<c8y-wizard-body id=\"modal-body\">\n  <ng-container *ngIf=\"!isDeployed\">\n    <div class=\"fadeIn animated d-flex a-i-center j-c-center d-col\" style=\"min-height: 309px\">\n      <p\n        class=\"bg-level-0 fit-w p-16 text-center text-medium sticky-top bg-level-0 separator-bottom\"\n        *ngIf=\"!inProgress\"\n      >\n        {{ headerText | translate }}\n      </p>\n      <c8y-application-properties-form\n        *ngIf=\"!inProgress\"\n        [application]=\"newAppConfig\"\n        class=\"d-block fit-w bg-level-1\"\n      ></c8y-application-properties-form>\n\n      <ng-container *ngIf=\"!inProgress\">\n        <div [ngStyle]=\"{ padding: '0 16px' }\" class=\"d-block fit-w bg-gray-white\">\n          <c8y-package-version-select\n            [ngModel]=\"model.selected\"\n            (ngModelChange)=\"onAppVersionSelect($event)\"\n            [packageId]=\"package?.id\"\n            [label]=\"'Use extension package version' | translate\"\n          ></c8y-package-version-select>\n        </div>\n      </ng-container>\n\n      <c8y-loading\n        *ngIf=\"inProgress\"\n        [message]=\"'Deploying\u2026' | translate\"\n        class=\"text-center\"\n        layout=\"application\"\n      ></c8y-loading>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"isDeployed\">\n    <div\n      *ngIf=\"deployedWithSuccess; else failedDeploy\"\n      class=\"modal-body fadeIn animated\"\n      style=\"min-height: 309px\"\n    >\n      <div class=\"d-flex a-i-center j-c-center d-col\">\n        <c8y-operation-result\n          type=\"success\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n          [text]=\"successMessageTemplate | translate: { packageName: package.name }\"\n          class=\"lead d-block m-b-16\"\n        ></c8y-operation-result>\n      </div>\n    </div>\n    <ng-template #failedDeploy>\n      <div class=\"modal-body fadeIn animated text-center\" style=\"min-height: 257px\">\n        <c8y-operation-result\n          type=\"error\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n          text=\"{{ 'Application creation failed' | translate }}\"\n          class=\"lead\"\n        ></c8y-operation-result>\n      </div>\n    </ng-template>\n  </ng-container>\n</c8y-wizard-body>\n\n<c8y-wizard-footer>\n  <button\n    (click)=\"cancel()\"\n    type=\"button\"\n    class=\"btn btn-default\"\n    data-cy=\"c8y-deploy-application--cancel-blueprint-button\"\n    title=\"{{ (isDeployed && deployedWithSuccess ? doneLabel : cancelLabel) | translate }}\"\n  >\n    {{ (isDeployed && deployedWithSuccess ? doneLabel : cancelLabel) | translate }}\n  </button>\n\n  <button\n    (click)=\"deployApp()\"\n    *ngIf=\"!isDeployed\"\n    [disabled]=\"inProgress || !canDeploy\"\n    [ngClass]=\"{ 'btn-pending': inProgress }\"\n    class=\"btn btn-primary\"\n    type=\"button\"\n    data-cy=\"c8y-deploy-application--deploy-blueprint-button\"\n    title=\"{{ 'Deploy' | translate }}\"\n  >\n    {{ 'Deploy' | translate }}\n  </button>\n\n  <button\n    (click)=\"open()\"\n    type=\"button\"\n    class=\"btn btn-primary\"\n    *ngIf=\"isDeployed && deployedWithSuccess\"\n    title=\"{{ 'Open the application details' | translate }}\"\n    translate\n  >\n    Open\n  </button>\n</c8y-wizard-footer>\n", dependencies: [{ kind: "component", type: WizardHeaderComponent, selector: "c8y-wizard-header" }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: WizardBodyComponent, selector: "c8y-wizard-body" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ApplicationPropertiesFormComponent, selector: "c8y-application-properties-form", inputs: ["application", "disabled"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: PackageVersionSelectComponent, selector: "c8y-package-version-select", inputs: ["label", "packageContextPath", "packageId"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "component", type: OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "component", type: WizardFooterComponent, selector: "c8y-wizard-footer" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DeployApplicationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-deploy-application', standalone: false, template: "<c8y-wizard-header>\n  <div class=\"modal-header dialog-header\">\n    <i c8yIcon=\"output\"></i>\n    <h4 id=\"modal-title\">{{ 'Deploy application' | translate }}</h4>\n  </div>\n</c8y-wizard-header>\n\n<c8y-wizard-body id=\"modal-body\">\n  <ng-container *ngIf=\"!isDeployed\">\n    <div class=\"fadeIn animated d-flex a-i-center j-c-center d-col\" style=\"min-height: 309px\">\n      <p\n        class=\"bg-level-0 fit-w p-16 text-center text-medium sticky-top bg-level-0 separator-bottom\"\n        *ngIf=\"!inProgress\"\n      >\n        {{ headerText | translate }}\n      </p>\n      <c8y-application-properties-form\n        *ngIf=\"!inProgress\"\n        [application]=\"newAppConfig\"\n        class=\"d-block fit-w bg-level-1\"\n      ></c8y-application-properties-form>\n\n      <ng-container *ngIf=\"!inProgress\">\n        <div [ngStyle]=\"{ padding: '0 16px' }\" class=\"d-block fit-w bg-gray-white\">\n          <c8y-package-version-select\n            [ngModel]=\"model.selected\"\n            (ngModelChange)=\"onAppVersionSelect($event)\"\n            [packageId]=\"package?.id\"\n            [label]=\"'Use extension package version' | translate\"\n          ></c8y-package-version-select>\n        </div>\n      </ng-container>\n\n      <c8y-loading\n        *ngIf=\"inProgress\"\n        [message]=\"'Deploying\u2026' | translate\"\n        class=\"text-center\"\n        layout=\"application\"\n      ></c8y-loading>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"isDeployed\">\n    <div\n      *ngIf=\"deployedWithSuccess; else failedDeploy\"\n      class=\"modal-body fadeIn animated\"\n      style=\"min-height: 309px\"\n    >\n      <div class=\"d-flex a-i-center j-c-center d-col\">\n        <c8y-operation-result\n          type=\"success\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n          [text]=\"successMessageTemplate | translate: { packageName: package.name }\"\n          class=\"lead d-block m-b-16\"\n        ></c8y-operation-result>\n      </div>\n    </div>\n    <ng-template #failedDeploy>\n      <div class=\"modal-body fadeIn animated text-center\" style=\"min-height: 257px\">\n        <c8y-operation-result\n          type=\"error\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n          text=\"{{ 'Application creation failed' | translate }}\"\n          class=\"lead\"\n        ></c8y-operation-result>\n      </div>\n    </ng-template>\n  </ng-container>\n</c8y-wizard-body>\n\n<c8y-wizard-footer>\n  <button\n    (click)=\"cancel()\"\n    type=\"button\"\n    class=\"btn btn-default\"\n    data-cy=\"c8y-deploy-application--cancel-blueprint-button\"\n    title=\"{{ (isDeployed && deployedWithSuccess ? doneLabel : cancelLabel) | translate }}\"\n  >\n    {{ (isDeployed && deployedWithSuccess ? doneLabel : cancelLabel) | translate }}\n  </button>\n\n  <button\n    (click)=\"deployApp()\"\n    *ngIf=\"!isDeployed\"\n    [disabled]=\"inProgress || !canDeploy\"\n    [ngClass]=\"{ 'btn-pending': inProgress }\"\n    class=\"btn btn-primary\"\n    type=\"button\"\n    data-cy=\"c8y-deploy-application--deploy-blueprint-button\"\n    title=\"{{ 'Deploy' | translate }}\"\n  >\n    {{ 'Deploy' | translate }}\n  </button>\n\n  <button\n    (click)=\"open()\"\n    type=\"button\"\n    class=\"btn btn-primary\"\n    *ngIf=\"isDeployed && deployedWithSuccess\"\n    title=\"{{ 'Open the application details' | translate }}\"\n    translate\n  >\n    Open\n  </button>\n</c8y-wizard-footer>\n" }]
+            args: [{ selector: 'c8y-deploy-application', imports: [
+                        WizardHeaderComponent,
+                        IconDirective,
+                        WizardBodyComponent,
+                        NgIf,
+                        ApplicationPropertiesFormComponent,
+                        NgStyle,
+                        PackageVersionSelectComponent,
+                        FormsModule,
+                        LoadingComponent,
+                        OperationResultComponent,
+                        WizardFooterComponent,
+                        NgClass,
+                        C8yTranslateDirective,
+                        C8yTranslatePipe
+                    ], template: "<c8y-wizard-header>\n  <div class=\"modal-header dialog-header\">\n    <i c8yIcon=\"output\"></i>\n    <h4 id=\"modal-title\">{{ 'Deploy application' | translate }}</h4>\n  </div>\n</c8y-wizard-header>\n\n<c8y-wizard-body id=\"modal-body\">\n  <ng-container *ngIf=\"!isDeployed\">\n    <div class=\"fadeIn animated d-flex a-i-center j-c-center d-col\" style=\"min-height: 309px\">\n      <p\n        class=\"bg-level-0 fit-w p-16 text-center text-medium sticky-top bg-level-0 separator-bottom\"\n        *ngIf=\"!inProgress\"\n      >\n        {{ headerText | translate }}\n      </p>\n      <c8y-application-properties-form\n        *ngIf=\"!inProgress\"\n        [application]=\"newAppConfig\"\n        class=\"d-block fit-w bg-level-1\"\n      ></c8y-application-properties-form>\n\n      <ng-container *ngIf=\"!inProgress\">\n        <div [ngStyle]=\"{ padding: '0 16px' }\" class=\"d-block fit-w bg-gray-white\">\n          <c8y-package-version-select\n            [ngModel]=\"model.selected\"\n            (ngModelChange)=\"onAppVersionSelect($event)\"\n            [packageId]=\"package?.id\"\n            [label]=\"'Use extension package version' | translate\"\n          ></c8y-package-version-select>\n        </div>\n      </ng-container>\n\n      <c8y-loading\n        *ngIf=\"inProgress\"\n        [message]=\"'Deploying\u2026' | translate\"\n        class=\"text-center\"\n        layout=\"application\"\n      ></c8y-loading>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"isDeployed\">\n    <div\n      *ngIf=\"deployedWithSuccess; else failedDeploy\"\n      class=\"modal-body fadeIn animated\"\n      style=\"min-height: 309px\"\n    >\n      <div class=\"d-flex a-i-center j-c-center d-col\">\n        <c8y-operation-result\n          type=\"success\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n          [text]=\"successMessageTemplate | translate: { packageName: package.name }\"\n          class=\"lead d-block m-b-16\"\n        ></c8y-operation-result>\n      </div>\n    </div>\n    <ng-template #failedDeploy>\n      <div class=\"modal-body fadeIn animated text-center\" style=\"min-height: 257px\">\n        <c8y-operation-result\n          type=\"error\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n          text=\"{{ 'Application creation failed' | translate }}\"\n          class=\"lead\"\n        ></c8y-operation-result>\n      </div>\n    </ng-template>\n  </ng-container>\n</c8y-wizard-body>\n\n<c8y-wizard-footer>\n  <button\n    (click)=\"cancel()\"\n    type=\"button\"\n    class=\"btn btn-default\"\n    data-cy=\"c8y-deploy-application--cancel-blueprint-button\"\n    title=\"{{ (isDeployed && deployedWithSuccess ? doneLabel : cancelLabel) | translate }}\"\n  >\n    {{ (isDeployed && deployedWithSuccess ? doneLabel : cancelLabel) | translate }}\n  </button>\n\n  <button\n    (click)=\"deployApp()\"\n    *ngIf=\"!isDeployed\"\n    [disabled]=\"inProgress || !canDeploy\"\n    [ngClass]=\"{ 'btn-pending': inProgress }\"\n    class=\"btn btn-primary\"\n    type=\"button\"\n    data-cy=\"c8y-deploy-application--deploy-blueprint-button\"\n    title=\"{{ 'Deploy' | translate }}\"\n  >\n    {{ 'Deploy' | translate }}\n  </button>\n\n  <button\n    (click)=\"open()\"\n    type=\"button\"\n    class=\"btn btn-primary\"\n    *ngIf=\"isDeployed && deployedWithSuccess\"\n    title=\"{{ 'Open the application details' | translate }}\"\n    translate\n  >\n    Open\n  </button>\n</c8y-wizard-footer>\n" }]
         }], ctorParameters: () => [{ type: i1.EcosystemService }, { type: i2.WizardComponent }, { type: i6.TranslateService }, { type: i2.PluginsService }, { type: i2.GainsightService }, { type: i1$2.Router }], propDecorators: { applicationPropertiesForm: [{
                 type: ViewChild,
                 args: [ApplicationPropertiesFormComponent]
@@ -2603,11 +1540,31 @@ class PackageDetailsComponent {
         this.exportedPlugins$.next(exports);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PackageDetailsComponent, deps: [{ token: i1$2.ActivatedRoute }, { token: i2.WizardModalService }, { token: i1.EcosystemService }, { token: i2.ContextRouteService }, { token: i2.PluginsService }, { token: i1.PackageAvailabilityService }, { token: i2.AppStateService }, { token: i2.GainsightService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PackageDetailsComponent, isStandalone: false, selector: "c8y-package-details", ngImport: i0, template: "<c8y-title>{{ name | humanizeAppName | async }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'big-parcel'\"\n    [label]=\"'Extensions' | translate\"\n    [path]=\"'ecosystem/extension/extensions'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"name | humanizeAppName | async\"></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"'Extension package' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item\n  placement=\"right\"\n  itemClass=\"navbar-form\"\n  *ngIf=\"isOwnedByCurrentTenant && isAllowedToCreateSubtenants\"\n>\n  <div class=\"d-flex a-i-center\">\n    <label\n      class=\"m-b-0 m-r-8\"\n      for=\"availability\"\n      translate\n    >\n      Availability`of package based on app state`\n    </label>\n    <div class=\"c8y-select-wrapper\">\n      <select\n        class=\"form-control\"\n        id=\"availability\"\n        [(ngModel)]=\"packageAvailability\"\n        [disabled]=\"isChangingAvailability\"\n        (ngModelChange)=\"togglePackageAvailability(package, $event)\"\n      >\n        <option\n          *ngFor=\"let availability of packageAvailabilityService.availabilities\"\n          [ngValue]=\"availability.value\"\n        >\n          {{ availability.label | translate }}\n        </option>\n      </select>\n    </div>\n  </div>\n</c8y-action-bar-item>\n\n<div\n  class=\"card content-fullpage d-grid grid__row--fit-auto\"\n  [ngClass]=\"{ 'grid__col--8-4-0': !selectedPlugin, 'grid__col--0-4-8': !!selectedPlugin }\"\n>\n  <div class=\"bg-level-1 grid__col--fullspan separator-bottom\">\n    <div class=\"card-block p-t-24 p-b-24 large-padding\">\n      <button\n        class=\"card__ribbon btn-clean\"\n        [attr.aria-label]=\"\n          (package.label || package.manifest.label | translatePackageLabel) +\n          ': ' +\n          (packageTypeLabels[packageType].tooltip | translate)\n        \"\n        tooltip=\"{{ packageTypeLabels[packageType].tooltip | translate }}\"\n        placement=\"bottom\"\n        type=\"button\"\n        *ngIf=\"packageType !== PACKAGE_TYPE.CUSTOM\"\n        [delay]=\"500\"\n      >\n        <span\n          [ngClass]=\"{\n            'bg-info': packageType === PACKAGE_TYPE.COMMUNITY,\n            'bg-primary': packageType === PACKAGE_TYPE.OFFICIAL,\n            'bg-warning': packageType === PACKAGE_TYPE.ARCHIVED\n          }\"\n        >\n          {{ package.label || package.manifest.label | translatePackageLabel }}\n        </span>\n      </button>\n      <div class=\"content-flex-70\">\n        <div class=\"text-center\">\n          <i\n            class=\"c8y-icon-duocolor icon-48\"\n            c8yIcon=\"big-parcel\"\n          ></i>\n          <button\n            class=\"btn-clean\"\n            [attr.aria-label]=\"\n              (appState?.label | translate) + ': ' + (appState?.tooltip | translate)\n            \"\n            [tooltip]=\"appState?.tooltip | translate\"\n            placement=\"top\"\n            type=\"button\"\n            [delay]=\"500\"\n          >\n            <span\n              class=\"label\"\n              [ngClass]=\"appState?.class\"\n            >\n              {{ appState?.label | translate }}\n            </span>\n          </button>\n          <button\n            class=\"btn-clean\"\n            [attr.aria-label]=\"\n              (packageContentState?.label | translate) +\n              ': ' +\n              (packageContentState?.tooltip | translate)\n            \"\n            [tooltip]=\"packageContentState?.tooltip | translate\"\n            placement=\"bottom\"\n            type=\"button\"\n            [delay]=\"500\"\n          >\n            <span\n              class=\"label\"\n              [ngClass]=\"packageContentState?.class\"\n            >\n              {{ packageContentState?.label | translate }}\n            </span>\n          </button>\n        </div>\n\n        <div class=\"flex-grow col-10\">\n          <div class=\"content-flex-80\">\n            <div class=\"col-8\">\n              <div class=\"card-title h4 m-b-8\">{{ name | humanizeAppName | async }}</div>\n              <p *ngIf=\"description\">{{ description }}</p>\n              <p\n                class=\"text-muted\"\n                *ngIf=\"!description\"\n              >\n                <em>{{ 'No description available.' | translate }}</em>\n              </p>\n            </div>\n            <div\n              class=\"col-3 text-right-md p-r-md-40\"\n              *ngIf=\"isPackageBlueprint\"\n            >\n              <button\n                class=\"btn btn-primary btn-sm\"\n                (click)=\"deploy()\"\n                data-cy=\"c8y-package-details--deploy-application-button\"\n              >\n                <i\n                  class=\"m-r-4\"\n                  c8yIcon=\"output\"\n                ></i>\n                {{ 'Deploy application' | translate }}\n              </button>\n            </div>\n            <div class=\"flex-grow\">\n              <c8y-properties-list\n                [data]=\"package.manifest\"\n                [properties]=\"packageProperties\"\n              ></c8y-properties-list>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n  <div class=\"inner-scroll\">\n    <div class=\"card-header separator sticky-top\">\n      <div class=\"card-title\">{{ 'Extension package overview' | translate }}</div>\n    </div>\n    <div class=\"card-block p-l-16 p-r-16\">\n      <div\n        class=\"alert alert-warning m-b-16\"\n        style=\"margin: auto\"\n        *ngIf=\"packageType === PACKAGE_TYPE.ARCHIVED\"\n        translate\n      >\n        The package was archived by the owner marking it as out of maintenance. It is not\n        recommended to install the package.\n      </div>\n      <c8y-ui-empty-state\n        [icon]=\"'user-manual'\"\n        [title]=\"'No README.md found' | translate\"\n        [subtitle]=\"\n          'To view the contents of &quot;README&quot;, add the file &quot;README.md&quot; to the package.'\n            | translate\n        \"\n        *ngIf=\"!markdown\"\n        [horizontal]=\"true\"\n      ></c8y-ui-empty-state>\n      <div\n        class=\"markdown-content\"\n        [innerHTML]=\"markdown | markdownToHtml: { baseUrl } | async\"\n      ></div>\n    </div>\n    <div class=\"separator-bottom visible-sm visible-xs\"></div>\n  </div>\n\n  <div\n    class=\"inner-scroll d-flex d-col bg-level-1 split-view__list\"\n    [ngClass]=\"{ 'border-right': !!selectedPlugin }\"\n  >\n    <div class=\"card-header separator sticky-top\">\n      <div class=\"card-title\">{{ 'Package plugins' | translate }}</div>\n    </div>\n    <div class=\"border-left flex-grow\">\n      <!-- empty state -->\n      <div\n        class=\"p-16\"\n        *ngIf=\"(exportedPlugins$ | async).length === 0\"\n      >\n        <c8y-ui-empty-state\n          [icon]=\"'plugin'\"\n          [title]=\"'No plugins to display.' | translate\"\n          [subtitle]=\"'This package doesn\\'t contain plugins.' | translate\"\n          [horizontal]=\"true\"\n        ></c8y-ui-empty-state>\n      </div>\n      <c8y-plugin-list\n        [plugins$]=\"exportedPlugins$\"\n        [selectable]=\"false\"\n        [installable]=\"true\"\n        [package]=\"package\"\n        [selectedPlugin]=\"selectedPlugin\"\n        (showOverview)=\"showPluginOverview($event)\"\n      ></c8y-plugin-list>\n    </div>\n  </div>\n\n  <div class=\"inner-scroll split-view__detail\"\n    [ngClass]=\"{ 'split-view__detail--selected': selectedPlugin }\">\n    <div\n      class=\"card-header separator sticky-top\"\n      *ngIf=\"selectedPlugin\"\n    >\n      <button\n        class=\"btn-clean\"\n        (click)=\"closeOverview()\"\n      >\n        <i c8yIcon=\"caret-back\"></i>\n        {{ 'Back to package overview ' | translate }}\n      </button>\n    </div>\n    <div\n      class=\"card-block p-l-16 p-r-16 overflow-visible\"\n      *ngIf=\"selectedPlugin\"\n    >\n      <div\n        class=\"markdown-content\"\n        *ngIf=\"pluginMarkdown\"\n        [innerHTML]=\"pluginMarkdown | markdownToHtml: { baseUrl: pluginBaseUrl } | async\"\n      ></div>\n      <c8y-ui-empty-state\n        [icon]=\"'user-manual'\"\n        [title]=\"'No README.md found for plugin' | translate\"\n        [subtitle]=\"\n          'To view the contents of &quot;README&quot;, add the file &quot;README.md&quot; to the plugin.'\n            | translate\n        \"\n        *ngIf=\"!pluginMarkdown\"\n        [horizontal]=\"true\"\n      ></c8y-ui-empty-state>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "component", type: i2.ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "component", type: i2.BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: i2.BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "component", type: i2.EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "directive", type: i2$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.PropertiesListComponent, selector: "c8y-properties-list", inputs: ["properties", "title", "icon", "data", "groups", "noParse", "emptyLabel"] }, { kind: "directive", type: i9.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: PluginListComponent, selector: "c8y-plugin-list", inputs: ["plugins$", "emptyListText", "selectable", "hideSource", "installable", "package", "selectedPlugin"], outputs: ["selectedItems", "showOverview"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.HumanizeAppNamePipe, name: "humanizeAppName" }, { kind: "pipe", type: i2.MarkdownToHtmlPipe, name: "markdownToHtml" }, { kind: "pipe", type: i1.TranslatePackageLabelPipe, name: "translatePackageLabel" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PackageDetailsComponent, isStandalone: true, selector: "c8y-package-details", ngImport: i0, template: "<c8y-title>{{ name | humanizeAppName | async }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'big-parcel'\"\n    [label]=\"'Extensions' | translate\"\n    [path]=\"'ecosystem/extension/extensions'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"name | humanizeAppName | async\"></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"'Extension package' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item\n  placement=\"right\"\n  itemClass=\"navbar-form\"\n  *ngIf=\"isOwnedByCurrentTenant && isAllowedToCreateSubtenants\"\n>\n  <div class=\"d-flex a-i-center\">\n    <label\n      class=\"m-b-0 m-r-8\"\n      for=\"availability\"\n      translate\n    >\n      Availability`of package based on app state`\n    </label>\n    <div class=\"c8y-select-wrapper\">\n      <select\n        class=\"form-control\"\n        id=\"availability\"\n        [(ngModel)]=\"packageAvailability\"\n        [disabled]=\"isChangingAvailability\"\n        (ngModelChange)=\"togglePackageAvailability(package, $event)\"\n      >\n        <option\n          *ngFor=\"let availability of packageAvailabilityService.availabilities\"\n          [ngValue]=\"availability.value\"\n        >\n          {{ availability.label | translate }}\n        </option>\n      </select>\n    </div>\n  </div>\n</c8y-action-bar-item>\n\n<div\n  class=\"card content-fullpage d-grid grid__row--fit-auto\"\n  [ngClass]=\"{ 'grid__col--8-4-0': !selectedPlugin, 'grid__col--0-4-8': !!selectedPlugin }\"\n>\n  <div class=\"bg-level-1 grid__col--fullspan separator-bottom\">\n    <div class=\"card-block p-t-24 p-b-24 large-padding\">\n      <button\n        class=\"card__ribbon btn-clean\"\n        [attr.aria-label]=\"\n          (package.label || package.manifest.label | translatePackageLabel) +\n          ': ' +\n          (packageTypeLabels[packageType].tooltip | translate)\n        \"\n        tooltip=\"{{ packageTypeLabels[packageType].tooltip | translate }}\"\n        placement=\"bottom\"\n        type=\"button\"\n        *ngIf=\"packageType !== PACKAGE_TYPE.CUSTOM\"\n        [delay]=\"500\"\n      >\n        <span\n          [ngClass]=\"{\n            'bg-info': packageType === PACKAGE_TYPE.COMMUNITY,\n            'bg-primary': packageType === PACKAGE_TYPE.OFFICIAL,\n            'bg-warning': packageType === PACKAGE_TYPE.ARCHIVED\n          }\"\n        >\n          {{ package.label || package.manifest.label | translatePackageLabel }}\n        </span>\n      </button>\n      <div class=\"content-flex-70\">\n        <div class=\"text-center\">\n          <i\n            class=\"c8y-icon-duocolor icon-48\"\n            c8yIcon=\"big-parcel\"\n          ></i>\n          <button\n            class=\"btn-clean\"\n            [attr.aria-label]=\"\n              (appState?.label | translate) + ': ' + (appState?.tooltip | translate)\n            \"\n            [tooltip]=\"appState?.tooltip | translate\"\n            placement=\"top\"\n            type=\"button\"\n            [delay]=\"500\"\n          >\n            <span\n              class=\"label\"\n              [ngClass]=\"appState?.class\"\n            >\n              {{ appState?.label | translate }}\n            </span>\n          </button>\n          <button\n            class=\"btn-clean\"\n            [attr.aria-label]=\"\n              (packageContentState?.label | translate) +\n              ': ' +\n              (packageContentState?.tooltip | translate)\n            \"\n            [tooltip]=\"packageContentState?.tooltip | translate\"\n            placement=\"bottom\"\n            type=\"button\"\n            [delay]=\"500\"\n          >\n            <span\n              class=\"label\"\n              [ngClass]=\"packageContentState?.class\"\n            >\n              {{ packageContentState?.label | translate }}\n            </span>\n          </button>\n        </div>\n\n        <div class=\"flex-grow col-10\">\n          <div class=\"content-flex-80\">\n            <div class=\"col-8\">\n              <div class=\"card-title h4 m-b-8\">{{ name | humanizeAppName | async }}</div>\n              <p *ngIf=\"description\">{{ description }}</p>\n              <p\n                class=\"text-muted\"\n                *ngIf=\"!description\"\n              >\n                <em>{{ 'No description available.' | translate }}</em>\n              </p>\n            </div>\n            <div\n              class=\"col-3 text-right-md p-r-md-40\"\n              *ngIf=\"isPackageBlueprint\"\n            >\n              <button\n                class=\"btn btn-primary btn-sm\"\n                (click)=\"deploy()\"\n                data-cy=\"c8y-package-details--deploy-application-button\"\n              >\n                <i\n                  class=\"m-r-4\"\n                  c8yIcon=\"output\"\n                ></i>\n                {{ 'Deploy application' | translate }}\n              </button>\n            </div>\n            <div class=\"flex-grow\">\n              <c8y-properties-list\n                [data]=\"package.manifest\"\n                [properties]=\"packageProperties\"\n              ></c8y-properties-list>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n  <div class=\"inner-scroll\">\n    <div class=\"card-header separator sticky-top\">\n      <div class=\"card-title\">{{ 'Extension package overview' | translate }}</div>\n    </div>\n    <div class=\"card-block p-l-16 p-r-16\">\n      <div\n        class=\"alert alert-warning m-b-16\"\n        style=\"margin: auto\"\n        *ngIf=\"packageType === PACKAGE_TYPE.ARCHIVED\"\n        translate\n      >\n        The package was archived by the owner marking it as out of maintenance. It is not\n        recommended to install the package.\n      </div>\n      <c8y-ui-empty-state\n        [icon]=\"'user-manual'\"\n        [title]=\"'No README.md found' | translate\"\n        [subtitle]=\"\n          'To view the contents of &quot;README&quot;, add the file &quot;README.md&quot; to the package.'\n            | translate\n        \"\n        *ngIf=\"!markdown\"\n        [horizontal]=\"true\"\n      ></c8y-ui-empty-state>\n      <div\n        class=\"markdown-content\"\n        [innerHTML]=\"markdown | markdownToHtml: { baseUrl } | async\"\n      ></div>\n    </div>\n    <div class=\"separator-bottom visible-sm visible-xs\"></div>\n  </div>\n\n  <div\n    class=\"inner-scroll d-flex d-col bg-level-1 split-view__list\"\n    [ngClass]=\"{ 'border-right': !!selectedPlugin }\"\n  >\n    <div class=\"card-header separator sticky-top\">\n      <div class=\"card-title\">{{ 'Package plugins' | translate }}</div>\n    </div>\n    <div class=\"border-left flex-grow\">\n      <!-- empty state -->\n      <div\n        class=\"p-16\"\n        *ngIf=\"(exportedPlugins$ | async).length === 0\"\n      >\n        <c8y-ui-empty-state\n          [icon]=\"'plugin'\"\n          [title]=\"'No plugins to display.' | translate\"\n          [subtitle]=\"'This package doesn\\'t contain plugins.' | translate\"\n          [horizontal]=\"true\"\n        ></c8y-ui-empty-state>\n      </div>\n      <c8y-plugin-list\n        [plugins$]=\"exportedPlugins$\"\n        [selectable]=\"false\"\n        [installable]=\"true\"\n        [package]=\"package\"\n        [selectedPlugin]=\"selectedPlugin\"\n        (showOverview)=\"showPluginOverview($event)\"\n      ></c8y-plugin-list>\n    </div>\n  </div>\n\n  <div class=\"inner-scroll split-view__detail\"\n    [ngClass]=\"{ 'split-view__detail--selected': selectedPlugin }\">\n    <div\n      class=\"card-header separator sticky-top\"\n      *ngIf=\"selectedPlugin\"\n    >\n      <button\n        class=\"btn-clean\"\n        (click)=\"closeOverview()\"\n      >\n        <i c8yIcon=\"caret-back\"></i>\n        {{ 'Back to package overview ' | translate }}\n      </button>\n    </div>\n    <div\n      class=\"card-block p-l-16 p-r-16 overflow-visible\"\n      *ngIf=\"selectedPlugin\"\n    >\n      <div\n        class=\"markdown-content\"\n        *ngIf=\"pluginMarkdown\"\n        [innerHTML]=\"pluginMarkdown | markdownToHtml: { baseUrl: pluginBaseUrl } | async\"\n      ></div>\n      <c8y-ui-empty-state\n        [icon]=\"'user-manual'\"\n        [title]=\"'No README.md found for plugin' | translate\"\n        [subtitle]=\"\n          'To view the contents of &quot;README&quot;, add the file &quot;README.md&quot; to the plugin.'\n            | translate\n        \"\n        *ngIf=\"!pluginMarkdown\"\n        [horizontal]=\"true\"\n      ></c8y-ui-empty-state>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "component", type: TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "component", type: BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: PropertiesListComponent, selector: "c8y-properties-list", inputs: ["properties", "title", "icon", "data", "groups", "noParse", "emptyLabel"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "component", type: PluginListComponent, selector: "c8y-plugin-list", inputs: ["plugins$", "emptyListText", "selectable", "hideSource", "installable", "package", "selectedPlugin"], outputs: ["selectedItems", "showOverview"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: HumanizeAppNamePipe, name: "humanizeAppName" }, { kind: "pipe", type: MarkdownToHtmlPipe, name: "markdownToHtml" }, { kind: "pipe", type: TranslatePackageLabelPipe, name: "translatePackageLabel" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PackageDetailsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-package-details', standalone: false, template: "<c8y-title>{{ name | humanizeAppName | async }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'big-parcel'\"\n    [label]=\"'Extensions' | translate\"\n    [path]=\"'ecosystem/extension/extensions'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"name | humanizeAppName | async\"></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"'Extension package' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item\n  placement=\"right\"\n  itemClass=\"navbar-form\"\n  *ngIf=\"isOwnedByCurrentTenant && isAllowedToCreateSubtenants\"\n>\n  <div class=\"d-flex a-i-center\">\n    <label\n      class=\"m-b-0 m-r-8\"\n      for=\"availability\"\n      translate\n    >\n      Availability`of package based on app state`\n    </label>\n    <div class=\"c8y-select-wrapper\">\n      <select\n        class=\"form-control\"\n        id=\"availability\"\n        [(ngModel)]=\"packageAvailability\"\n        [disabled]=\"isChangingAvailability\"\n        (ngModelChange)=\"togglePackageAvailability(package, $event)\"\n      >\n        <option\n          *ngFor=\"let availability of packageAvailabilityService.availabilities\"\n          [ngValue]=\"availability.value\"\n        >\n          {{ availability.label | translate }}\n        </option>\n      </select>\n    </div>\n  </div>\n</c8y-action-bar-item>\n\n<div\n  class=\"card content-fullpage d-grid grid__row--fit-auto\"\n  [ngClass]=\"{ 'grid__col--8-4-0': !selectedPlugin, 'grid__col--0-4-8': !!selectedPlugin }\"\n>\n  <div class=\"bg-level-1 grid__col--fullspan separator-bottom\">\n    <div class=\"card-block p-t-24 p-b-24 large-padding\">\n      <button\n        class=\"card__ribbon btn-clean\"\n        [attr.aria-label]=\"\n          (package.label || package.manifest.label | translatePackageLabel) +\n          ': ' +\n          (packageTypeLabels[packageType].tooltip | translate)\n        \"\n        tooltip=\"{{ packageTypeLabels[packageType].tooltip | translate }}\"\n        placement=\"bottom\"\n        type=\"button\"\n        *ngIf=\"packageType !== PACKAGE_TYPE.CUSTOM\"\n        [delay]=\"500\"\n      >\n        <span\n          [ngClass]=\"{\n            'bg-info': packageType === PACKAGE_TYPE.COMMUNITY,\n            'bg-primary': packageType === PACKAGE_TYPE.OFFICIAL,\n            'bg-warning': packageType === PACKAGE_TYPE.ARCHIVED\n          }\"\n        >\n          {{ package.label || package.manifest.label | translatePackageLabel }}\n        </span>\n      </button>\n      <div class=\"content-flex-70\">\n        <div class=\"text-center\">\n          <i\n            class=\"c8y-icon-duocolor icon-48\"\n            c8yIcon=\"big-parcel\"\n          ></i>\n          <button\n            class=\"btn-clean\"\n            [attr.aria-label]=\"\n              (appState?.label | translate) + ': ' + (appState?.tooltip | translate)\n            \"\n            [tooltip]=\"appState?.tooltip | translate\"\n            placement=\"top\"\n            type=\"button\"\n            [delay]=\"500\"\n          >\n            <span\n              class=\"label\"\n              [ngClass]=\"appState?.class\"\n            >\n              {{ appState?.label | translate }}\n            </span>\n          </button>\n          <button\n            class=\"btn-clean\"\n            [attr.aria-label]=\"\n              (packageContentState?.label | translate) +\n              ': ' +\n              (packageContentState?.tooltip | translate)\n            \"\n            [tooltip]=\"packageContentState?.tooltip | translate\"\n            placement=\"bottom\"\n            type=\"button\"\n            [delay]=\"500\"\n          >\n            <span\n              class=\"label\"\n              [ngClass]=\"packageContentState?.class\"\n            >\n              {{ packageContentState?.label | translate }}\n            </span>\n          </button>\n        </div>\n\n        <div class=\"flex-grow col-10\">\n          <div class=\"content-flex-80\">\n            <div class=\"col-8\">\n              <div class=\"card-title h4 m-b-8\">{{ name | humanizeAppName | async }}</div>\n              <p *ngIf=\"description\">{{ description }}</p>\n              <p\n                class=\"text-muted\"\n                *ngIf=\"!description\"\n              >\n                <em>{{ 'No description available.' | translate }}</em>\n              </p>\n            </div>\n            <div\n              class=\"col-3 text-right-md p-r-md-40\"\n              *ngIf=\"isPackageBlueprint\"\n            >\n              <button\n                class=\"btn btn-primary btn-sm\"\n                (click)=\"deploy()\"\n                data-cy=\"c8y-package-details--deploy-application-button\"\n              >\n                <i\n                  class=\"m-r-4\"\n                  c8yIcon=\"output\"\n                ></i>\n                {{ 'Deploy application' | translate }}\n              </button>\n            </div>\n            <div class=\"flex-grow\">\n              <c8y-properties-list\n                [data]=\"package.manifest\"\n                [properties]=\"packageProperties\"\n              ></c8y-properties-list>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n  <div class=\"inner-scroll\">\n    <div class=\"card-header separator sticky-top\">\n      <div class=\"card-title\">{{ 'Extension package overview' | translate }}</div>\n    </div>\n    <div class=\"card-block p-l-16 p-r-16\">\n      <div\n        class=\"alert alert-warning m-b-16\"\n        style=\"margin: auto\"\n        *ngIf=\"packageType === PACKAGE_TYPE.ARCHIVED\"\n        translate\n      >\n        The package was archived by the owner marking it as out of maintenance. It is not\n        recommended to install the package.\n      </div>\n      <c8y-ui-empty-state\n        [icon]=\"'user-manual'\"\n        [title]=\"'No README.md found' | translate\"\n        [subtitle]=\"\n          'To view the contents of &quot;README&quot;, add the file &quot;README.md&quot; to the package.'\n            | translate\n        \"\n        *ngIf=\"!markdown\"\n        [horizontal]=\"true\"\n      ></c8y-ui-empty-state>\n      <div\n        class=\"markdown-content\"\n        [innerHTML]=\"markdown | markdownToHtml: { baseUrl } | async\"\n      ></div>\n    </div>\n    <div class=\"separator-bottom visible-sm visible-xs\"></div>\n  </div>\n\n  <div\n    class=\"inner-scroll d-flex d-col bg-level-1 split-view__list\"\n    [ngClass]=\"{ 'border-right': !!selectedPlugin }\"\n  >\n    <div class=\"card-header separator sticky-top\">\n      <div class=\"card-title\">{{ 'Package plugins' | translate }}</div>\n    </div>\n    <div class=\"border-left flex-grow\">\n      <!-- empty state -->\n      <div\n        class=\"p-16\"\n        *ngIf=\"(exportedPlugins$ | async).length === 0\"\n      >\n        <c8y-ui-empty-state\n          [icon]=\"'plugin'\"\n          [title]=\"'No plugins to display.' | translate\"\n          [subtitle]=\"'This package doesn\\'t contain plugins.' | translate\"\n          [horizontal]=\"true\"\n        ></c8y-ui-empty-state>\n      </div>\n      <c8y-plugin-list\n        [plugins$]=\"exportedPlugins$\"\n        [selectable]=\"false\"\n        [installable]=\"true\"\n        [package]=\"package\"\n        [selectedPlugin]=\"selectedPlugin\"\n        (showOverview)=\"showPluginOverview($event)\"\n      ></c8y-plugin-list>\n    </div>\n  </div>\n\n  <div class=\"inner-scroll split-view__detail\"\n    [ngClass]=\"{ 'split-view__detail--selected': selectedPlugin }\">\n    <div\n      class=\"card-header separator sticky-top\"\n      *ngIf=\"selectedPlugin\"\n    >\n      <button\n        class=\"btn-clean\"\n        (click)=\"closeOverview()\"\n      >\n        <i c8yIcon=\"caret-back\"></i>\n        {{ 'Back to package overview ' | translate }}\n      </button>\n    </div>\n    <div\n      class=\"card-block p-l-16 p-r-16 overflow-visible\"\n      *ngIf=\"selectedPlugin\"\n    >\n      <div\n        class=\"markdown-content\"\n        *ngIf=\"pluginMarkdown\"\n        [innerHTML]=\"pluginMarkdown | markdownToHtml: { baseUrl: pluginBaseUrl } | async\"\n      ></div>\n      <c8y-ui-empty-state\n        [icon]=\"'user-manual'\"\n        [title]=\"'No README.md found for plugin' | translate\"\n        [subtitle]=\"\n          'To view the contents of &quot;README&quot;, add the file &quot;README.md&quot; to the plugin.'\n            | translate\n        \"\n        *ngIf=\"!pluginMarkdown\"\n        [horizontal]=\"true\"\n      ></c8y-ui-empty-state>\n    </div>\n  </div>\n</div>\n" }]
+            args: [{ selector: 'c8y-package-details', imports: [
+                        TitleComponent,
+                        BreadcrumbComponent,
+                        BreadcrumbItemComponent,
+                        NgIf,
+                        ActionBarItemComponent,
+                        C8yTranslateDirective,
+                        FormsModule,
+                        NgFor,
+                        NgClass,
+                        TooltipDirective,
+                        IconDirective,
+                        PropertiesListComponent,
+                        EmptyStateComponent,
+                        PluginListComponent,
+                        C8yTranslatePipe,
+                        AsyncPipe,
+                        HumanizeAppNamePipe,
+                        MarkdownToHtmlPipe,
+                        TranslatePackageLabelPipe
+                    ], template: "<c8y-title>{{ name | humanizeAppName | async }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'big-parcel'\"\n    [label]=\"'Extensions' | translate\"\n    [path]=\"'ecosystem/extension/extensions'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"name | humanizeAppName | async\"></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"'Extension package' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item\n  placement=\"right\"\n  itemClass=\"navbar-form\"\n  *ngIf=\"isOwnedByCurrentTenant && isAllowedToCreateSubtenants\"\n>\n  <div class=\"d-flex a-i-center\">\n    <label\n      class=\"m-b-0 m-r-8\"\n      for=\"availability\"\n      translate\n    >\n      Availability`of package based on app state`\n    </label>\n    <div class=\"c8y-select-wrapper\">\n      <select\n        class=\"form-control\"\n        id=\"availability\"\n        [(ngModel)]=\"packageAvailability\"\n        [disabled]=\"isChangingAvailability\"\n        (ngModelChange)=\"togglePackageAvailability(package, $event)\"\n      >\n        <option\n          *ngFor=\"let availability of packageAvailabilityService.availabilities\"\n          [ngValue]=\"availability.value\"\n        >\n          {{ availability.label | translate }}\n        </option>\n      </select>\n    </div>\n  </div>\n</c8y-action-bar-item>\n\n<div\n  class=\"card content-fullpage d-grid grid__row--fit-auto\"\n  [ngClass]=\"{ 'grid__col--8-4-0': !selectedPlugin, 'grid__col--0-4-8': !!selectedPlugin }\"\n>\n  <div class=\"bg-level-1 grid__col--fullspan separator-bottom\">\n    <div class=\"card-block p-t-24 p-b-24 large-padding\">\n      <button\n        class=\"card__ribbon btn-clean\"\n        [attr.aria-label]=\"\n          (package.label || package.manifest.label | translatePackageLabel) +\n          ': ' +\n          (packageTypeLabels[packageType].tooltip | translate)\n        \"\n        tooltip=\"{{ packageTypeLabels[packageType].tooltip | translate }}\"\n        placement=\"bottom\"\n        type=\"button\"\n        *ngIf=\"packageType !== PACKAGE_TYPE.CUSTOM\"\n        [delay]=\"500\"\n      >\n        <span\n          [ngClass]=\"{\n            'bg-info': packageType === PACKAGE_TYPE.COMMUNITY,\n            'bg-primary': packageType === PACKAGE_TYPE.OFFICIAL,\n            'bg-warning': packageType === PACKAGE_TYPE.ARCHIVED\n          }\"\n        >\n          {{ package.label || package.manifest.label | translatePackageLabel }}\n        </span>\n      </button>\n      <div class=\"content-flex-70\">\n        <div class=\"text-center\">\n          <i\n            class=\"c8y-icon-duocolor icon-48\"\n            c8yIcon=\"big-parcel\"\n          ></i>\n          <button\n            class=\"btn-clean\"\n            [attr.aria-label]=\"\n              (appState?.label | translate) + ': ' + (appState?.tooltip | translate)\n            \"\n            [tooltip]=\"appState?.tooltip | translate\"\n            placement=\"top\"\n            type=\"button\"\n            [delay]=\"500\"\n          >\n            <span\n              class=\"label\"\n              [ngClass]=\"appState?.class\"\n            >\n              {{ appState?.label | translate }}\n            </span>\n          </button>\n          <button\n            class=\"btn-clean\"\n            [attr.aria-label]=\"\n              (packageContentState?.label | translate) +\n              ': ' +\n              (packageContentState?.tooltip | translate)\n            \"\n            [tooltip]=\"packageContentState?.tooltip | translate\"\n            placement=\"bottom\"\n            type=\"button\"\n            [delay]=\"500\"\n          >\n            <span\n              class=\"label\"\n              [ngClass]=\"packageContentState?.class\"\n            >\n              {{ packageContentState?.label | translate }}\n            </span>\n          </button>\n        </div>\n\n        <div class=\"flex-grow col-10\">\n          <div class=\"content-flex-80\">\n            <div class=\"col-8\">\n              <div class=\"card-title h4 m-b-8\">{{ name | humanizeAppName | async }}</div>\n              <p *ngIf=\"description\">{{ description }}</p>\n              <p\n                class=\"text-muted\"\n                *ngIf=\"!description\"\n              >\n                <em>{{ 'No description available.' | translate }}</em>\n              </p>\n            </div>\n            <div\n              class=\"col-3 text-right-md p-r-md-40\"\n              *ngIf=\"isPackageBlueprint\"\n            >\n              <button\n                class=\"btn btn-primary btn-sm\"\n                (click)=\"deploy()\"\n                data-cy=\"c8y-package-details--deploy-application-button\"\n              >\n                <i\n                  class=\"m-r-4\"\n                  c8yIcon=\"output\"\n                ></i>\n                {{ 'Deploy application' | translate }}\n              </button>\n            </div>\n            <div class=\"flex-grow\">\n              <c8y-properties-list\n                [data]=\"package.manifest\"\n                [properties]=\"packageProperties\"\n              ></c8y-properties-list>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n  <div class=\"inner-scroll\">\n    <div class=\"card-header separator sticky-top\">\n      <div class=\"card-title\">{{ 'Extension package overview' | translate }}</div>\n    </div>\n    <div class=\"card-block p-l-16 p-r-16\">\n      <div\n        class=\"alert alert-warning m-b-16\"\n        style=\"margin: auto\"\n        *ngIf=\"packageType === PACKAGE_TYPE.ARCHIVED\"\n        translate\n      >\n        The package was archived by the owner marking it as out of maintenance. It is not\n        recommended to install the package.\n      </div>\n      <c8y-ui-empty-state\n        [icon]=\"'user-manual'\"\n        [title]=\"'No README.md found' | translate\"\n        [subtitle]=\"\n          'To view the contents of &quot;README&quot;, add the file &quot;README.md&quot; to the package.'\n            | translate\n        \"\n        *ngIf=\"!markdown\"\n        [horizontal]=\"true\"\n      ></c8y-ui-empty-state>\n      <div\n        class=\"markdown-content\"\n        [innerHTML]=\"markdown | markdownToHtml: { baseUrl } | async\"\n      ></div>\n    </div>\n    <div class=\"separator-bottom visible-sm visible-xs\"></div>\n  </div>\n\n  <div\n    class=\"inner-scroll d-flex d-col bg-level-1 split-view__list\"\n    [ngClass]=\"{ 'border-right': !!selectedPlugin }\"\n  >\n    <div class=\"card-header separator sticky-top\">\n      <div class=\"card-title\">{{ 'Package plugins' | translate }}</div>\n    </div>\n    <div class=\"border-left flex-grow\">\n      <!-- empty state -->\n      <div\n        class=\"p-16\"\n        *ngIf=\"(exportedPlugins$ | async).length === 0\"\n      >\n        <c8y-ui-empty-state\n          [icon]=\"'plugin'\"\n          [title]=\"'No plugins to display.' | translate\"\n          [subtitle]=\"'This package doesn\\'t contain plugins.' | translate\"\n          [horizontal]=\"true\"\n        ></c8y-ui-empty-state>\n      </div>\n      <c8y-plugin-list\n        [plugins$]=\"exportedPlugins$\"\n        [selectable]=\"false\"\n        [installable]=\"true\"\n        [package]=\"package\"\n        [selectedPlugin]=\"selectedPlugin\"\n        (showOverview)=\"showPluginOverview($event)\"\n      ></c8y-plugin-list>\n    </div>\n  </div>\n\n  <div class=\"inner-scroll split-view__detail\"\n    [ngClass]=\"{ 'split-view__detail--selected': selectedPlugin }\">\n    <div\n      class=\"card-header separator sticky-top\"\n      *ngIf=\"selectedPlugin\"\n    >\n      <button\n        class=\"btn-clean\"\n        (click)=\"closeOverview()\"\n      >\n        <i c8yIcon=\"caret-back\"></i>\n        {{ 'Back to package overview ' | translate }}\n      </button>\n    </div>\n    <div\n      class=\"card-block p-l-16 p-r-16 overflow-visible\"\n      *ngIf=\"selectedPlugin\"\n    >\n      <div\n        class=\"markdown-content\"\n        *ngIf=\"pluginMarkdown\"\n        [innerHTML]=\"pluginMarkdown | markdownToHtml: { baseUrl: pluginBaseUrl } | async\"\n      ></div>\n      <c8y-ui-empty-state\n        [icon]=\"'user-manual'\"\n        [title]=\"'No README.md found for plugin' | translate\"\n        [subtitle]=\"\n          'To view the contents of &quot;README&quot;, add the file &quot;README.md&quot; to the plugin.'\n            | translate\n        \"\n        *ngIf=\"!pluginMarkdown\"\n        [horizontal]=\"true\"\n      ></c8y-ui-empty-state>\n    </div>\n  </div>\n</div>\n" }]
         }], ctorParameters: () => [{ type: i1$2.ActivatedRoute }, { type: i2.WizardModalService }, { type: i1.EcosystemService }, { type: i2.ContextRouteService }, { type: i2.PluginsService }, { type: i1.PackageAvailabilityService }, { type: i2.AppStateService }, { type: i2.GainsightService }] });
 
 class PackagesListComponent {
@@ -2660,11 +1617,28 @@ class PackagesListComponent {
         this.filtersComponent?.resetAllFilters();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PackagesListComponent, deps: [{ token: i1.EcosystemService }, { token: i2.WizardModalService }, { token: i2.Permissions }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PackagesListComponent, isStandalone: false, selector: "c8y-packages-list", viewQueries: [{ propertyName: "filtersComponent", first: true, predicate: ListFiltersComponent, descendants: true }], ngImport: i0, template: "<c8y-title>{{ 'Extensions' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'big-parcel'\"\n    [path]=\"'ecosystem/extension/extensions'\"\n    [label]=\"'Extensions' | translate\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item\n  [placement]=\"'right'\"\n  *ngIf=\"hasAdminPermissions\"\n>\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Add extension package' | translate }}\"\n    type=\"button\"\n    data-cy=\"packages-list--add-extension-package\"\n    (click)=\"addPackage()\"\n  >\n    <i c8yIcon=\"plus-circle\"></i>\n    {{ 'Add extension package' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    type=\"button\"\n    (click)=\"loadPackages()\"\n  >\n    <i\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': reloading }\"\n    ></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n  [placement]=\"'left'\"\n  itemClass=\"p-r-8 p-l-8\"\n>\n  <c8y-list-filters\n    *ngIf=\"packages$ | async\"\n    [packageTypes]=\"packageTypes\"\n    [packageAvailabilities]=\"packageAvailabilities\"\n    [packageContents]=\"packageContents\"\n    (filterPipeChange)=\"setFilterPipe($event)\"\n  >\n    <c8y-archived-filter></c8y-archived-filter>\n  </c8y-list-filters>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n  [placement]=\"'left'\"\n  itemClass=\"navbar-form hidden-xs\"\n>\n  <c8y-list-display-switch\n    (onListClassChange)=\"listClass = $event\"\n    [listLength]=\"(packages$ | async)?.length\"\n  ></c8y-list-display-switch>\n</c8y-action-bar-item>\n\n<c8y-help src=\"/docs/standard-tenant/ecosystem/#extensions\"></c8y-help>\n\n<div\n  class=\"card-group\"\n  [ngClass]=\"listClass\"\n>\n  <div\n    class=\"page-sticky-header hidden-xs d-flex m-b-8\"\n    *ngIf=\"(filteredPackages$ | async)?.length > 0\"\n  >\n    <div class=\"card-block card-column-40\">\n      <div class=\"card-appicon p-l-32 p-r-16 m-r-0 m-l-4\"></div>\n      {{ 'Package' | translate }}\n    </div>\n    <div class=\"card-block p-0 card-column-80 m-r-40\">\n      <div class=\"card-block card-column-80\">{{ 'Description' | translate }}</div>\n      <div class=\"card-block card-column-20\">{{ 'Type' | translate }}</div>\n      <div class=\"card-block card-column-20\"></div>\n    </div>\n  </div>\n  <div\n    class=\"col-xs-12 col-sm-4 col-md-3\"\n    *ngFor=\"let app of filteredPackages$ | async\"\n  >\n    <c8y-application-card\n      class=\"d-contents\"\n      (onAppDeleted)=\"loadPackages()\"\n      (onAppCloned)=\"loadPackages()\"\n      [app]=\"app\"\n    ></c8y-application-card>\n  </div>\n</div>\n\n<c8y-ui-empty-state\n  [icon]=\"'big-parcel'\"\n  [title]=\"'No extensions to display.' | translate\"\n  [subtitle]=\"hasAdminPermissions ? (emptyStateSubtitle | translate) : ''\"\n  *ngIf=\"(packages$ | async)?.length === 0\"\n>\n  <div *ngIf=\"hasAdminPermissions\">\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Add extension package' | translate }}\"\n      type=\"button\"\n      (click)=\"addPackage()\"\n    >\n      {{ 'Add extension package' | translate }}\n    </button>\n  </div>\n</c8y-ui-empty-state>\n\n<c8y-ui-empty-state\n  [icon]=\"'search'\"\n  [title]=\"'No matching extensions.' | translate\"\n  [subtitle]=\"'Refine your search terms and/or the filters' | translate\"\n  *ngIf=\"(packages$ | async)?.length > 0 && (filteredPackages$ | async)?.length === 0\"\n>\n  <button\n    class=\"btn btn-primary\"\n    title=\"{{ 'Reset filters' | translate }}\"\n    type=\"button\"\n    (click)=\"resetFilters()\"\n  >\n    {{ 'Reset filters' | translate }}\n  </button>\n</c8y-ui-empty-state>\n", dependencies: [{ kind: "component", type: i2.ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "component", type: i2.BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: i2.BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "component", type: i2.EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "component", type: i2.HelpComponent, selector: "c8y-help", inputs: ["src", "isCollapsed", "priority", "icon"] }, { kind: "component", type: i2.ListDisplaySwitchComponent, selector: "c8y-list-display-switch", inputs: ["listKey", "listLength", "filterPipe"], outputs: ["onListClassChange"] }, { kind: "component", type: i1.ApplicationCardComponent, selector: "c8y-application-card", inputs: ["app", "canEdit"], outputs: ["onAppDeleted", "onAppCloned"] }, { kind: "component", type: i1.ListFiltersComponent, selector: "c8y-list-filters", inputs: ["packageTypes", "packageAvailabilities", "packageContents"], outputs: ["filterPipeChange"] }, { kind: "component", type: i1.ArchivedFilterComponent, selector: "c8y-archived-filter" }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PackagesListComponent, isStandalone: true, selector: "c8y-packages-list", viewQueries: [{ propertyName: "filtersComponent", first: true, predicate: ListFiltersComponent, descendants: true }], ngImport: i0, template: "<c8y-title>{{ 'Extensions' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'big-parcel'\"\n    [path]=\"'ecosystem/extension/extensions'\"\n    [label]=\"'Extensions' | translate\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item\n  [placement]=\"'right'\"\n  *ngIf=\"hasAdminPermissions\"\n>\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Add extension package' | translate }}\"\n    type=\"button\"\n    data-cy=\"packages-list--add-extension-package\"\n    (click)=\"addPackage()\"\n  >\n    <i c8yIcon=\"plus-circle\"></i>\n    {{ 'Add extension package' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    type=\"button\"\n    (click)=\"loadPackages()\"\n  >\n    <i\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': reloading }\"\n    ></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n  [placement]=\"'left'\"\n  itemClass=\"p-r-8 p-l-8\"\n>\n  <c8y-list-filters\n    *ngIf=\"packages$ | async\"\n    [packageTypes]=\"packageTypes\"\n    [packageAvailabilities]=\"packageAvailabilities\"\n    [packageContents]=\"packageContents\"\n    (filterPipeChange)=\"setFilterPipe($event)\"\n  >\n    <c8y-archived-filter></c8y-archived-filter>\n  </c8y-list-filters>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n  [placement]=\"'left'\"\n  itemClass=\"navbar-form hidden-xs\"\n>\n  <c8y-list-display-switch\n    (onListClassChange)=\"listClass = $event\"\n    [listLength]=\"(packages$ | async)?.length\"\n  ></c8y-list-display-switch>\n</c8y-action-bar-item>\n\n<c8y-help src=\"/docs/standard-tenant/ecosystem/#extensions\"></c8y-help>\n\n<div\n  class=\"card-group\"\n  [ngClass]=\"listClass\"\n>\n  <div\n    class=\"page-sticky-header hidden-xs d-flex m-b-8\"\n    *ngIf=\"(filteredPackages$ | async)?.length > 0\"\n  >\n    <div class=\"card-block card-column-40\">\n      <div class=\"card-appicon p-l-32 p-r-16 m-r-0 m-l-4\"></div>\n      {{ 'Package' | translate }}\n    </div>\n    <div class=\"card-block p-0 card-column-80 m-r-40\">\n      <div class=\"card-block card-column-80\">{{ 'Description' | translate }}</div>\n      <div class=\"card-block card-column-20\">{{ 'Type' | translate }}</div>\n      <div class=\"card-block card-column-20\"></div>\n    </div>\n  </div>\n  <div\n    class=\"col-xs-12 col-sm-4 col-md-3\"\n    *ngFor=\"let app of filteredPackages$ | async\"\n  >\n    <c8y-application-card\n      class=\"d-contents\"\n      (onAppDeleted)=\"loadPackages()\"\n      (onAppCloned)=\"loadPackages()\"\n      [app]=\"app\"\n    ></c8y-application-card>\n  </div>\n</div>\n\n<c8y-ui-empty-state\n  [icon]=\"'big-parcel'\"\n  [title]=\"'No extensions to display.' | translate\"\n  [subtitle]=\"hasAdminPermissions ? (emptyStateSubtitle | translate) : ''\"\n  *ngIf=\"(packages$ | async)?.length === 0\"\n>\n  <div *ngIf=\"hasAdminPermissions\">\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Add extension package' | translate }}\"\n      type=\"button\"\n      (click)=\"addPackage()\"\n    >\n      {{ 'Add extension package' | translate }}\n    </button>\n  </div>\n</c8y-ui-empty-state>\n\n<c8y-ui-empty-state\n  [icon]=\"'search'\"\n  [title]=\"'No matching extensions.' | translate\"\n  [subtitle]=\"'Refine your search terms and/or the filters' | translate\"\n  *ngIf=\"(packages$ | async)?.length > 0 && (filteredPackages$ | async)?.length === 0\"\n>\n  <button\n    class=\"btn btn-primary\"\n    title=\"{{ 'Reset filters' | translate }}\"\n    type=\"button\"\n    (click)=\"resetFilters()\"\n  >\n    {{ 'Reset filters' | translate }}\n  </button>\n</c8y-ui-empty-state>\n", dependencies: [{ kind: "component", type: TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "component", type: BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ListFiltersComponent, selector: "c8y-list-filters", inputs: ["packageTypes", "packageAvailabilities", "packageContents"], outputs: ["filterPipeChange"] }, { kind: "component", type: ArchivedFilterComponent, selector: "c8y-archived-filter" }, { kind: "component", type: ListDisplaySwitchComponent, selector: "c8y-list-display-switch", inputs: ["listKey", "listLength", "filterPipe"], outputs: ["onListClassChange"] }, { kind: "component", type: HelpComponent, selector: "c8y-help", inputs: ["src", "isCollapsed", "priority", "icon"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ApplicationCardComponent, selector: "c8y-application-card", inputs: ["app", "canEdit"], outputs: ["onAppDeleted", "onAppCloned"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PackagesListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-packages-list', standalone: false, template: "<c8y-title>{{ 'Extensions' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'big-parcel'\"\n    [path]=\"'ecosystem/extension/extensions'\"\n    [label]=\"'Extensions' | translate\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item\n  [placement]=\"'right'\"\n  *ngIf=\"hasAdminPermissions\"\n>\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Add extension package' | translate }}\"\n    type=\"button\"\n    data-cy=\"packages-list--add-extension-package\"\n    (click)=\"addPackage()\"\n  >\n    <i c8yIcon=\"plus-circle\"></i>\n    {{ 'Add extension package' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    type=\"button\"\n    (click)=\"loadPackages()\"\n  >\n    <i\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': reloading }\"\n    ></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n  [placement]=\"'left'\"\n  itemClass=\"p-r-8 p-l-8\"\n>\n  <c8y-list-filters\n    *ngIf=\"packages$ | async\"\n    [packageTypes]=\"packageTypes\"\n    [packageAvailabilities]=\"packageAvailabilities\"\n    [packageContents]=\"packageContents\"\n    (filterPipeChange)=\"setFilterPipe($event)\"\n  >\n    <c8y-archived-filter></c8y-archived-filter>\n  </c8y-list-filters>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n  [placement]=\"'left'\"\n  itemClass=\"navbar-form hidden-xs\"\n>\n  <c8y-list-display-switch\n    (onListClassChange)=\"listClass = $event\"\n    [listLength]=\"(packages$ | async)?.length\"\n  ></c8y-list-display-switch>\n</c8y-action-bar-item>\n\n<c8y-help src=\"/docs/standard-tenant/ecosystem/#extensions\"></c8y-help>\n\n<div\n  class=\"card-group\"\n  [ngClass]=\"listClass\"\n>\n  <div\n    class=\"page-sticky-header hidden-xs d-flex m-b-8\"\n    *ngIf=\"(filteredPackages$ | async)?.length > 0\"\n  >\n    <div class=\"card-block card-column-40\">\n      <div class=\"card-appicon p-l-32 p-r-16 m-r-0 m-l-4\"></div>\n      {{ 'Package' | translate }}\n    </div>\n    <div class=\"card-block p-0 card-column-80 m-r-40\">\n      <div class=\"card-block card-column-80\">{{ 'Description' | translate }}</div>\n      <div class=\"card-block card-column-20\">{{ 'Type' | translate }}</div>\n      <div class=\"card-block card-column-20\"></div>\n    </div>\n  </div>\n  <div\n    class=\"col-xs-12 col-sm-4 col-md-3\"\n    *ngFor=\"let app of filteredPackages$ | async\"\n  >\n    <c8y-application-card\n      class=\"d-contents\"\n      (onAppDeleted)=\"loadPackages()\"\n      (onAppCloned)=\"loadPackages()\"\n      [app]=\"app\"\n    ></c8y-application-card>\n  </div>\n</div>\n\n<c8y-ui-empty-state\n  [icon]=\"'big-parcel'\"\n  [title]=\"'No extensions to display.' | translate\"\n  [subtitle]=\"hasAdminPermissions ? (emptyStateSubtitle | translate) : ''\"\n  *ngIf=\"(packages$ | async)?.length === 0\"\n>\n  <div *ngIf=\"hasAdminPermissions\">\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Add extension package' | translate }}\"\n      type=\"button\"\n      (click)=\"addPackage()\"\n    >\n      {{ 'Add extension package' | translate }}\n    </button>\n  </div>\n</c8y-ui-empty-state>\n\n<c8y-ui-empty-state\n  [icon]=\"'search'\"\n  [title]=\"'No matching extensions.' | translate\"\n  [subtitle]=\"'Refine your search terms and/or the filters' | translate\"\n  *ngIf=\"(packages$ | async)?.length > 0 && (filteredPackages$ | async)?.length === 0\"\n>\n  <button\n    class=\"btn btn-primary\"\n    title=\"{{ 'Reset filters' | translate }}\"\n    type=\"button\"\n    (click)=\"resetFilters()\"\n  >\n    {{ 'Reset filters' | translate }}\n  </button>\n</c8y-ui-empty-state>\n" }]
+            args: [{ selector: 'c8y-packages-list', imports: [
+                        TitleComponent,
+                        BreadcrumbComponent,
+                        BreadcrumbItemComponent,
+                        NgIf,
+                        ActionBarItemComponent,
+                        IconDirective,
+                        NgClass,
+                        ListFiltersComponent,
+                        ArchivedFilterComponent,
+                        ListDisplaySwitchComponent,
+                        HelpComponent,
+                        NgFor,
+                        ApplicationCardComponent,
+                        EmptyStateComponent,
+                        C8yTranslatePipe,
+                        AsyncPipe
+                    ], template: "<c8y-title>{{ 'Extensions' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'big-parcel'\"\n    [path]=\"'ecosystem/extension/extensions'\"\n    [label]=\"'Extensions' | translate\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item\n  [placement]=\"'right'\"\n  *ngIf=\"hasAdminPermissions\"\n>\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Add extension package' | translate }}\"\n    type=\"button\"\n    data-cy=\"packages-list--add-extension-package\"\n    (click)=\"addPackage()\"\n  >\n    <i c8yIcon=\"plus-circle\"></i>\n    {{ 'Add extension package' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    type=\"button\"\n    (click)=\"loadPackages()\"\n  >\n    <i\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': reloading }\"\n    ></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n  [placement]=\"'left'\"\n  itemClass=\"p-r-8 p-l-8\"\n>\n  <c8y-list-filters\n    *ngIf=\"packages$ | async\"\n    [packageTypes]=\"packageTypes\"\n    [packageAvailabilities]=\"packageAvailabilities\"\n    [packageContents]=\"packageContents\"\n    (filterPipeChange)=\"setFilterPipe($event)\"\n  >\n    <c8y-archived-filter></c8y-archived-filter>\n  </c8y-list-filters>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item\n  [placement]=\"'left'\"\n  itemClass=\"navbar-form hidden-xs\"\n>\n  <c8y-list-display-switch\n    (onListClassChange)=\"listClass = $event\"\n    [listLength]=\"(packages$ | async)?.length\"\n  ></c8y-list-display-switch>\n</c8y-action-bar-item>\n\n<c8y-help src=\"/docs/standard-tenant/ecosystem/#extensions\"></c8y-help>\n\n<div\n  class=\"card-group\"\n  [ngClass]=\"listClass\"\n>\n  <div\n    class=\"page-sticky-header hidden-xs d-flex m-b-8\"\n    *ngIf=\"(filteredPackages$ | async)?.length > 0\"\n  >\n    <div class=\"card-block card-column-40\">\n      <div class=\"card-appicon p-l-32 p-r-16 m-r-0 m-l-4\"></div>\n      {{ 'Package' | translate }}\n    </div>\n    <div class=\"card-block p-0 card-column-80 m-r-40\">\n      <div class=\"card-block card-column-80\">{{ 'Description' | translate }}</div>\n      <div class=\"card-block card-column-20\">{{ 'Type' | translate }}</div>\n      <div class=\"card-block card-column-20\"></div>\n    </div>\n  </div>\n  <div\n    class=\"col-xs-12 col-sm-4 col-md-3\"\n    *ngFor=\"let app of filteredPackages$ | async\"\n  >\n    <c8y-application-card\n      class=\"d-contents\"\n      (onAppDeleted)=\"loadPackages()\"\n      (onAppCloned)=\"loadPackages()\"\n      [app]=\"app\"\n    ></c8y-application-card>\n  </div>\n</div>\n\n<c8y-ui-empty-state\n  [icon]=\"'big-parcel'\"\n  [title]=\"'No extensions to display.' | translate\"\n  [subtitle]=\"hasAdminPermissions ? (emptyStateSubtitle | translate) : ''\"\n  *ngIf=\"(packages$ | async)?.length === 0\"\n>\n  <div *ngIf=\"hasAdminPermissions\">\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Add extension package' | translate }}\"\n      type=\"button\"\n      (click)=\"addPackage()\"\n    >\n      {{ 'Add extension package' | translate }}\n    </button>\n  </div>\n</c8y-ui-empty-state>\n\n<c8y-ui-empty-state\n  [icon]=\"'search'\"\n  [title]=\"'No matching extensions.' | translate\"\n  [subtitle]=\"'Refine your search terms and/or the filters' | translate\"\n  *ngIf=\"(packages$ | async)?.length > 0 && (filteredPackages$ | async)?.length === 0\"\n>\n  <button\n    class=\"btn btn-primary\"\n    title=\"{{ 'Reset filters' | translate }}\"\n    type=\"button\"\n    (click)=\"resetFilters()\"\n  >\n    {{ 'Reset filters' | translate }}\n  </button>\n</c8y-ui-empty-state>\n" }]
         }], ctorParameters: () => [{ type: i1.EcosystemService }, { type: i2.WizardModalService }, { type: i2.Permissions }], propDecorators: { filtersComponent: [{
                 type: ViewChild,
                 args: [ListFiltersComponent]
@@ -2684,11 +1658,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
 
 class PackageVersionsAppsComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PackageVersionsAppsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PackageVersionsAppsComponent, isStandalone: false, selector: "c8y-contents-apps", inputs: { selectedVersionManifest: "selectedVersionManifest" }, ngImport: i0, template: "<p class=\"legend form-block\">\n  {{ 'Application' | translate }}\n</p>\n\n<div  *ngIf=\"selectedVersionManifest?.name; else emptyApp\">\n  <c8y-li>\n    <c8y-li-icon icon=\"big-parcel\"></c8y-li-icon>\n    <h5 class=\"text-medium text-16 p-b-8\">\n      {{ selectedVersionManifest?.name | humanizeAppName | async }}\n      <small class=\"m-l-8\" *ngIf=\"selectedVersionManifest?.requiredPlatformVersion\">\n        <em>{{ selectedVersionManifest?.requiredPlatformVersion }}</em>\n      </small>\n    </h5>\n    <p *ngIf=\"selectedVersionManifest?.description; else notAvailable\">\n      {{ selectedVersionManifest?.description }}\n    </p>\n  </c8y-li>\n</div>\n\n<ng-template #notAvailable>\n  <p class=\"text-muted\">\n    <em>{{ 'No description available.' | translate }}</em>\n  </p>\n</ng-template>\n\n<ng-template #emptyApp>\n  <c8y-ui-empty-state\n  [icon]=\"'big-parcel'\"\n  [horizontal]=\"true\"\n  [title]=\"'No application.' | translate\"\n  [subtitle]=\"'This package doesn\\'t contain an application.' | translate\"\n  ></c8y-ui-empty-state>\n</ng-template>", dependencies: [{ kind: "component", type: i2.EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: i2.ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.HumanizeAppNamePipe, name: "humanizeAppName" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PackageVersionsAppsComponent, isStandalone: true, selector: "c8y-contents-apps", inputs: { selectedVersionManifest: "selectedVersionManifest" }, ngImport: i0, template: "<p class=\"legend form-block\">\n  {{ 'Application' | translate }}\n</p>\n\n<div  *ngIf=\"selectedVersionManifest?.name; else emptyApp\">\n  <c8y-li>\n    <c8y-li-icon icon=\"big-parcel\"></c8y-li-icon>\n    <h5 class=\"text-medium text-16 p-b-8\">\n      {{ selectedVersionManifest?.name | humanizeAppName | async }}\n      <small class=\"m-l-8\" *ngIf=\"selectedVersionManifest?.requiredPlatformVersion\">\n        <em>{{ selectedVersionManifest?.requiredPlatformVersion }}</em>\n      </small>\n    </h5>\n    <p *ngIf=\"selectedVersionManifest?.description; else notAvailable\">\n      {{ selectedVersionManifest?.description }}\n    </p>\n  </c8y-li>\n</div>\n\n<ng-template #notAvailable>\n  <p class=\"text-muted\">\n    <em>{{ 'No description available.' | translate }}</em>\n  </p>\n</ng-template>\n\n<ng-template #emptyApp>\n  <c8y-ui-empty-state\n  [icon]=\"'big-parcel'\"\n  [horizontal]=\"true\"\n  [title]=\"'No application.' | translate\"\n  [subtitle]=\"'This package doesn\\'t contain an application.' | translate\"\n  ></c8y-ui-empty-state>\n</ng-template>", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: HumanizeAppNamePipe, name: "humanizeAppName" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PackageVersionsAppsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-contents-apps', standalone: false, template: "<p class=\"legend form-block\">\n  {{ 'Application' | translate }}\n</p>\n\n<div  *ngIf=\"selectedVersionManifest?.name; else emptyApp\">\n  <c8y-li>\n    <c8y-li-icon icon=\"big-parcel\"></c8y-li-icon>\n    <h5 class=\"text-medium text-16 p-b-8\">\n      {{ selectedVersionManifest?.name | humanizeAppName | async }}\n      <small class=\"m-l-8\" *ngIf=\"selectedVersionManifest?.requiredPlatformVersion\">\n        <em>{{ selectedVersionManifest?.requiredPlatformVersion }}</em>\n      </small>\n    </h5>\n    <p *ngIf=\"selectedVersionManifest?.description; else notAvailable\">\n      {{ selectedVersionManifest?.description }}\n    </p>\n  </c8y-li>\n</div>\n\n<ng-template #notAvailable>\n  <p class=\"text-muted\">\n    <em>{{ 'No description available.' | translate }}</em>\n  </p>\n</ng-template>\n\n<ng-template #emptyApp>\n  <c8y-ui-empty-state\n  [icon]=\"'big-parcel'\"\n  [horizontal]=\"true\"\n  [title]=\"'No application.' | translate\"\n  [subtitle]=\"'This package doesn\\'t contain an application.' | translate\"\n  ></c8y-ui-empty-state>\n</ng-template>" }]
+            args: [{ selector: 'c8y-contents-apps', imports: [
+                        NgIf,
+                        ListItemComponent,
+                        ListItemIconComponent,
+                        EmptyStateComponent,
+                        C8yTranslatePipe,
+                        AsyncPipe,
+                        HumanizeAppNamePipe
+                    ], template: "<p class=\"legend form-block\">\n  {{ 'Application' | translate }}\n</p>\n\n<div  *ngIf=\"selectedVersionManifest?.name; else emptyApp\">\n  <c8y-li>\n    <c8y-li-icon icon=\"big-parcel\"></c8y-li-icon>\n    <h5 class=\"text-medium text-16 p-b-8\">\n      {{ selectedVersionManifest?.name | humanizeAppName | async }}\n      <small class=\"m-l-8\" *ngIf=\"selectedVersionManifest?.requiredPlatformVersion\">\n        <em>{{ selectedVersionManifest?.requiredPlatformVersion }}</em>\n      </small>\n    </h5>\n    <p *ngIf=\"selectedVersionManifest?.description; else notAvailable\">\n      {{ selectedVersionManifest?.description }}\n    </p>\n  </c8y-li>\n</div>\n\n<ng-template #notAvailable>\n  <p class=\"text-muted\">\n    <em>{{ 'No description available.' | translate }}</em>\n  </p>\n</ng-template>\n\n<ng-template #emptyApp>\n  <c8y-ui-empty-state\n  [icon]=\"'big-parcel'\"\n  [horizontal]=\"true\"\n  [title]=\"'No application.' | translate\"\n  [subtitle]=\"'This package doesn\\'t contain an application.' | translate\"\n  ></c8y-ui-empty-state>\n</ng-template>" }]
         }], propDecorators: { selectedVersionManifest: [{
                 type: Input,
                 args: ['selectedVersionManifest']
@@ -2722,11 +1704,11 @@ class PackageVersionsPluginsComponent {
         }));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PackageVersionsPluginsComponent, deps: [{ token: i1$2.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PackageVersionsPluginsComponent, isStandalone: false, selector: "c8y-contents-plugins", inputs: { selectedVersionManifest: "selectedVersionManifest", selectedPlugin: "selectedPlugin" }, outputs: { showOverview: "showOverview" }, usesOnChanges: true, ngImport: i0, template: "<p class=\"legend form-block\">\n  {{ 'Plugins' | translate }}\n</p>\n<!-- empty state -->\n<c8y-ui-empty-state\n  [icon]=\"'plugin'\"\n  [title]=\"'No plugins to display.' | translate\"\n  [subtitle]=\"'This package doesn\\'t contain plugins.' | translate\"\n  *ngIf=\"(exportedPlugins$ | async).length === 0\"\n  [horizontal]=\"true\"\n></c8y-ui-empty-state>\n\n<c8y-plugin-list\n  [plugins$]=\"exportedPlugins$\"\n  [selectable]=\"false\"\n  [selectedPlugin]=\"selectedPlugin\"\n  (showOverview)=\"showPluginOverview($event)\"\n></c8y-plugin-list>\n", dependencies: [{ kind: "component", type: i2.EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PluginListComponent, selector: "c8y-plugin-list", inputs: ["plugins$", "emptyListText", "selectable", "hideSource", "installable", "package", "selectedPlugin"], outputs: ["selectedItems", "showOverview"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PackageVersionsPluginsComponent, isStandalone: true, selector: "c8y-contents-plugins", inputs: { selectedVersionManifest: "selectedVersionManifest", selectedPlugin: "selectedPlugin" }, outputs: { showOverview: "showOverview" }, usesOnChanges: true, ngImport: i0, template: "<p class=\"legend form-block\">\n  {{ 'Plugins' | translate }}\n</p>\n<!-- empty state -->\n<c8y-ui-empty-state\n  [icon]=\"'plugin'\"\n  [title]=\"'No plugins to display.' | translate\"\n  [subtitle]=\"'This package doesn\\'t contain plugins.' | translate\"\n  *ngIf=\"(exportedPlugins$ | async).length === 0\"\n  [horizontal]=\"true\"\n></c8y-ui-empty-state>\n\n<c8y-plugin-list\n  [plugins$]=\"exportedPlugins$\"\n  [selectable]=\"false\"\n  [selectedPlugin]=\"selectedPlugin\"\n  (showOverview)=\"showPluginOverview($event)\"\n></c8y-plugin-list>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "component", type: PluginListComponent, selector: "c8y-plugin-list", inputs: ["plugins$", "emptyListText", "selectable", "hideSource", "installable", "package", "selectedPlugin"], outputs: ["selectedItems", "showOverview"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PackageVersionsPluginsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-contents-plugins', standalone: false, template: "<p class=\"legend form-block\">\n  {{ 'Plugins' | translate }}\n</p>\n<!-- empty state -->\n<c8y-ui-empty-state\n  [icon]=\"'plugin'\"\n  [title]=\"'No plugins to display.' | translate\"\n  [subtitle]=\"'This package doesn\\'t contain plugins.' | translate\"\n  *ngIf=\"(exportedPlugins$ | async).length === 0\"\n  [horizontal]=\"true\"\n></c8y-ui-empty-state>\n\n<c8y-plugin-list\n  [plugins$]=\"exportedPlugins$\"\n  [selectable]=\"false\"\n  [selectedPlugin]=\"selectedPlugin\"\n  (showOverview)=\"showPluginOverview($event)\"\n></c8y-plugin-list>\n" }]
+            args: [{ selector: 'c8y-contents-plugins', imports: [NgIf, EmptyStateComponent, PluginListComponent, C8yTranslatePipe, AsyncPipe], template: "<p class=\"legend form-block\">\n  {{ 'Plugins' | translate }}\n</p>\n<!-- empty state -->\n<c8y-ui-empty-state\n  [icon]=\"'plugin'\"\n  [title]=\"'No plugins to display.' | translate\"\n  [subtitle]=\"'This package doesn\\'t contain plugins.' | translate\"\n  *ngIf=\"(exportedPlugins$ | async).length === 0\"\n  [horizontal]=\"true\"\n></c8y-ui-empty-state>\n\n<c8y-plugin-list\n  [plugins$]=\"exportedPlugins$\"\n  [selectable]=\"false\"\n  [selectedPlugin]=\"selectedPlugin\"\n  (showOverview)=\"showPluginOverview($event)\"\n></c8y-plugin-list>\n" }]
         }], ctorParameters: () => [{ type: i1$2.ActivatedRoute }], propDecorators: { selectedVersionManifest: [{
                 type: Input,
                 args: ['selectedVersionManifest']
@@ -2782,11 +1764,20 @@ class PackageContentsComponent {
         return this.package.applicationVersions[selectedVersionIndex - 1].version;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PackageContentsComponent, deps: [{ token: i1$2.ActivatedRoute }, { token: i4.ApplicationService }, { token: i2.AlertService }, { token: i2.ContextRouteService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PackageContentsComponent, isStandalone: false, selector: "c8y-package-contents", inputs: { selectedVersion: "selectedVersion", selectedPlugin: "selectedPlugin" }, outputs: { showOverview: "showOverview" }, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"!selectedVersionManifest && !isLoading\">\n  <div class=\"p-16\">\n    <c8y-ui-empty-state\n      [icon]=\"'big-parcel'\"\n      [title]=\"'No package selected' | translate\"\n      [subtitle]=\"'Select a package from the list to display the package contents.' | translate\"\n      [horizontal]=\"true\"\n    ></c8y-ui-empty-state>\n  </div>\n</ng-container>\n\n<ng-container *ngIf=\"isLoading\">\n  <c8y-loading></c8y-loading>\n</ng-container>\n\n<ng-container *ngIf=\"selectedVersionManifest && !isLoading\">\n  <!-- DETAILS -->\n  <div class=\"card-block\">\n    <c8y-properties-list\n      [data]=\"selectedVersionManifest\"\n      [emptyLabel]=\"'--'\"\n      [properties]=\"packageVersionProperties\"\n    ></c8y-properties-list>\n\n    <!-- APPS -->\n    <c8y-contents-apps\n      class=\"p-t-16 d-block\"\n      [selectedVersionManifest]=\"selectedVersionManifest\"\n    ></c8y-contents-apps>\n\n    <!-- PLUGINS -->\n    <c8y-contents-plugins\n      class=\"p-t-16 d-block\"\n      [selectedVersionManifest]=\"selectedVersionManifest\"\n      [selectedPlugin]=\"selectedPlugin\"\n      (showOverview)=\"showPluginOverview($event)\"\n    ></c8y-contents-plugins>\n\n    <!-- CHANGELOG -->\n    <p class=\"legend form-block\">\n      {{ 'Change log' | translate }}\n    </p>\n\n    <c8y-contents-changelog\n      [package]=\"package\"\n      [selectedVersion]=\"selectedVersion\"\n      [previousVersion]=\"previousVersion\"\n    ></c8y-contents-changelog>\n  </div>\n</ng-container>\n", dependencies: [{ kind: "component", type: i2.EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "component", type: i2.PropertiesListComponent, selector: "c8y-properties-list", inputs: ["properties", "title", "icon", "data", "groups", "noParse", "emptyLabel"] }, { kind: "component", type: i1.PackageChangelogComponent, selector: "c8y-contents-changelog", inputs: ["package", "selectedVersion", "previousVersion"] }, { kind: "component", type: PackageVersionsPluginsComponent, selector: "c8y-contents-plugins", inputs: ["selectedVersionManifest", "selectedPlugin"], outputs: ["showOverview"] }, { kind: "component", type: PackageVersionsAppsComponent, selector: "c8y-contents-apps", inputs: ["selectedVersionManifest"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PackageContentsComponent, isStandalone: true, selector: "c8y-package-contents", inputs: { selectedVersion: "selectedVersion", selectedPlugin: "selectedPlugin" }, outputs: { showOverview: "showOverview" }, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"!selectedVersionManifest && !isLoading\">\n  <div class=\"p-16\">\n    <c8y-ui-empty-state\n      [icon]=\"'big-parcel'\"\n      [title]=\"'No package selected' | translate\"\n      [subtitle]=\"'Select a package from the list to display the package contents.' | translate\"\n      [horizontal]=\"true\"\n    ></c8y-ui-empty-state>\n  </div>\n</ng-container>\n\n<ng-container *ngIf=\"isLoading\">\n  <c8y-loading></c8y-loading>\n</ng-container>\n\n<ng-container *ngIf=\"selectedVersionManifest && !isLoading\">\n  <!-- DETAILS -->\n  <div class=\"card-block\">\n    <c8y-properties-list\n      [data]=\"selectedVersionManifest\"\n      [emptyLabel]=\"'--'\"\n      [properties]=\"packageVersionProperties\"\n    ></c8y-properties-list>\n\n    <!-- APPS -->\n    <c8y-contents-apps\n      class=\"p-t-16 d-block\"\n      [selectedVersionManifest]=\"selectedVersionManifest\"\n    ></c8y-contents-apps>\n\n    <!-- PLUGINS -->\n    <c8y-contents-plugins\n      class=\"p-t-16 d-block\"\n      [selectedVersionManifest]=\"selectedVersionManifest\"\n      [selectedPlugin]=\"selectedPlugin\"\n      (showOverview)=\"showPluginOverview($event)\"\n    ></c8y-contents-plugins>\n\n    <!-- CHANGELOG -->\n    <p class=\"legend form-block\">\n      {{ 'Change log' | translate }}\n    </p>\n\n    <c8y-contents-changelog\n      [package]=\"package\"\n      [selectedVersion]=\"selectedVersion\"\n      [previousVersion]=\"previousVersion\"\n    ></c8y-contents-changelog>\n  </div>\n</ng-container>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "component", type: PropertiesListComponent, selector: "c8y-properties-list", inputs: ["properties", "title", "icon", "data", "groups", "noParse", "emptyLabel"] }, { kind: "component", type: PackageVersionsAppsComponent, selector: "c8y-contents-apps", inputs: ["selectedVersionManifest"] }, { kind: "component", type: PackageVersionsPluginsComponent, selector: "c8y-contents-plugins", inputs: ["selectedVersionManifest", "selectedPlugin"], outputs: ["showOverview"] }, { kind: "component", type: PackageChangelogComponent, selector: "c8y-contents-changelog", inputs: ["package", "selectedVersion", "previousVersion"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PackageContentsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-package-contents', standalone: false, template: "<ng-container *ngIf=\"!selectedVersionManifest && !isLoading\">\n  <div class=\"p-16\">\n    <c8y-ui-empty-state\n      [icon]=\"'big-parcel'\"\n      [title]=\"'No package selected' | translate\"\n      [subtitle]=\"'Select a package from the list to display the package contents.' | translate\"\n      [horizontal]=\"true\"\n    ></c8y-ui-empty-state>\n  </div>\n</ng-container>\n\n<ng-container *ngIf=\"isLoading\">\n  <c8y-loading></c8y-loading>\n</ng-container>\n\n<ng-container *ngIf=\"selectedVersionManifest && !isLoading\">\n  <!-- DETAILS -->\n  <div class=\"card-block\">\n    <c8y-properties-list\n      [data]=\"selectedVersionManifest\"\n      [emptyLabel]=\"'--'\"\n      [properties]=\"packageVersionProperties\"\n    ></c8y-properties-list>\n\n    <!-- APPS -->\n    <c8y-contents-apps\n      class=\"p-t-16 d-block\"\n      [selectedVersionManifest]=\"selectedVersionManifest\"\n    ></c8y-contents-apps>\n\n    <!-- PLUGINS -->\n    <c8y-contents-plugins\n      class=\"p-t-16 d-block\"\n      [selectedVersionManifest]=\"selectedVersionManifest\"\n      [selectedPlugin]=\"selectedPlugin\"\n      (showOverview)=\"showPluginOverview($event)\"\n    ></c8y-contents-plugins>\n\n    <!-- CHANGELOG -->\n    <p class=\"legend form-block\">\n      {{ 'Change log' | translate }}\n    </p>\n\n    <c8y-contents-changelog\n      [package]=\"package\"\n      [selectedVersion]=\"selectedVersion\"\n      [previousVersion]=\"previousVersion\"\n    ></c8y-contents-changelog>\n  </div>\n</ng-container>\n" }]
+            args: [{ selector: 'c8y-package-contents', imports: [
+                        NgIf,
+                        EmptyStateComponent,
+                        LoadingComponent,
+                        PropertiesListComponent,
+                        PackageVersionsAppsComponent,
+                        PackageVersionsPluginsComponent,
+                        PackageChangelogComponent,
+                        C8yTranslatePipe
+                    ], template: "<ng-container *ngIf=\"!selectedVersionManifest && !isLoading\">\n  <div class=\"p-16\">\n    <c8y-ui-empty-state\n      [icon]=\"'big-parcel'\"\n      [title]=\"'No package selected' | translate\"\n      [subtitle]=\"'Select a package from the list to display the package contents.' | translate\"\n      [horizontal]=\"true\"\n    ></c8y-ui-empty-state>\n  </div>\n</ng-container>\n\n<ng-container *ngIf=\"isLoading\">\n  <c8y-loading></c8y-loading>\n</ng-container>\n\n<ng-container *ngIf=\"selectedVersionManifest && !isLoading\">\n  <!-- DETAILS -->\n  <div class=\"card-block\">\n    <c8y-properties-list\n      [data]=\"selectedVersionManifest\"\n      [emptyLabel]=\"'--'\"\n      [properties]=\"packageVersionProperties\"\n    ></c8y-properties-list>\n\n    <!-- APPS -->\n    <c8y-contents-apps\n      class=\"p-t-16 d-block\"\n      [selectedVersionManifest]=\"selectedVersionManifest\"\n    ></c8y-contents-apps>\n\n    <!-- PLUGINS -->\n    <c8y-contents-plugins\n      class=\"p-t-16 d-block\"\n      [selectedVersionManifest]=\"selectedVersionManifest\"\n      [selectedPlugin]=\"selectedPlugin\"\n      (showOverview)=\"showPluginOverview($event)\"\n    ></c8y-contents-plugins>\n\n    <!-- CHANGELOG -->\n    <p class=\"legend form-block\">\n      {{ 'Change log' | translate }}\n    </p>\n\n    <c8y-contents-changelog\n      [package]=\"package\"\n      [selectedVersion]=\"selectedVersion\"\n      [previousVersion]=\"previousVersion\"\n    ></c8y-contents-changelog>\n  </div>\n</ng-container>\n" }]
         }], ctorParameters: () => [{ type: i1$2.ActivatedRoute }, { type: i4.ApplicationService }, { type: i2.AlertService }, { type: i2.ContextRouteService }], propDecorators: { selectedVersion: [{
                 type: Input
             }], selectedPlugin: [{
@@ -2944,11 +1935,23 @@ class PackageVersionsListComponent {
                 : this.acknowledgeLimitReached.bind(this);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PackageVersionsListComponent, deps: [{ token: i1$2.ActivatedRoute }, { token: i2.PluginsService }, { token: i1.EcosystemService }, { token: i6.TranslateService }, { token: i2.ModalService }, { token: i2.AlertService }, { token: i2.OptionsService }, { token: i2.Permissions }, { token: i2.GainsightService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PackageVersionsListComponent, isStandalone: false, selector: "c8y-package-versions-list", outputs: { onVersionSelect: "onVersionSelect" }, ngImport: i0, template: "<div class=\"inner-scroll split-view__list\">\n  <div class=\"card-header separator sticky-top bg-component\">\n    <div class=\"card-title\" translate>Versions</div>\n  </div>\n\n  <div class=\"bg-level-1 flex-grow\">\n    <div class=\"p-16\" *ngIf=\"isLoading\">\n      <c8y-loading></c8y-loading>\n    </div>\n    <ul class=\"nav c8y-nav-stacked\" *ngIf=\"!isLoading\">\n      <li\n        class=\"c8y-stacked-item p-t-0 p-b-0 p-r-4\"\n        [ngClass]=\"{ active: selectedVersion === applicationVersion.version }\"\n        *ngFor=\"let applicationVersion of sortedVersions\"\n      >\n        <div\n          class=\"flex-grow d-flex a-i-center gap-4 p-t-8 p-b-8\"\n          (click)=\"selectVersion(applicationVersion.version)\"\n        >\n          <i c8yIcon=\"big-parcel\" class=\"icon-20\"></i>\n          <span class=\"text-label-small\">\n            {{ 'Version' | translate }}\n          </span>\n          <span class=\"text-medium\">{{ applicationVersion.version }}</span>\n          <div class=\"text-truncate d-flex j-c-end flex-grow gap-4 flex-wrap m-l-auto\">\n            <span *ngFor=\"let tag of applicationVersion.tags\" class=\"label label-info\">\n              {{ tag }}\n            </span>\n          </div>\n        </div>\n        <div class=\"dropdown\" dropdown *ngIf=\"hasAdminPermissions && isPackageOwnedByCurrentTenant\">\n          <button\n            class=\"dropdown-toggle c8y-dropdown\"\n            type=\"button\"\n            title=\"{{ 'Settings' | translate }}\"\n            dropdownToggle\n          >\n            <i c8yIcon=\"ellipsis-v\"></i>\n          </button>\n          <ul *dropdownMenu class=\"dropdown-menu dropdown-menu-right\">\n            <li>\n              <button\n                type=\"button\"\n                title=\"{{ 'Set as latest`version`' | translate }}\"\n                (click)=\"setVersionAsLatest(applicationVersion)\"\n                [disabled]=\"applicationVersion.tags?.includes('latest')\"\n              >\n                <i c8yIcon=\"collect\" class=\"m-r-4\"></i>\n                {{ 'Set as latest`version`' | translate }}\n              </button>\n            </li>\n            <li>\n              <button\n                type=\"button\"\n                title=\"{{ 'Download' | translate }}\"\n                (click)=\"downloadArchive(applicationVersion)\"\n              >\n                <i c8yIcon=\"download\" class=\"m-r-4\"></i>\n                {{ 'Download' | translate }}\n              </button>\n            </li>\n            <li>\n              <button\n                type=\"button\"\n                title=\"{{ 'Delete' | translate }}\"\n                (click)=\"removeVersionPackage(applicationVersion.version)\"\n                [disabled]=\"applicationVersion.tags?.includes('latest')\"\n              >\n                <i c8yIcon=\"trash\" class=\"m-r-4\"></i>\n                {{ 'Delete' | translate }}\n              </button>\n            </li>\n          </ul>\n        </div>\n      </li>\n    </ul>\n  </div>\n\n  <div\n    class=\"card-footer separator sticky-bottom\"\n    *ngIf=\"!isLoading && isPackageOwnedByCurrentTenant\"\n  >\n    <div class=\"form-group m-b-0\">\n      <label translate>Upload a new version</label>\n      <c8y-upload-archive\n        [(application)]=\"package\"\n        [uploadNewVersion]=\"true\"\n        (refresh)=\"packageVersionUploaded()\"\n        [preUploadCallback]=\"preUploadCallback\"\n      ></c8y-upload-archive>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "directive", type: i6$1.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { kind: "directive", type: i6$1.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { kind: "directive", type: i6$1.BsDropdownDirective, selector: "[bsDropdown], [dropdown]", inputs: ["placement", "triggers", "container", "dropup", "autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen"], outputs: ["isOpenChange", "onShown", "onHidden"], exportAs: ["bs-dropdown"] }, { kind: "component", type: i1.UploadArchiveComponent, selector: "c8y-upload-archive", inputs: ["application", "uploadNewVersion", "preUploadCallback"], outputs: ["applicationChange", "refresh"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PackageVersionsListComponent, isStandalone: true, selector: "c8y-package-versions-list", outputs: { onVersionSelect: "onVersionSelect" }, ngImport: i0, template: "<div class=\"inner-scroll split-view__list\">\n  <div class=\"card-header separator sticky-top bg-component\">\n    <div class=\"card-title\" translate>Versions</div>\n  </div>\n\n  <div class=\"bg-level-1 flex-grow\">\n    <div class=\"p-16\" *ngIf=\"isLoading\">\n      <c8y-loading></c8y-loading>\n    </div>\n    <ul class=\"nav c8y-nav-stacked\" *ngIf=\"!isLoading\">\n      <li\n        class=\"c8y-stacked-item p-t-0 p-b-0 p-r-4\"\n        [ngClass]=\"{ active: selectedVersion === applicationVersion.version }\"\n        *ngFor=\"let applicationVersion of sortedVersions\"\n      >\n        <div\n          class=\"flex-grow d-flex a-i-center gap-4 p-t-8 p-b-8\"\n          (click)=\"selectVersion(applicationVersion.version)\"\n        >\n          <i c8yIcon=\"big-parcel\" class=\"icon-20\"></i>\n          <span class=\"text-label-small\">\n            {{ 'Version' | translate }}\n          </span>\n          <span class=\"text-medium\">{{ applicationVersion.version }}</span>\n          <div class=\"text-truncate d-flex j-c-end flex-grow gap-4 flex-wrap m-l-auto\">\n            <span *ngFor=\"let tag of applicationVersion.tags\" class=\"label label-info\">\n              {{ tag }}\n            </span>\n          </div>\n        </div>\n        <div class=\"dropdown\" dropdown *ngIf=\"hasAdminPermissions && isPackageOwnedByCurrentTenant\">\n          <button\n            class=\"dropdown-toggle c8y-dropdown\"\n            type=\"button\"\n            title=\"{{ 'Settings' | translate }}\"\n            dropdownToggle\n          >\n            <i c8yIcon=\"ellipsis-v\"></i>\n          </button>\n          <ul *dropdownMenu class=\"dropdown-menu dropdown-menu-right\">\n            <li>\n              <button\n                type=\"button\"\n                title=\"{{ 'Set as latest`version`' | translate }}\"\n                (click)=\"setVersionAsLatest(applicationVersion)\"\n                [disabled]=\"applicationVersion.tags?.includes('latest')\"\n              >\n                <i c8yIcon=\"collect\" class=\"m-r-4\"></i>\n                {{ 'Set as latest`version`' | translate }}\n              </button>\n            </li>\n            <li>\n              <button\n                type=\"button\"\n                title=\"{{ 'Download' | translate }}\"\n                (click)=\"downloadArchive(applicationVersion)\"\n              >\n                <i c8yIcon=\"download\" class=\"m-r-4\"></i>\n                {{ 'Download' | translate }}\n              </button>\n            </li>\n            <li>\n              <button\n                type=\"button\"\n                title=\"{{ 'Delete' | translate }}\"\n                (click)=\"removeVersionPackage(applicationVersion.version)\"\n                [disabled]=\"applicationVersion.tags?.includes('latest')\"\n              >\n                <i c8yIcon=\"trash\" class=\"m-r-4\"></i>\n                {{ 'Delete' | translate }}\n              </button>\n            </li>\n          </ul>\n        </div>\n      </li>\n    </ul>\n  </div>\n\n  <div\n    class=\"card-footer separator sticky-bottom\"\n    *ngIf=\"!isLoading && isPackageOwnedByCurrentTenant\"\n  >\n    <div class=\"form-group m-b-0\">\n      <label translate>Upload a new version</label>\n      <c8y-upload-archive\n        [(application)]=\"package\"\n        [uploadNewVersion]=\"true\"\n        (refresh)=\"packageVersionUploaded()\"\n        [preUploadCallback]=\"preUploadCallback\"\n      ></c8y-upload-archive>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: BsDropdownDirective, selector: "[bsDropdown], [dropdown]", inputs: ["placement", "triggers", "container", "dropup", "autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen"], outputs: ["isOpenChange", "onShown", "onHidden"], exportAs: ["bs-dropdown"] }, { kind: "directive", type: BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { kind: "directive", type: BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { kind: "component", type: UploadArchiveComponent, selector: "c8y-upload-archive", inputs: ["application", "uploadNewVersion", "preUploadCallback"], outputs: ["applicationChange", "refresh"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PackageVersionsListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-package-versions-list', standalone: false, template: "<div class=\"inner-scroll split-view__list\">\n  <div class=\"card-header separator sticky-top bg-component\">\n    <div class=\"card-title\" translate>Versions</div>\n  </div>\n\n  <div class=\"bg-level-1 flex-grow\">\n    <div class=\"p-16\" *ngIf=\"isLoading\">\n      <c8y-loading></c8y-loading>\n    </div>\n    <ul class=\"nav c8y-nav-stacked\" *ngIf=\"!isLoading\">\n      <li\n        class=\"c8y-stacked-item p-t-0 p-b-0 p-r-4\"\n        [ngClass]=\"{ active: selectedVersion === applicationVersion.version }\"\n        *ngFor=\"let applicationVersion of sortedVersions\"\n      >\n        <div\n          class=\"flex-grow d-flex a-i-center gap-4 p-t-8 p-b-8\"\n          (click)=\"selectVersion(applicationVersion.version)\"\n        >\n          <i c8yIcon=\"big-parcel\" class=\"icon-20\"></i>\n          <span class=\"text-label-small\">\n            {{ 'Version' | translate }}\n          </span>\n          <span class=\"text-medium\">{{ applicationVersion.version }}</span>\n          <div class=\"text-truncate d-flex j-c-end flex-grow gap-4 flex-wrap m-l-auto\">\n            <span *ngFor=\"let tag of applicationVersion.tags\" class=\"label label-info\">\n              {{ tag }}\n            </span>\n          </div>\n        </div>\n        <div class=\"dropdown\" dropdown *ngIf=\"hasAdminPermissions && isPackageOwnedByCurrentTenant\">\n          <button\n            class=\"dropdown-toggle c8y-dropdown\"\n            type=\"button\"\n            title=\"{{ 'Settings' | translate }}\"\n            dropdownToggle\n          >\n            <i c8yIcon=\"ellipsis-v\"></i>\n          </button>\n          <ul *dropdownMenu class=\"dropdown-menu dropdown-menu-right\">\n            <li>\n              <button\n                type=\"button\"\n                title=\"{{ 'Set as latest`version`' | translate }}\"\n                (click)=\"setVersionAsLatest(applicationVersion)\"\n                [disabled]=\"applicationVersion.tags?.includes('latest')\"\n              >\n                <i c8yIcon=\"collect\" class=\"m-r-4\"></i>\n                {{ 'Set as latest`version`' | translate }}\n              </button>\n            </li>\n            <li>\n              <button\n                type=\"button\"\n                title=\"{{ 'Download' | translate }}\"\n                (click)=\"downloadArchive(applicationVersion)\"\n              >\n                <i c8yIcon=\"download\" class=\"m-r-4\"></i>\n                {{ 'Download' | translate }}\n              </button>\n            </li>\n            <li>\n              <button\n                type=\"button\"\n                title=\"{{ 'Delete' | translate }}\"\n                (click)=\"removeVersionPackage(applicationVersion.version)\"\n                [disabled]=\"applicationVersion.tags?.includes('latest')\"\n              >\n                <i c8yIcon=\"trash\" class=\"m-r-4\"></i>\n                {{ 'Delete' | translate }}\n              </button>\n            </li>\n          </ul>\n        </div>\n      </li>\n    </ul>\n  </div>\n\n  <div\n    class=\"card-footer separator sticky-bottom\"\n    *ngIf=\"!isLoading && isPackageOwnedByCurrentTenant\"\n  >\n    <div class=\"form-group m-b-0\">\n      <label translate>Upload a new version</label>\n      <c8y-upload-archive\n        [(application)]=\"package\"\n        [uploadNewVersion]=\"true\"\n        (refresh)=\"packageVersionUploaded()\"\n        [preUploadCallback]=\"preUploadCallback\"\n      ></c8y-upload-archive>\n    </div>\n  </div>\n</div>\n" }]
+            args: [{ selector: 'c8y-package-versions-list', imports: [
+                        C8yTranslateDirective,
+                        NgIf,
+                        LoadingComponent,
+                        NgFor,
+                        NgClass,
+                        IconDirective,
+                        BsDropdownDirective,
+                        BsDropdownToggleDirective,
+                        BsDropdownMenuDirective,
+                        UploadArchiveComponent,
+                        C8yTranslatePipe
+                    ], template: "<div class=\"inner-scroll split-view__list\">\n  <div class=\"card-header separator sticky-top bg-component\">\n    <div class=\"card-title\" translate>Versions</div>\n  </div>\n\n  <div class=\"bg-level-1 flex-grow\">\n    <div class=\"p-16\" *ngIf=\"isLoading\">\n      <c8y-loading></c8y-loading>\n    </div>\n    <ul class=\"nav c8y-nav-stacked\" *ngIf=\"!isLoading\">\n      <li\n        class=\"c8y-stacked-item p-t-0 p-b-0 p-r-4\"\n        [ngClass]=\"{ active: selectedVersion === applicationVersion.version }\"\n        *ngFor=\"let applicationVersion of sortedVersions\"\n      >\n        <div\n          class=\"flex-grow d-flex a-i-center gap-4 p-t-8 p-b-8\"\n          (click)=\"selectVersion(applicationVersion.version)\"\n        >\n          <i c8yIcon=\"big-parcel\" class=\"icon-20\"></i>\n          <span class=\"text-label-small\">\n            {{ 'Version' | translate }}\n          </span>\n          <span class=\"text-medium\">{{ applicationVersion.version }}</span>\n          <div class=\"text-truncate d-flex j-c-end flex-grow gap-4 flex-wrap m-l-auto\">\n            <span *ngFor=\"let tag of applicationVersion.tags\" class=\"label label-info\">\n              {{ tag }}\n            </span>\n          </div>\n        </div>\n        <div class=\"dropdown\" dropdown *ngIf=\"hasAdminPermissions && isPackageOwnedByCurrentTenant\">\n          <button\n            class=\"dropdown-toggle c8y-dropdown\"\n            type=\"button\"\n            title=\"{{ 'Settings' | translate }}\"\n            dropdownToggle\n          >\n            <i c8yIcon=\"ellipsis-v\"></i>\n          </button>\n          <ul *dropdownMenu class=\"dropdown-menu dropdown-menu-right\">\n            <li>\n              <button\n                type=\"button\"\n                title=\"{{ 'Set as latest`version`' | translate }}\"\n                (click)=\"setVersionAsLatest(applicationVersion)\"\n                [disabled]=\"applicationVersion.tags?.includes('latest')\"\n              >\n                <i c8yIcon=\"collect\" class=\"m-r-4\"></i>\n                {{ 'Set as latest`version`' | translate }}\n              </button>\n            </li>\n            <li>\n              <button\n                type=\"button\"\n                title=\"{{ 'Download' | translate }}\"\n                (click)=\"downloadArchive(applicationVersion)\"\n              >\n                <i c8yIcon=\"download\" class=\"m-r-4\"></i>\n                {{ 'Download' | translate }}\n              </button>\n            </li>\n            <li>\n              <button\n                type=\"button\"\n                title=\"{{ 'Delete' | translate }}\"\n                (click)=\"removeVersionPackage(applicationVersion.version)\"\n                [disabled]=\"applicationVersion.tags?.includes('latest')\"\n              >\n                <i c8yIcon=\"trash\" class=\"m-r-4\"></i>\n                {{ 'Delete' | translate }}\n              </button>\n            </li>\n          </ul>\n        </div>\n      </li>\n    </ul>\n  </div>\n\n  <div\n    class=\"card-footer separator sticky-bottom\"\n    *ngIf=\"!isLoading && isPackageOwnedByCurrentTenant\"\n  >\n    <div class=\"form-group m-b-0\">\n      <label translate>Upload a new version</label>\n      <c8y-upload-archive\n        [(application)]=\"package\"\n        [uploadNewVersion]=\"true\"\n        (refresh)=\"packageVersionUploaded()\"\n        [preUploadCallback]=\"preUploadCallback\"\n      ></c8y-upload-archive>\n    </div>\n  </div>\n</div>\n" }]
         }], ctorParameters: () => [{ type: i1$2.ActivatedRoute }, { type: i2.PluginsService }, { type: i1.EcosystemService }, { type: i6.TranslateService }, { type: i2.ModalService }, { type: i2.AlertService }, { type: i2.OptionsService }, { type: i2.Permissions }, { type: i2.GainsightService }], propDecorators: { onVersionSelect: [{
                 type: Output
             }] } });
@@ -2983,11 +1986,26 @@ class PackageVersionsComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PackageVersionsComponent, deps: [{ token: i1$2.ActivatedRoute }, { token: i2.ContextRouteService }, { token: i2.PluginsService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PackageVersionsComponent, isStandalone: false, selector: "c8y-package-versions", ngImport: i0, template: "<c8y-title>{{ package?.name | humanizeAppName | async }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'big-parcel'\"\n    [label]=\"'Extensions' | translate\"\n    [path]=\"'ecosystem/extension/extensions'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"package?.name | humanizeAppName | async\"></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"'Versions' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<div\n  class=\"card content-fullpage d-grid\"\n  [ngClass]=\"{ 'grid__col--6-6-0': !selectedPlugin, 'grid__col--0-6-6': !!selectedPlugin }\"\n>\n  <c8y-package-versions-list\n    class=\"d-contents\"\n    (onVersionSelect)=\"selectVersion($event)\"\n  ></c8y-package-versions-list>\n\n  <!-- Package contents -->\n  <div\n    class=\"inner-scroll split-view__detail\"\n    [ngClass]=\"{ 'split-view__detail--selected': selectedVersion }\"\n  >\n    <div class=\"large-padding card-header separator visible-sm visible-xs fit-w sticky-top\">\n      <div class=\"d-flex a-i-center\">\n        <button\n          class=\"btn-clean text-primary m-r-8\"\n          title=\"{{ 'Back' | translate }}\"\n          (click)=\"clearSelectedVersion()\"\n        >\n          <i c8yIcon=\"chevron-left\"></i>\n          <span translate>Back</span>\n        </button>\n        <div class=\"card-title\">\n          {{ packageContentsTitle | translate: { selectedVersion } }}\n        </div>\n      </div>\n    </div>\n    <div class=\"card-header large-padding separator sticky-top visible-md visible-lg\">\n      <div class=\"card-title\">\n        <ng-container *ngIf=\"selectedVersion\">\n          {{ packageContentsTitle | translate: { selectedVersion } }}\n        </ng-container>\n      </div>\n    </div>\n    <div class=\"inner-scroll split-view__list\">\n      <c8y-package-contents\n        [selectedVersion]=\"selectedVersion\"\n        [selectedPlugin]=\"selectedPlugin\"\n        (showOverview)=\"showPluginOverview($event)\"\n      ></c8y-package-contents>\n    </div>\n  </div>\n\n  <!-- Plugin readme -->\n  <div\n    class=\"inner-scroll split-view__detail\"\n    [ngClass]=\"{ 'split-view__detail--selected': selectedPlugin }\"\n  >\n    <div\n      class=\"card-header separator sticky-top\"\n      *ngIf=\"selectedPlugin\"\n    >\n      <button\n        class=\"btn-clean\"\n        (click)=\"closeOverview()\"\n      >\n        <i c8yIcon=\"caret-back\"></i>\n        {{ 'Back to package versions overview ' | translate }}\n      </button>\n    </div>\n    <div\n      class=\"card-block p-l-16 p-r-16 overflow-visible\"\n      *ngIf=\"selectedPlugin\"\n    >\n      <div\n        class=\"markdown-content\"\n        *ngIf=\"pluginMarkdown\"\n        [innerHTML]=\"pluginMarkdown | markdownToHtml: { baseUrl: pluginBaseUrl } | async\"\n      ></div>\n      <c8y-ui-empty-state\n        [icon]=\"'user-manual'\"\n        [title]=\"'No README.md found for plugin' | translate\"\n        [subtitle]=\"\n          'To view the contents of &quot;README&quot;, add the file &quot;README.md&quot; to the plugin.'\n            | translate\n        \"\n        *ngIf=\"!pluginMarkdown\"\n        [horizontal]=\"true\"\n      ></c8y-ui-empty-state>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "component", type: i2.BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: i2.BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "component", type: i2.EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "component", type: PackageContentsComponent, selector: "c8y-package-contents", inputs: ["selectedVersion", "selectedPlugin"], outputs: ["showOverview"] }, { kind: "component", type: PackageVersionsListComponent, selector: "c8y-package-versions-list", outputs: ["onVersionSelect"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.HumanizeAppNamePipe, name: "humanizeAppName" }, { kind: "pipe", type: i2.MarkdownToHtmlPipe, name: "markdownToHtml" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PackageVersionsComponent, isStandalone: true, selector: "c8y-package-versions", ngImport: i0, template: "<c8y-title>{{ package?.name | humanizeAppName | async }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'big-parcel'\"\n    [label]=\"'Extensions' | translate\"\n    [path]=\"'ecosystem/extension/extensions'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"package?.name | humanizeAppName | async\"></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"'Versions' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<div\n  class=\"card content-fullpage d-grid\"\n  [ngClass]=\"{ 'grid__col--6-6-0': !selectedPlugin, 'grid__col--0-6-6': !!selectedPlugin }\"\n>\n  <c8y-package-versions-list\n    class=\"d-contents\"\n    (onVersionSelect)=\"selectVersion($event)\"\n  ></c8y-package-versions-list>\n\n  <!-- Package contents -->\n  <div\n    class=\"inner-scroll split-view__detail\"\n    [ngClass]=\"{ 'split-view__detail--selected': selectedVersion }\"\n  >\n    <div class=\"large-padding card-header separator visible-sm visible-xs fit-w sticky-top\">\n      <div class=\"d-flex a-i-center\">\n        <button\n          class=\"btn-clean text-primary m-r-8\"\n          title=\"{{ 'Back' | translate }}\"\n          (click)=\"clearSelectedVersion()\"\n        >\n          <i c8yIcon=\"chevron-left\"></i>\n          <span translate>Back</span>\n        </button>\n        <div class=\"card-title\">\n          {{ packageContentsTitle | translate: { selectedVersion } }}\n        </div>\n      </div>\n    </div>\n    <div class=\"card-header large-padding separator sticky-top visible-md visible-lg\">\n      <div class=\"card-title\">\n        <ng-container *ngIf=\"selectedVersion\">\n          {{ packageContentsTitle | translate: { selectedVersion } }}\n        </ng-container>\n      </div>\n    </div>\n    <div class=\"inner-scroll split-view__list\">\n      <c8y-package-contents\n        [selectedVersion]=\"selectedVersion\"\n        [selectedPlugin]=\"selectedPlugin\"\n        (showOverview)=\"showPluginOverview($event)\"\n      ></c8y-package-contents>\n    </div>\n  </div>\n\n  <!-- Plugin readme -->\n  <div\n    class=\"inner-scroll split-view__detail\"\n    [ngClass]=\"{ 'split-view__detail--selected': selectedPlugin }\"\n  >\n    <div\n      class=\"card-header separator sticky-top\"\n      *ngIf=\"selectedPlugin\"\n    >\n      <button\n        class=\"btn-clean\"\n        (click)=\"closeOverview()\"\n      >\n        <i c8yIcon=\"caret-back\"></i>\n        {{ 'Back to package versions overview ' | translate }}\n      </button>\n    </div>\n    <div\n      class=\"card-block p-l-16 p-r-16 overflow-visible\"\n      *ngIf=\"selectedPlugin\"\n    >\n      <div\n        class=\"markdown-content\"\n        *ngIf=\"pluginMarkdown\"\n        [innerHTML]=\"pluginMarkdown | markdownToHtml: { baseUrl: pluginBaseUrl } | async\"\n      ></div>\n      <c8y-ui-empty-state\n        [icon]=\"'user-manual'\"\n        [title]=\"'No README.md found for plugin' | translate\"\n        [subtitle]=\"\n          'To view the contents of &quot;README&quot;, add the file &quot;README.md&quot; to the plugin.'\n            | translate\n        \"\n        *ngIf=\"!pluginMarkdown\"\n        [horizontal]=\"true\"\n      ></c8y-ui-empty-state>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "component", type: TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "component", type: BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: PackageVersionsListComponent, selector: "c8y-package-versions-list", outputs: ["onVersionSelect"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PackageContentsComponent, selector: "c8y-package-contents", inputs: ["selectedVersion", "selectedPlugin"], outputs: ["showOverview"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: HumanizeAppNamePipe, name: "humanizeAppName" }, { kind: "pipe", type: MarkdownToHtmlPipe, name: "markdownToHtml" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PackageVersionsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-package-versions', standalone: false, template: "<c8y-title>{{ package?.name | humanizeAppName | async }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'big-parcel'\"\n    [label]=\"'Extensions' | translate\"\n    [path]=\"'ecosystem/extension/extensions'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"package?.name | humanizeAppName | async\"></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"'Versions' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<div\n  class=\"card content-fullpage d-grid\"\n  [ngClass]=\"{ 'grid__col--6-6-0': !selectedPlugin, 'grid__col--0-6-6': !!selectedPlugin }\"\n>\n  <c8y-package-versions-list\n    class=\"d-contents\"\n    (onVersionSelect)=\"selectVersion($event)\"\n  ></c8y-package-versions-list>\n\n  <!-- Package contents -->\n  <div\n    class=\"inner-scroll split-view__detail\"\n    [ngClass]=\"{ 'split-view__detail--selected': selectedVersion }\"\n  >\n    <div class=\"large-padding card-header separator visible-sm visible-xs fit-w sticky-top\">\n      <div class=\"d-flex a-i-center\">\n        <button\n          class=\"btn-clean text-primary m-r-8\"\n          title=\"{{ 'Back' | translate }}\"\n          (click)=\"clearSelectedVersion()\"\n        >\n          <i c8yIcon=\"chevron-left\"></i>\n          <span translate>Back</span>\n        </button>\n        <div class=\"card-title\">\n          {{ packageContentsTitle | translate: { selectedVersion } }}\n        </div>\n      </div>\n    </div>\n    <div class=\"card-header large-padding separator sticky-top visible-md visible-lg\">\n      <div class=\"card-title\">\n        <ng-container *ngIf=\"selectedVersion\">\n          {{ packageContentsTitle | translate: { selectedVersion } }}\n        </ng-container>\n      </div>\n    </div>\n    <div class=\"inner-scroll split-view__list\">\n      <c8y-package-contents\n        [selectedVersion]=\"selectedVersion\"\n        [selectedPlugin]=\"selectedPlugin\"\n        (showOverview)=\"showPluginOverview($event)\"\n      ></c8y-package-contents>\n    </div>\n  </div>\n\n  <!-- Plugin readme -->\n  <div\n    class=\"inner-scroll split-view__detail\"\n    [ngClass]=\"{ 'split-view__detail--selected': selectedPlugin }\"\n  >\n    <div\n      class=\"card-header separator sticky-top\"\n      *ngIf=\"selectedPlugin\"\n    >\n      <button\n        class=\"btn-clean\"\n        (click)=\"closeOverview()\"\n      >\n        <i c8yIcon=\"caret-back\"></i>\n        {{ 'Back to package versions overview ' | translate }}\n      </button>\n    </div>\n    <div\n      class=\"card-block p-l-16 p-r-16 overflow-visible\"\n      *ngIf=\"selectedPlugin\"\n    >\n      <div\n        class=\"markdown-content\"\n        *ngIf=\"pluginMarkdown\"\n        [innerHTML]=\"pluginMarkdown | markdownToHtml: { baseUrl: pluginBaseUrl } | async\"\n      ></div>\n      <c8y-ui-empty-state\n        [icon]=\"'user-manual'\"\n        [title]=\"'No README.md found for plugin' | translate\"\n        [subtitle]=\"\n          'To view the contents of &quot;README&quot;, add the file &quot;README.md&quot; to the plugin.'\n            | translate\n        \"\n        *ngIf=\"!pluginMarkdown\"\n        [horizontal]=\"true\"\n      ></c8y-ui-empty-state>\n    </div>\n  </div>\n</div>\n" }]
+            args: [{ selector: 'c8y-package-versions', imports: [
+                        TitleComponent,
+                        BreadcrumbComponent,
+                        BreadcrumbItemComponent,
+                        NgClass,
+                        PackageVersionsListComponent,
+                        IconDirective,
+                        C8yTranslateDirective,
+                        NgIf,
+                        PackageContentsComponent,
+                        EmptyStateComponent,
+                        C8yTranslatePipe,
+                        AsyncPipe,
+                        HumanizeAppNamePipe,
+                        MarkdownToHtmlPipe
+                    ], template: "<c8y-title>{{ package?.name | humanizeAppName | async }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-atom'\"\n    [label]=\"'Ecosystem' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'big-parcel'\"\n    [label]=\"'Extensions' | translate\"\n    [path]=\"'ecosystem/extension/extensions'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"package?.name | humanizeAppName | async\"></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item [label]=\"'Versions' | translate\"></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<div\n  class=\"card content-fullpage d-grid\"\n  [ngClass]=\"{ 'grid__col--6-6-0': !selectedPlugin, 'grid__col--0-6-6': !!selectedPlugin }\"\n>\n  <c8y-package-versions-list\n    class=\"d-contents\"\n    (onVersionSelect)=\"selectVersion($event)\"\n  ></c8y-package-versions-list>\n\n  <!-- Package contents -->\n  <div\n    class=\"inner-scroll split-view__detail\"\n    [ngClass]=\"{ 'split-view__detail--selected': selectedVersion }\"\n  >\n    <div class=\"large-padding card-header separator visible-sm visible-xs fit-w sticky-top\">\n      <div class=\"d-flex a-i-center\">\n        <button\n          class=\"btn-clean text-primary m-r-8\"\n          title=\"{{ 'Back' | translate }}\"\n          (click)=\"clearSelectedVersion()\"\n        >\n          <i c8yIcon=\"chevron-left\"></i>\n          <span translate>Back</span>\n        </button>\n        <div class=\"card-title\">\n          {{ packageContentsTitle | translate: { selectedVersion } }}\n        </div>\n      </div>\n    </div>\n    <div class=\"card-header large-padding separator sticky-top visible-md visible-lg\">\n      <div class=\"card-title\">\n        <ng-container *ngIf=\"selectedVersion\">\n          {{ packageContentsTitle | translate: { selectedVersion } }}\n        </ng-container>\n      </div>\n    </div>\n    <div class=\"inner-scroll split-view__list\">\n      <c8y-package-contents\n        [selectedVersion]=\"selectedVersion\"\n        [selectedPlugin]=\"selectedPlugin\"\n        (showOverview)=\"showPluginOverview($event)\"\n      ></c8y-package-contents>\n    </div>\n  </div>\n\n  <!-- Plugin readme -->\n  <div\n    class=\"inner-scroll split-view__detail\"\n    [ngClass]=\"{ 'split-view__detail--selected': selectedPlugin }\"\n  >\n    <div\n      class=\"card-header separator sticky-top\"\n      *ngIf=\"selectedPlugin\"\n    >\n      <button\n        class=\"btn-clean\"\n        (click)=\"closeOverview()\"\n      >\n        <i c8yIcon=\"caret-back\"></i>\n        {{ 'Back to package versions overview ' | translate }}\n      </button>\n    </div>\n    <div\n      class=\"card-block p-l-16 p-r-16 overflow-visible\"\n      *ngIf=\"selectedPlugin\"\n    >\n      <div\n        class=\"markdown-content\"\n        *ngIf=\"pluginMarkdown\"\n        [innerHTML]=\"pluginMarkdown | markdownToHtml: { baseUrl: pluginBaseUrl } | async\"\n      ></div>\n      <c8y-ui-empty-state\n        [icon]=\"'user-manual'\"\n        [title]=\"'No README.md found for plugin' | translate\"\n        [subtitle]=\"\n          'To view the contents of &quot;README&quot;, add the file &quot;README.md&quot; to the plugin.'\n            | translate\n        \"\n        *ngIf=\"!pluginMarkdown\"\n        [horizontal]=\"true\"\n      ></c8y-ui-empty-state>\n    </div>\n  </div>\n</div>\n" }]
         }], ctorParameters: () => [{ type: i1$2.ActivatedRoute }, { type: i2.ContextRouteService }, { type: i2.PluginsService }] });
 
 class PackageGuard {
@@ -3147,7 +2165,19 @@ const applicationDetailsRoutes = [
 ];
 class EcosystemModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EcosystemModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: EcosystemModule, declarations: [ApplicationListComponent,
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: EcosystemModule, imports: [CoreModule,
+            BsDropdownModule,
+            TooltipModule,
+            FormsModule$1,
+            ReactiveFormsModule, i1$2.RouterModule, PopoverModule,
+            ApplicationPluginsModule,
+            SharedEcosystemModule,
+            LicenseConfirmModule,
+            IconSelectorModule,
+            A11yModule,
+            ArchivedConfirmModule,
+            PackageChangelogTabComponent,
+            ApplicationListComponent,
             MicroserviceListComponent,
             ApplicationPropertiesComponent,
             AddMicroserviceComponent,
@@ -3166,18 +2196,7 @@ class EcosystemModule {
             PackageContentsComponent,
             PackageVersionsListComponent,
             SubscriptionModalComponent,
-            UpdateApplicationModalComponent], imports: [CoreModule,
-            BsDropdownModule,
-            TooltipModule,
-            FormsModule,
-            ReactiveFormsModule, i1$2.RouterModule, PopoverModule,
-            ApplicationPluginsModule,
-            SharedEcosystemModule,
-            LicenseConfirmModule,
-            IconSelectorModule,
-            A11yModule,
-            ArchivedConfirmModule,
-            PackageChangelogTabComponent], exports: [ApplicationPropertiesComponent, UpdateApplicationModalComponent] }); }
+            UpdateApplicationModalComponent], exports: [ApplicationPropertiesComponent, UpdateApplicationModalComponent] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EcosystemModule, providers: [
             hookTab(EcosystemTabs),
             hookRoute(applicationDetailsRoutes),
@@ -3222,7 +2241,7 @@ class EcosystemModule {
         ], imports: [CoreModule,
             BsDropdownModule,
             TooltipModule,
-            FormsModule,
+            FormsModule$1,
             ReactiveFormsModule,
             RouterModule.forChild(ecosystemMainRoutes),
             PopoverModule,
@@ -3232,12 +2251,46 @@ class EcosystemModule {
             IconSelectorModule,
             A11yModule,
             ArchivedConfirmModule,
-            PackageChangelogTabComponent] }); }
+            PackageChangelogTabComponent,
+            ApplicationListComponent,
+            MicroserviceListComponent,
+            ApplicationPropertiesComponent,
+            AddMicroserviceComponent,
+            ActivityLogComponent,
+            AddWebApplicationComponent,
+            AddExternalApplicationComponent,
+            InstallFromPackageComponent,
+            PackagesListComponent,
+            PackageDetailsComponent,
+            DeployApplicationComponent,
+            AddPackageComponent,
+            FeatureListComponent,
+            PackageVersionsComponent,
+            PackageVersionsPluginsComponent,
+            PackageVersionsAppsComponent,
+            PackageContentsComponent,
+            PackageVersionsListComponent,
+            SubscriptionModalComponent,
+            UpdateApplicationModalComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: EcosystemModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [
+                    imports: [
+                        CoreModule,
+                        BsDropdownModule,
+                        TooltipModule,
+                        FormsModule$1,
+                        ReactiveFormsModule,
+                        RouterModule.forChild(ecosystemMainRoutes),
+                        PopoverModule,
+                        ApplicationPluginsModule,
+                        SharedEcosystemModule,
+                        LicenseConfirmModule,
+                        IconSelectorModule,
+                        A11yModule,
+                        ArchivedConfirmModule,
+                        PackageChangelogTabComponent,
                         ApplicationListComponent,
                         MicroserviceListComponent,
                         ApplicationPropertiesComponent,
@@ -3259,22 +2312,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
                         SubscriptionModalComponent,
                         UpdateApplicationModalComponent
                     ],
-                    imports: [
-                        CoreModule,
-                        BsDropdownModule,
-                        TooltipModule,
-                        FormsModule,
-                        ReactiveFormsModule,
-                        RouterModule.forChild(ecosystemMainRoutes),
-                        PopoverModule,
-                        ApplicationPluginsModule,
-                        SharedEcosystemModule,
-                        LicenseConfirmModule,
-                        IconSelectorModule,
-                        A11yModule,
-                        ArchivedConfirmModule,
-                        PackageChangelogTabComponent
-                    ],
                     exports: [ApplicationPropertiesComponent, UpdateApplicationModalComponent],
                     providers: [
                         hookTab(EcosystemTabs),