@c8y/ngx-components 1022.9.6 → 1022.13.0

package/fesm2022/c8y-ngx-components-protocol-lpwan.mjs

@@ -1,16 +1,17 @@
 import * as i0 from '@angular/core';
 import { EventEmitter, Input, Output, Component, Injectable, ViewChild, NgModule } from '@angular/core';
 import * as i2 from '@c8y/ngx-components';
-import { gettext, Status, CoreModule, CommonModule, FormsModule, PopoverConfirmComponent, ViewContext, hookRoute } from '@c8y/ngx-components';
+import { gettext, EmptyStateComponent, IconDirective, C8yTranslatePipe, Status, LoadingComponent, TitleComponent, BreadcrumbComponent, BreadcrumbItemComponent, ListGroupComponent, ListItemComponent, ListItemIconComponent, FormGroupComponent, RequiredInputPlaceholderDirective, MessagesComponent, MessageDirective, C8yTranslateDirective, CoreModule, CommonModule, FormsModule as FormsModule$1, PopoverConfirmComponent, TypeaheadComponent, ForOfDirective, HighlightComponent, ViewContext, hookRoute } from '@c8y/ngx-components';
 import * as i1 from '@c8y/client';
 import { cloneDeep, escapeRegExp, orderBy, head, find, findIndex, get } from 'lodash-es';
 import * as i3$1 from '@angular/router';
 import { RouterModule } from '@angular/router';
-import * as i6 from '@angular/forms';
+import * as i5 from '@angular/forms';
+import { FormsModule } from '@angular/forms';
 import * as i3 from '@ngx-translate/core';
 import * as i4 from 'ngx-bootstrap/modal';
 import { saveAs } from 'file-saver';
-import * as i5 from '@angular/common';
+import { NgIf, NgFor } from '@angular/common';
 import { pipe } from 'rxjs';
 import { map } from 'rxjs/operators';
 
@@ -23,11 +24,11 @@ class NoConnectionsFoundComponent {
         this.onAction.emit();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NoConnectionsFoundComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: NoConnectionsFoundComponent, isStandalone: false, selector: "no-connections-found", inputs: { header: "header" }, outputs: { onAction: "onAction" }, ngImport: i0, template: "<div class=\"card content-fullpage split-view--5-7\">\n  <div class=\"card-header separator grid__col--fullspan\">\n    <h4>{{ header | translate}}</h4>\n  </div>\n  <div class=\"inner-scroll split-view__list\">\n    <div class=\"bg-level-1 flex-grow\">\n      <div class=\"card-block large-padding\">\n        <c8y-ui-empty-state\n          [icon]=\"'plug'\"\n          [title]=\"'No connections found.' | translate\"\n          [subtitle]=\"'Click below to add a new connection.' | translate\"\n          [horizontal]=\"true\"\n        ></c8y-ui-empty-state>\n      </div>\n    </div>\n\n    <div class=\"card-footer separator\">\n      <button\n        title=\"{{ 'Add connection' | translate }}\"\n        class=\"btn btn-primary\"\n        (click)=\"addConnection()\"\n      >\n        <i [c8yIcon]=\"'plus-circle'\"></i>\n        {{ 'Add connection' | translate }}\n      </button>\n    </div>\n  </div>\n  <div class=\"inner-scroll split-view__detail\">\n    <div class=\"flex-grow\">\n      <div class=\"card-block large-padding\">\n        <c8y-ui-empty-state\n          [icon]=\"'more-details'\"\n          [title]=\"'No settings to display.' | translate\"\n          [subtitle]=\"'Add a connection.' | translate\"\n          [horizontal]=\"true\"\n        ></c8y-ui-empty-state>\n      </div>\n    </div>\n  </div>\n</div>\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: "pipe", type: i2.C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: NoConnectionsFoundComponent, isStandalone: true, selector: "no-connections-found", inputs: { header: "header" }, outputs: { onAction: "onAction" }, ngImport: i0, template: "<div class=\"card content-fullpage split-view--5-7\">\n  <div class=\"card-header separator grid__col--fullspan\">\n    <h4>{{ header | translate}}</h4>\n  </div>\n  <div class=\"inner-scroll split-view__list\">\n    <div class=\"bg-level-1 flex-grow\">\n      <div class=\"card-block large-padding\">\n        <c8y-ui-empty-state\n          [icon]=\"'plug'\"\n          [title]=\"'No connections found.' | translate\"\n          [subtitle]=\"'Click below to add a new connection.' | translate\"\n          [horizontal]=\"true\"\n        ></c8y-ui-empty-state>\n      </div>\n    </div>\n\n    <div class=\"card-footer separator\">\n      <button\n        title=\"{{ 'Add connection' | translate }}\"\n        class=\"btn btn-primary\"\n        (click)=\"addConnection()\"\n      >\n        <i [c8yIcon]=\"'plus-circle'\"></i>\n        {{ 'Add connection' | translate }}\n      </button>\n    </div>\n  </div>\n  <div class=\"inner-scroll split-view__detail\">\n    <div class=\"flex-grow\">\n      <div class=\"card-block large-padding\">\n        <c8y-ui-empty-state\n          [icon]=\"'more-details'\"\n          [title]=\"'No settings to display.' | translate\"\n          [subtitle]=\"'Add a connection.' | translate\"\n          [horizontal]=\"true\"\n        ></c8y-ui-empty-state>\n      </div>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NoConnectionsFoundComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'no-connections-found', standalone: false, template: "<div class=\"card content-fullpage split-view--5-7\">\n  <div class=\"card-header separator grid__col--fullspan\">\n    <h4>{{ header | translate}}</h4>\n  </div>\n  <div class=\"inner-scroll split-view__list\">\n    <div class=\"bg-level-1 flex-grow\">\n      <div class=\"card-block large-padding\">\n        <c8y-ui-empty-state\n          [icon]=\"'plug'\"\n          [title]=\"'No connections found.' | translate\"\n          [subtitle]=\"'Click below to add a new connection.' | translate\"\n          [horizontal]=\"true\"\n        ></c8y-ui-empty-state>\n      </div>\n    </div>\n\n    <div class=\"card-footer separator\">\n      <button\n        title=\"{{ 'Add connection' | translate }}\"\n        class=\"btn btn-primary\"\n        (click)=\"addConnection()\"\n      >\n        <i [c8yIcon]=\"'plus-circle'\"></i>\n        {{ 'Add connection' | translate }}\n      </button>\n    </div>\n  </div>\n  <div class=\"inner-scroll split-view__detail\">\n    <div class=\"flex-grow\">\n      <div class=\"card-block large-padding\">\n        <c8y-ui-empty-state\n          [icon]=\"'more-details'\"\n          [title]=\"'No settings to display.' | translate\"\n          [subtitle]=\"'Add a connection.' | translate\"\n          [horizontal]=\"true\"\n        ></c8y-ui-empty-state>\n      </div>\n    </div>\n  </div>\n</div>\n" }]
+            args: [{ selector: 'no-connections-found', imports: [EmptyStateComponent, IconDirective, C8yTranslatePipe], template: "<div class=\"card content-fullpage split-view--5-7\">\n  <div class=\"card-header separator grid__col--fullspan\">\n    <h4>{{ header | translate}}</h4>\n  </div>\n  <div class=\"inner-scroll split-view__list\">\n    <div class=\"bg-level-1 flex-grow\">\n      <div class=\"card-block large-padding\">\n        <c8y-ui-empty-state\n          [icon]=\"'plug'\"\n          [title]=\"'No connections found.' | translate\"\n          [subtitle]=\"'Click below to add a new connection.' | translate\"\n          [horizontal]=\"true\"\n        ></c8y-ui-empty-state>\n      </div>\n    </div>\n\n    <div class=\"card-footer separator\">\n      <button\n        title=\"{{ 'Add connection' | translate }}\"\n        class=\"btn btn-primary\"\n        (click)=\"addConnection()\"\n      >\n        <i [c8yIcon]=\"'plus-circle'\"></i>\n        {{ 'Add connection' | translate }}\n      </button>\n    </div>\n  </div>\n  <div class=\"inner-scroll split-view__detail\">\n    <div class=\"flex-grow\">\n      <div class=\"card-block large-padding\">\n        <c8y-ui-empty-state\n          [icon]=\"'more-details'\"\n          [title]=\"'No settings to display.' | translate\"\n          [subtitle]=\"'Add a connection.' | translate\"\n          [horizontal]=\"true\"\n        ></c8y-ui-empty-state>\n      </div>\n    </div>\n  </div>\n</div>\n" }]
         }], propDecorators: { onAction: [{
                 type: Output
             }], header: [{
@@ -187,11 +188,11 @@ class ConnectionInfoWithDownloadCsvComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ConnectionInfoWithDownloadCsvComponent, deps: [{ token: i4.BsModalRef }, { token: MultipleLnsConnectorService }, { token: i2.AlertService }, { token: i3.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ConnectionInfoWithDownloadCsvComponent, isStandalone: false, selector: "connection-info-with-download-csv", inputs: { messageData: "messageData", appData: "appData", modalTitle: "modalTitle", connectionName: "connectionName" }, ngImport: i0, template: "<div class=\"modal-dialog\">\n  <div class=\"modal-content\">\n    <div class=\"c8y-prompt alert alert-danger\">\n      <h3 class=\"m-b-16\">\n        <i class=\"dlt-c8y-icon-exclamation-circle\"></i>\n        <span>{{ modalTitle | translate }}</span>\n      </h3>\n      <p class=\"text-break-word\">\n        {{ messageData.message | translate }}\n      </p>\n      <br>\n      <span class=\"btn-default\" (click)=\"download()\">{{\n        'Click the link to download the file with the affected devices.' | translate\n      }}</span>\n      <div class=\"alert-footer\">\n        <button\n          title=\"{{ 'Cancel' | translate }}\"\n          type=\"button\"\n          class=\"btn btn-default\"\n          (click)=\"dismiss()\"\n        >\n          {{ 'Cancel' | translate }}\n        </button>\n      </div>\n    </div>\n  </div>\n</div>", dependencies: [{ kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ConnectionInfoWithDownloadCsvComponent, isStandalone: true, selector: "connection-info-with-download-csv", inputs: { messageData: "messageData", appData: "appData", modalTitle: "modalTitle", connectionName: "connectionName" }, ngImport: i0, template: "<div class=\"modal-dialog\">\n  <div class=\"modal-content\">\n    <div class=\"c8y-prompt alert alert-danger\">\n      <h3 class=\"m-b-16\">\n        <i class=\"dlt-c8y-icon-exclamation-circle\"></i>\n        <span>{{ modalTitle | translate }}</span>\n      </h3>\n      <p class=\"text-break-word\">\n        {{ messageData.message | translate }}\n      </p>\n      <br>\n      <span class=\"btn-default\" (click)=\"download()\">{{\n        'Click the link to download the file with the affected devices.' | translate\n      }}</span>\n      <div class=\"alert-footer\">\n        <button\n          title=\"{{ 'Cancel' | translate }}\"\n          type=\"button\"\n          class=\"btn btn-default\"\n          (click)=\"dismiss()\"\n        >\n          {{ 'Cancel' | translate }}\n        </button>\n      </div>\n    </div>\n  </div>\n</div>", dependencies: [{ kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ConnectionInfoWithDownloadCsvComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'connection-info-with-download-csv', standalone: false, template: "<div class=\"modal-dialog\">\n  <div class=\"modal-content\">\n    <div class=\"c8y-prompt alert alert-danger\">\n      <h3 class=\"m-b-16\">\n        <i class=\"dlt-c8y-icon-exclamation-circle\"></i>\n        <span>{{ modalTitle | translate }}</span>\n      </h3>\n      <p class=\"text-break-word\">\n        {{ messageData.message | translate }}\n      </p>\n      <br>\n      <span class=\"btn-default\" (click)=\"download()\">{{\n        'Click the link to download the file with the affected devices.' | translate\n      }}</span>\n      <div class=\"alert-footer\">\n        <button\n          title=\"{{ 'Cancel' | translate }}\"\n          type=\"button\"\n          class=\"btn btn-default\"\n          (click)=\"dismiss()\"\n        >\n          {{ 'Cancel' | translate }}\n        </button>\n      </div>\n    </div>\n  </div>\n</div>" }]
+            args: [{ selector: 'connection-info-with-download-csv', imports: [C8yTranslatePipe], template: "<div class=\"modal-dialog\">\n  <div class=\"modal-content\">\n    <div class=\"c8y-prompt alert alert-danger\">\n      <h3 class=\"m-b-16\">\n        <i class=\"dlt-c8y-icon-exclamation-circle\"></i>\n        <span>{{ modalTitle | translate }}</span>\n      </h3>\n      <p class=\"text-break-word\">\n        {{ messageData.message | translate }}\n      </p>\n      <br>\n      <span class=\"btn-default\" (click)=\"download()\">{{\n        'Click the link to download the file with the affected devices.' | translate\n      }}</span>\n      <div class=\"alert-footer\">\n        <button\n          title=\"{{ 'Cancel' | translate }}\"\n          type=\"button\"\n          class=\"btn btn-default\"\n          (click)=\"dismiss()\"\n        >\n          {{ 'Cancel' | translate }}\n        </button>\n      </div>\n    </div>\n  </div>\n</div>" }]
         }], ctorParameters: () => [{ type: i4.BsModalRef }, { type: MultipleLnsConnectorService }, { type: i2.AlertService }, { type: i3.TranslateService }], propDecorators: { messageData: [{
                 type: Input
             }], appData: [{
@@ -352,11 +353,30 @@ class SigfoxMultipleLnsConnectorComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SigfoxMultipleLnsConnectorComponent, deps: [{ token: MultipleLnsConnectorService }, { token: i2.AlertService }, { token: i3.TranslateService }, { token: i4.BsModalService }, { token: i2.ModalService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: SigfoxMultipleLnsConnectorComponent, isStandalone: false, selector: "sigfox-multiple-lns-connector", viewQueries: [{ propertyName: "connectorsForm", first: true, predicate: ["connectorsForm"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"state === 'loadingConnection'; else renderListAndForm\">\n  <c8y-loading></c8y-loading>\n</ng-container>\n<c8y-title>{{ 'Connectivity' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Settings' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Connectivity' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Sigfox' | translate\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<ng-template #renderListAndForm>\n  <no-connections-found\n    (onAction)=\"addConnection()\"\n    *ngIf=\"connections.length === 0 && state !== 'addConnections'\"\n    [header]=\"cardHeader | translate\"\n  ></no-connections-found>\n  <div>\n    <div\n      class=\"card content-fullpage split-view--5-7\"\n      *ngIf=\"connections.length !== 0 || state === 'addConnections'\"\n    >\n      <div class=\"card-header separator grid__col--fullspan\">\n        <div class=\"card-title\">{{ cardHeader | translate }}</div>\n      </div>\n      <div class=\"inner-scroll split-view__list\">\n        <div class=\"bg-level-1 flex-grow\">\n          <c8y-list-group class=\"nav c8y-nav-stacked\">\n            <c8y-li\n              class=\"c8y-stacked-item p-0\"\n              [class.active]=\"connection.name === connectionBeingEdited\"\n              *ngFor=\"let connection of connections; let index = index\"\n              (click)=\"setModel(cloneDeep(connection))\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              <span title=\"{{ connection.name }}\">\n                {{ connection.name }}\n              </span>\n            </c8y-li>\n\n            <c8y-li\n              class=\"c8y-nav-stacked active\"\n              *ngIf=\"state === 'addConnections'\"\n              (click)=\"addConnection()\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              {{ 'New connection' | translate }}\n            </c8y-li>\n          </c8y-list-group>\n        </div>\n        <div class=\"card-footer separator-top\">\n          <button\n            class=\"btn btn-default\"\n            title=\"{{ 'Add connection' | translate }}\"\n            [disabled]=\"state === 'addConnections'\"\n            (click)=\"addConnection()\"\n          >\n            <i [c8yIcon]=\"'plus-circle'\"></i>\n            {{ 'Add connection' | translate }}\n          </button>\n        </div>\n      </div>\n\n      <!-- 'split-view__detail--selected' condition needs to be fixed. this is needed so that both columns are visible in tablet format -->\n\n      <div\n        class=\"inner-scroll split-view__detail\"\n        ng-class=\"{ 'split-view__detail--selected': vm.selected && vm.jsonSchemaObjects }\"\n      >\n        <div class=\"card-header separator visible-sm visible-xs fit-w sticky-top\">\n          <button\n            class=\"btn btn-clean text-primary\"\n            title=\"{{ 'Back' | translate }}\"\n            ng-click=\"vm.deselect()\"\n          >\n            <i [c8yIcon]=\"'chevron-left'\"></i>\n            <span>{{ 'Back' | translate }}</span>\n          </button>\n        </div>\n        <form\n          class=\"d-contents\"\n          #connectorsForm=\"ngForm\"\n        >\n          <div class=\"flex-grow\">\n            <div class=\"card-block large-padding\">\n              <c8y-form-group>\n                <label for=\"name\">\n                  {{ 'Name' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"name\"\n                  name=\"name\"\n                  type=\"text\"\n                  required\n                  [placeholder]=\"'e.g. Sigfox connection' | translate\"\n                  [(ngModel)]=\"connection.name\"\n                  [pattern]=\"namePattern\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    [text]=\"namePatternError\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"description\">\n                  {{ 'Description' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"description\"\n                  name=\"description\"\n                  type=\"text\"\n                  [placeholder]=\"\n                    'e.g. This connection has a built-in functionality to\u2026' | translate\n                  \"\n                  [(ngModel)]=\"connection.description\"\n                />\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"baseUrl\">\n                  {{ 'URL' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"baseUrl\"\n                  name=\"baseUrl\"\n                  type=\"text\"\n                  required\n                  [placeholder]=\"\n                    'e.g. {{ example }}' | translate : { example: 'https://backend.sigfox.com/api' }\n                  \"\n                  [(ngModel)]=\"connection.baseUrl\"\n                />\n              </c8y-form-group>\n              <c8y-form-group>\n                <label for=\"parentGroupId\">\n                  {{ 'Parent group ID' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"parentGroupId\"\n                  name=\"parentGroupId\"\n                  type=\"text\"\n                  required\n                  [placeholder]=\"\n                    'e.g. {{ example }}' | translate : { example: '58c1793b9e93a15370f71caa' }\n                  \"\n                  [(ngModel)]=\"connection.parentGroupId\"\n                  pattern=\"[a-z\\d]+\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    text=\"{{ 'Must be a valid Parent group ID' | translate }}\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"username\">\n                  {{ 'Username' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"username\"\n                  placeholder=\"{{ 'e.g. joe`LOCALIZE`' | translate }}\"\n                  name=\"username\"\n                  type=\"text\"\n                  required\n                  [(ngModel)]=\"connection.username\"\n                />\n              </c8y-form-group>\n              <c8y-form-group *ngIf=\"showPassword\">\n                <label for=\"password\">\n                  {{ 'Password' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"password\"\n                  placeholder=\"{{ 'e.g. my_password' | translate }}\"\n                  name=\"password\"\n                  type=\"password\"\n                  required\n                  [(ngModel)]=\"connection.password\"\n                />\n              </c8y-form-group>\n\n              <button\n                class=\"btn btn-default\"\n                name=\"changePassword\"\n                type=\"button\"\n                *ngIf=\"state === 'updateConnection'\"\n                (click)=\"changePassword()\"\n              >\n                <span\n                  title=\"{{ 'Change password' | translate }}\"\n                  *ngIf=\"!showPassword\"\n                >\n                  {{ 'Change password' | translate }}\n                </span>\n                <span\n                  title=\"{{ 'Cancel password change' | translate }}\"\n                  *ngIf=\"showPassword\"\n                >\n                  {{ 'Cancel password change' | translate }}\n                </span>\n              </button>\n            </div>\n          </div>\n\n          <div class=\"card-footer separator-top\">\n            <button\n              class=\"btn btn-default\"\n              title=\"{{ 'Cancel' | translate }}\"\n              type=\"button\"\n              (click)=\"setModel()\"\n              translate\n            >\n              Cancel\n            </button>\n            <button\n              class=\"btn btn-danger\"\n              title=\"{{ 'Delete' | translate }}\"\n              type=\"button\"\n              data-cy=\"sigfox-multiple-lns-connector.component--delete-connectivity\"\n              *ngIf=\"state === 'updateConnection'\"\n              (click)=\"deleteConnection(originalConnection)\"\n              translate\n            >\n              Delete\n            </button>\n            <button\n              class=\"btn btn-primary\"\n              title=\"{{ 'Save' | translate }}\"\n              data-cy=\"sigfox-multiple-lns-connector.component--save-connectivity\"\n              type=\"submit\"\n              [disabled]=\"!connectorsForm.form.valid || connectorsForm.form.pristine\"\n              (click)=\"save()\"\n              translate\n            >\n              Save\n            </button>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</ng-template>\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: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "component", type: i2.TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "directive", type: i6.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i6.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i6.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i6.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { 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: "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: NoConnectionsFoundComponent, selector: "no-connections-found", inputs: ["header"], outputs: ["onAction"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: SigfoxMultipleLnsConnectorComponent, isStandalone: true, selector: "sigfox-multiple-lns-connector", viewQueries: [{ propertyName: "connectorsForm", first: true, predicate: ["connectorsForm"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"state === 'loadingConnection'; else renderListAndForm\">\n  <c8y-loading></c8y-loading>\n</ng-container>\n<c8y-title>{{ 'Connectivity' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Settings' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Connectivity' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Sigfox' | translate\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<ng-template #renderListAndForm>\n  <no-connections-found\n    (onAction)=\"addConnection()\"\n    *ngIf=\"connections.length === 0 && state !== 'addConnections'\"\n    [header]=\"cardHeader | translate\"\n  ></no-connections-found>\n  <div>\n    <div\n      class=\"card content-fullpage split-view--5-7\"\n      *ngIf=\"connections.length !== 0 || state === 'addConnections'\"\n    >\n      <div class=\"card-header separator grid__col--fullspan\">\n        <div class=\"card-title\">{{ cardHeader | translate }}</div>\n      </div>\n      <div class=\"inner-scroll split-view__list\">\n        <div class=\"bg-level-1 flex-grow\">\n          <c8y-list-group class=\"nav c8y-nav-stacked\">\n            <c8y-li\n              class=\"c8y-stacked-item p-0\"\n              [class.active]=\"connection.name === connectionBeingEdited\"\n              *ngFor=\"let connection of connections; let index = index\"\n              (click)=\"setModel(cloneDeep(connection))\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              <span title=\"{{ connection.name }}\">\n                {{ connection.name }}\n              </span>\n            </c8y-li>\n\n            <c8y-li\n              class=\"c8y-nav-stacked active\"\n              *ngIf=\"state === 'addConnections'\"\n              (click)=\"addConnection()\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              {{ 'New connection' | translate }}\n            </c8y-li>\n          </c8y-list-group>\n        </div>\n        <div class=\"card-footer separator-top\">\n          <button\n            class=\"btn btn-default\"\n            title=\"{{ 'Add connection' | translate }}\"\n            [disabled]=\"state === 'addConnections'\"\n            (click)=\"addConnection()\"\n          >\n            <i [c8yIcon]=\"'plus-circle'\"></i>\n            {{ 'Add connection' | translate }}\n          </button>\n        </div>\n      </div>\n\n      <!-- 'split-view__detail--selected' condition needs to be fixed. this is needed so that both columns are visible in tablet format -->\n\n      <div\n        class=\"inner-scroll split-view__detail\"\n        ng-class=\"{ 'split-view__detail--selected': vm.selected && vm.jsonSchemaObjects }\"\n      >\n        <div class=\"card-header separator visible-sm visible-xs fit-w sticky-top\">\n          <button\n            class=\"btn btn-clean text-primary\"\n            title=\"{{ 'Back' | translate }}\"\n            ng-click=\"vm.deselect()\"\n          >\n            <i [c8yIcon]=\"'chevron-left'\"></i>\n            <span>{{ 'Back' | translate }}</span>\n          </button>\n        </div>\n        <form\n          class=\"d-contents\"\n          #connectorsForm=\"ngForm\"\n        >\n          <div class=\"flex-grow\">\n            <div class=\"card-block large-padding\">\n              <c8y-form-group>\n                <label for=\"name\">\n                  {{ 'Name' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"name\"\n                  name=\"name\"\n                  type=\"text\"\n                  required\n                  [placeholder]=\"'e.g. Sigfox connection' | translate\"\n                  [(ngModel)]=\"connection.name\"\n                  [pattern]=\"namePattern\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    [text]=\"namePatternError\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"description\">\n                  {{ 'Description' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"description\"\n                  name=\"description\"\n                  type=\"text\"\n                  [placeholder]=\"\n                    'e.g. This connection has a built-in functionality to\u2026' | translate\n                  \"\n                  [(ngModel)]=\"connection.description\"\n                />\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"baseUrl\">\n                  {{ 'URL' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"baseUrl\"\n                  name=\"baseUrl\"\n                  type=\"text\"\n                  required\n                  [placeholder]=\"\n                    'e.g. {{ example }}' | translate : { example: 'https://backend.sigfox.com/api' }\n                  \"\n                  [(ngModel)]=\"connection.baseUrl\"\n                />\n              </c8y-form-group>\n              <c8y-form-group>\n                <label for=\"parentGroupId\">\n                  {{ 'Parent group ID' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"parentGroupId\"\n                  name=\"parentGroupId\"\n                  type=\"text\"\n                  required\n                  [placeholder]=\"\n                    'e.g. {{ example }}' | translate : { example: '58c1793b9e93a15370f71caa' }\n                  \"\n                  [(ngModel)]=\"connection.parentGroupId\"\n                  pattern=\"[a-z\\d]+\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    text=\"{{ 'Must be a valid Parent group ID' | translate }}\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"username\">\n                  {{ 'Username' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"username\"\n                  placeholder=\"{{ 'e.g. joe`LOCALIZE`' | translate }}\"\n                  name=\"username\"\n                  type=\"text\"\n                  required\n                  [(ngModel)]=\"connection.username\"\n                />\n              </c8y-form-group>\n              <c8y-form-group *ngIf=\"showPassword\">\n                <label for=\"password\">\n                  {{ 'Password' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"password\"\n                  placeholder=\"{{ 'e.g. my_password' | translate }}\"\n                  name=\"password\"\n                  type=\"password\"\n                  required\n                  [(ngModel)]=\"connection.password\"\n                />\n              </c8y-form-group>\n\n              <button\n                class=\"btn btn-default\"\n                name=\"changePassword\"\n                type=\"button\"\n                *ngIf=\"state === 'updateConnection'\"\n                (click)=\"changePassword()\"\n              >\n                <span\n                  title=\"{{ 'Change password' | translate }}\"\n                  *ngIf=\"!showPassword\"\n                >\n                  {{ 'Change password' | translate }}\n                </span>\n                <span\n                  title=\"{{ 'Cancel password change' | translate }}\"\n                  *ngIf=\"showPassword\"\n                >\n                  {{ 'Cancel password change' | translate }}\n                </span>\n              </button>\n            </div>\n          </div>\n\n          <div class=\"card-footer separator-top\">\n            <button\n              class=\"btn btn-default\"\n              title=\"{{ 'Cancel' | translate }}\"\n              type=\"button\"\n              (click)=\"setModel()\"\n              translate\n            >\n              Cancel\n            </button>\n            <button\n              class=\"btn btn-danger\"\n              title=\"{{ 'Delete' | translate }}\"\n              type=\"button\"\n              data-cy=\"sigfox-multiple-lns-connector.component--delete-connectivity\"\n              *ngIf=\"state === 'updateConnection'\"\n              (click)=\"deleteConnection(originalConnection)\"\n              translate\n            >\n              Delete\n            </button>\n            <button\n              class=\"btn btn-primary\"\n              title=\"{{ 'Save' | translate }}\"\n              data-cy=\"sigfox-multiple-lns-connector.component--save-connectivity\"\n              type=\"submit\"\n              [disabled]=\"!connectorsForm.form.valid || connectorsForm.form.pristine\"\n              (click)=\"save()\"\n              translate\n            >\n              Save\n            </button>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { 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: NoConnectionsFoundComponent, selector: "no-connections-found", inputs: ["header"], outputs: ["onAction"] }, { kind: "component", type: ListGroupComponent, selector: "c8y-list-group" }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i5.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { 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: MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage"] }, { kind: "directive", type: MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { 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: SigfoxMultipleLnsConnectorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'sigfox-multiple-lns-connector', standalone: false, template: "<ng-container *ngIf=\"state === 'loadingConnection'; else renderListAndForm\">\n  <c8y-loading></c8y-loading>\n</ng-container>\n<c8y-title>{{ 'Connectivity' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Settings' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Connectivity' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Sigfox' | translate\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<ng-template #renderListAndForm>\n  <no-connections-found\n    (onAction)=\"addConnection()\"\n    *ngIf=\"connections.length === 0 && state !== 'addConnections'\"\n    [header]=\"cardHeader | translate\"\n  ></no-connections-found>\n  <div>\n    <div\n      class=\"card content-fullpage split-view--5-7\"\n      *ngIf=\"connections.length !== 0 || state === 'addConnections'\"\n    >\n      <div class=\"card-header separator grid__col--fullspan\">\n        <div class=\"card-title\">{{ cardHeader | translate }}</div>\n      </div>\n      <div class=\"inner-scroll split-view__list\">\n        <div class=\"bg-level-1 flex-grow\">\n          <c8y-list-group class=\"nav c8y-nav-stacked\">\n            <c8y-li\n              class=\"c8y-stacked-item p-0\"\n              [class.active]=\"connection.name === connectionBeingEdited\"\n              *ngFor=\"let connection of connections; let index = index\"\n              (click)=\"setModel(cloneDeep(connection))\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              <span title=\"{{ connection.name }}\">\n                {{ connection.name }}\n              </span>\n            </c8y-li>\n\n            <c8y-li\n              class=\"c8y-nav-stacked active\"\n              *ngIf=\"state === 'addConnections'\"\n              (click)=\"addConnection()\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              {{ 'New connection' | translate }}\n            </c8y-li>\n          </c8y-list-group>\n        </div>\n        <div class=\"card-footer separator-top\">\n          <button\n            class=\"btn btn-default\"\n            title=\"{{ 'Add connection' | translate }}\"\n            [disabled]=\"state === 'addConnections'\"\n            (click)=\"addConnection()\"\n          >\n            <i [c8yIcon]=\"'plus-circle'\"></i>\n            {{ 'Add connection' | translate }}\n          </button>\n        </div>\n      </div>\n\n      <!-- 'split-view__detail--selected' condition needs to be fixed. this is needed so that both columns are visible in tablet format -->\n\n      <div\n        class=\"inner-scroll split-view__detail\"\n        ng-class=\"{ 'split-view__detail--selected': vm.selected && vm.jsonSchemaObjects }\"\n      >\n        <div class=\"card-header separator visible-sm visible-xs fit-w sticky-top\">\n          <button\n            class=\"btn btn-clean text-primary\"\n            title=\"{{ 'Back' | translate }}\"\n            ng-click=\"vm.deselect()\"\n          >\n            <i [c8yIcon]=\"'chevron-left'\"></i>\n            <span>{{ 'Back' | translate }}</span>\n          </button>\n        </div>\n        <form\n          class=\"d-contents\"\n          #connectorsForm=\"ngForm\"\n        >\n          <div class=\"flex-grow\">\n            <div class=\"card-block large-padding\">\n              <c8y-form-group>\n                <label for=\"name\">\n                  {{ 'Name' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"name\"\n                  name=\"name\"\n                  type=\"text\"\n                  required\n                  [placeholder]=\"'e.g. Sigfox connection' | translate\"\n                  [(ngModel)]=\"connection.name\"\n                  [pattern]=\"namePattern\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    [text]=\"namePatternError\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"description\">\n                  {{ 'Description' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"description\"\n                  name=\"description\"\n                  type=\"text\"\n                  [placeholder]=\"\n                    'e.g. This connection has a built-in functionality to\u2026' | translate\n                  \"\n                  [(ngModel)]=\"connection.description\"\n                />\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"baseUrl\">\n                  {{ 'URL' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"baseUrl\"\n                  name=\"baseUrl\"\n                  type=\"text\"\n                  required\n                  [placeholder]=\"\n                    'e.g. {{ example }}' | translate : { example: 'https://backend.sigfox.com/api' }\n                  \"\n                  [(ngModel)]=\"connection.baseUrl\"\n                />\n              </c8y-form-group>\n              <c8y-form-group>\n                <label for=\"parentGroupId\">\n                  {{ 'Parent group ID' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"parentGroupId\"\n                  name=\"parentGroupId\"\n                  type=\"text\"\n                  required\n                  [placeholder]=\"\n                    'e.g. {{ example }}' | translate : { example: '58c1793b9e93a15370f71caa' }\n                  \"\n                  [(ngModel)]=\"connection.parentGroupId\"\n                  pattern=\"[a-z\\d]+\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    text=\"{{ 'Must be a valid Parent group ID' | translate }}\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"username\">\n                  {{ 'Username' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"username\"\n                  placeholder=\"{{ 'e.g. joe`LOCALIZE`' | translate }}\"\n                  name=\"username\"\n                  type=\"text\"\n                  required\n                  [(ngModel)]=\"connection.username\"\n                />\n              </c8y-form-group>\n              <c8y-form-group *ngIf=\"showPassword\">\n                <label for=\"password\">\n                  {{ 'Password' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"password\"\n                  placeholder=\"{{ 'e.g. my_password' | translate }}\"\n                  name=\"password\"\n                  type=\"password\"\n                  required\n                  [(ngModel)]=\"connection.password\"\n                />\n              </c8y-form-group>\n\n              <button\n                class=\"btn btn-default\"\n                name=\"changePassword\"\n                type=\"button\"\n                *ngIf=\"state === 'updateConnection'\"\n                (click)=\"changePassword()\"\n              >\n                <span\n                  title=\"{{ 'Change password' | translate }}\"\n                  *ngIf=\"!showPassword\"\n                >\n                  {{ 'Change password' | translate }}\n                </span>\n                <span\n                  title=\"{{ 'Cancel password change' | translate }}\"\n                  *ngIf=\"showPassword\"\n                >\n                  {{ 'Cancel password change' | translate }}\n                </span>\n              </button>\n            </div>\n          </div>\n\n          <div class=\"card-footer separator-top\">\n            <button\n              class=\"btn btn-default\"\n              title=\"{{ 'Cancel' | translate }}\"\n              type=\"button\"\n              (click)=\"setModel()\"\n              translate\n            >\n              Cancel\n            </button>\n            <button\n              class=\"btn btn-danger\"\n              title=\"{{ 'Delete' | translate }}\"\n              type=\"button\"\n              data-cy=\"sigfox-multiple-lns-connector.component--delete-connectivity\"\n              *ngIf=\"state === 'updateConnection'\"\n              (click)=\"deleteConnection(originalConnection)\"\n              translate\n            >\n              Delete\n            </button>\n            <button\n              class=\"btn btn-primary\"\n              title=\"{{ 'Save' | translate }}\"\n              data-cy=\"sigfox-multiple-lns-connector.component--save-connectivity\"\n              type=\"submit\"\n              [disabled]=\"!connectorsForm.form.valid || connectorsForm.form.pristine\"\n              (click)=\"save()\"\n              translate\n            >\n              Save\n            </button>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</ng-template>\n" }]
+            args: [{ selector: 'sigfox-multiple-lns-connector', imports: [
+                        NgIf,
+                        LoadingComponent,
+                        TitleComponent,
+                        BreadcrumbComponent,
+                        BreadcrumbItemComponent,
+                        NoConnectionsFoundComponent,
+                        ListGroupComponent,
+                        NgFor,
+                        ListItemComponent,
+                        ListItemIconComponent,
+                        IconDirective,
+                        FormsModule,
+                        FormGroupComponent,
+                        RequiredInputPlaceholderDirective,
+                        MessagesComponent,
+                        MessageDirective,
+                        C8yTranslateDirective,
+                        C8yTranslatePipe
+                    ], template: "<ng-container *ngIf=\"state === 'loadingConnection'; else renderListAndForm\">\n  <c8y-loading></c8y-loading>\n</ng-container>\n<c8y-title>{{ 'Connectivity' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Settings' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Connectivity' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Sigfox' | translate\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<ng-template #renderListAndForm>\n  <no-connections-found\n    (onAction)=\"addConnection()\"\n    *ngIf=\"connections.length === 0 && state !== 'addConnections'\"\n    [header]=\"cardHeader | translate\"\n  ></no-connections-found>\n  <div>\n    <div\n      class=\"card content-fullpage split-view--5-7\"\n      *ngIf=\"connections.length !== 0 || state === 'addConnections'\"\n    >\n      <div class=\"card-header separator grid__col--fullspan\">\n        <div class=\"card-title\">{{ cardHeader | translate }}</div>\n      </div>\n      <div class=\"inner-scroll split-view__list\">\n        <div class=\"bg-level-1 flex-grow\">\n          <c8y-list-group class=\"nav c8y-nav-stacked\">\n            <c8y-li\n              class=\"c8y-stacked-item p-0\"\n              [class.active]=\"connection.name === connectionBeingEdited\"\n              *ngFor=\"let connection of connections; let index = index\"\n              (click)=\"setModel(cloneDeep(connection))\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              <span title=\"{{ connection.name }}\">\n                {{ connection.name }}\n              </span>\n            </c8y-li>\n\n            <c8y-li\n              class=\"c8y-nav-stacked active\"\n              *ngIf=\"state === 'addConnections'\"\n              (click)=\"addConnection()\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              {{ 'New connection' | translate }}\n            </c8y-li>\n          </c8y-list-group>\n        </div>\n        <div class=\"card-footer separator-top\">\n          <button\n            class=\"btn btn-default\"\n            title=\"{{ 'Add connection' | translate }}\"\n            [disabled]=\"state === 'addConnections'\"\n            (click)=\"addConnection()\"\n          >\n            <i [c8yIcon]=\"'plus-circle'\"></i>\n            {{ 'Add connection' | translate }}\n          </button>\n        </div>\n      </div>\n\n      <!-- 'split-view__detail--selected' condition needs to be fixed. this is needed so that both columns are visible in tablet format -->\n\n      <div\n        class=\"inner-scroll split-view__detail\"\n        ng-class=\"{ 'split-view__detail--selected': vm.selected && vm.jsonSchemaObjects }\"\n      >\n        <div class=\"card-header separator visible-sm visible-xs fit-w sticky-top\">\n          <button\n            class=\"btn btn-clean text-primary\"\n            title=\"{{ 'Back' | translate }}\"\n            ng-click=\"vm.deselect()\"\n          >\n            <i [c8yIcon]=\"'chevron-left'\"></i>\n            <span>{{ 'Back' | translate }}</span>\n          </button>\n        </div>\n        <form\n          class=\"d-contents\"\n          #connectorsForm=\"ngForm\"\n        >\n          <div class=\"flex-grow\">\n            <div class=\"card-block large-padding\">\n              <c8y-form-group>\n                <label for=\"name\">\n                  {{ 'Name' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"name\"\n                  name=\"name\"\n                  type=\"text\"\n                  required\n                  [placeholder]=\"'e.g. Sigfox connection' | translate\"\n                  [(ngModel)]=\"connection.name\"\n                  [pattern]=\"namePattern\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    [text]=\"namePatternError\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"description\">\n                  {{ 'Description' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"description\"\n                  name=\"description\"\n                  type=\"text\"\n                  [placeholder]=\"\n                    'e.g. This connection has a built-in functionality to\u2026' | translate\n                  \"\n                  [(ngModel)]=\"connection.description\"\n                />\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"baseUrl\">\n                  {{ 'URL' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"baseUrl\"\n                  name=\"baseUrl\"\n                  type=\"text\"\n                  required\n                  [placeholder]=\"\n                    'e.g. {{ example }}' | translate : { example: 'https://backend.sigfox.com/api' }\n                  \"\n                  [(ngModel)]=\"connection.baseUrl\"\n                />\n              </c8y-form-group>\n              <c8y-form-group>\n                <label for=\"parentGroupId\">\n                  {{ 'Parent group ID' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"parentGroupId\"\n                  name=\"parentGroupId\"\n                  type=\"text\"\n                  required\n                  [placeholder]=\"\n                    'e.g. {{ example }}' | translate : { example: '58c1793b9e93a15370f71caa' }\n                  \"\n                  [(ngModel)]=\"connection.parentGroupId\"\n                  pattern=\"[a-z\\d]+\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    text=\"{{ 'Must be a valid Parent group ID' | translate }}\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"username\">\n                  {{ 'Username' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"username\"\n                  placeholder=\"{{ 'e.g. joe`LOCALIZE`' | translate }}\"\n                  name=\"username\"\n                  type=\"text\"\n                  required\n                  [(ngModel)]=\"connection.username\"\n                />\n              </c8y-form-group>\n              <c8y-form-group *ngIf=\"showPassword\">\n                <label for=\"password\">\n                  {{ 'Password' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"password\"\n                  placeholder=\"{{ 'e.g. my_password' | translate }}\"\n                  name=\"password\"\n                  type=\"password\"\n                  required\n                  [(ngModel)]=\"connection.password\"\n                />\n              </c8y-form-group>\n\n              <button\n                class=\"btn btn-default\"\n                name=\"changePassword\"\n                type=\"button\"\n                *ngIf=\"state === 'updateConnection'\"\n                (click)=\"changePassword()\"\n              >\n                <span\n                  title=\"{{ 'Change password' | translate }}\"\n                  *ngIf=\"!showPassword\"\n                >\n                  {{ 'Change password' | translate }}\n                </span>\n                <span\n                  title=\"{{ 'Cancel password change' | translate }}\"\n                  *ngIf=\"showPassword\"\n                >\n                  {{ 'Cancel password change' | translate }}\n                </span>\n              </button>\n            </div>\n          </div>\n\n          <div class=\"card-footer separator-top\">\n            <button\n              class=\"btn btn-default\"\n              title=\"{{ 'Cancel' | translate }}\"\n              type=\"button\"\n              (click)=\"setModel()\"\n              translate\n            >\n              Cancel\n            </button>\n            <button\n              class=\"btn btn-danger\"\n              title=\"{{ 'Delete' | translate }}\"\n              type=\"button\"\n              data-cy=\"sigfox-multiple-lns-connector.component--delete-connectivity\"\n              *ngIf=\"state === 'updateConnection'\"\n              (click)=\"deleteConnection(originalConnection)\"\n              translate\n            >\n              Delete\n            </button>\n            <button\n              class=\"btn btn-primary\"\n              title=\"{{ 'Save' | translate }}\"\n              data-cy=\"sigfox-multiple-lns-connector.component--save-connectivity\"\n              type=\"submit\"\n              [disabled]=\"!connectorsForm.form.valid || connectorsForm.form.pristine\"\n              (click)=\"save()\"\n              translate\n            >\n              Save\n            </button>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</ng-template>\n" }]
         }], ctorParameters: () => [{ type: MultipleLnsConnectorService }, { type: i2.AlertService }, { type: i3.TranslateService }, { type: i4.BsModalService }, { type: i2.ModalService }], propDecorators: { connectorsForm: [{
                 type: ViewChild,
                 args: ['connectorsForm', { static: false }]
@@ -517,11 +537,30 @@ class ActilityMultipleLnsConnectorComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ActilityMultipleLnsConnectorComponent, deps: [{ token: MultipleLnsConnectorService }, { token: i2.AlertService }, { token: i3.TranslateService }, { token: i2.ModalService }, { token: i4.BsModalService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ActilityMultipleLnsConnectorComponent, isStandalone: false, selector: "actility-multiple-lns-connector", viewQueries: [{ propertyName: "connectorsForm", first: true, predicate: ["connectorsForm"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"state === 'loadingConnection'; else renderListAndForm\">\n  <c8y-loading></c8y-loading>\n</ng-container>\n\n<c8y-title>{{ 'Connectivity' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [label]=\"'Settings' | translate\"\n    [icon]=\"'cog'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Connectivity' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Actility' | translate\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<ng-template #renderListAndForm>\n  <no-connections-found\n    (onAction)=\"addConnection()\"\n    *ngIf=\"connections.length === 0 && state !== 'addConnections'\"\n    [header]=\"cardHeader | translate\"\n  ></no-connections-found>\n  <div>\n    <div\n      class=\"card content-fullpage split-view--5-7\"\n      *ngIf=\"connections.length !== 0 || state === 'addConnections'\"\n    >\n      <div class=\"card-header separator grid__col--fullspan\">\n        <div class=\"card-title\">{{ cardHeader | translate }}</div>\n      </div>\n      <div class=\"inner-scroll split-view__list\">\n        <div class=\"bg-level-1 flex-grow\">\n          <c8y-list-group class=\"nav c8y-nav-stacked\">\n            <c8y-li\n              class=\"c8y-stacked-item p-0\"\n              [class.active]=\"connection.name === connectionBeingEdited\"\n              *ngFor=\"let connection of connections; let index = index\"\n              (click)=\"setModel(connection)\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              <span title=\"{{ connection.name }}\">\n                {{ connection.name }}\n              </span>\n            </c8y-li>\n\n            <c8y-li\n              *ngIf=\"state === 'addConnections'\"\n              class=\"c8y-nav-stacked active\"\n              (click)=\"addConnection()\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              {{ 'New connection' | translate }}\n            </c8y-li>\n          </c8y-list-group>\n        </div>\n        <div class=\"card-footer separator-top\">\n          <button\n            [disabled]=\"state === 'addConnections'\"\n            title=\"{{ 'Add connection' | translate }}\"\n            class=\"btn btn-default\"\n            (click)=\"addConnection()\"\n          >\n            <i [c8yIcon]=\"'plus-circle'\"></i>\n            {{ 'Add connection' | translate }}\n          </button>\n        </div>\n      </div>\n\n      <!-- 'split-view__detail--selected' condition needs to be fixed. this is needed so that both columns are visible in tablet format -->\n\n      <div\n        class=\"inner-scroll split-view__detail\"\n        ng-class=\"{ 'split-view__detail--selected': vm.selected && vm.jsonSchemaObjects }\"\n      >\n        <div class=\"card-header separator visible-sm visible-xs fit-w sticky-top\">\n          <button\n            title=\"{{ 'Back' | translate }}\"\n            class=\"btn btn-clean text-primary\"\n            ng-click=\"vm.deselect()\"\n          >\n            <i [c8yIcon]=\"'chevron-left'\"></i>\n            <span>{{ 'Back' | translate }}</span>\n          </button>\n        </div>\n        <form #connectorsForm=\"ngForm\" class=\"d-contents\">\n          <div class=\"flex-grow\">\n            <div class=\"card-block large-padding\">\n              <c8y-form-group>\n                <label for=\"name\">\n                  {{ 'Name' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"'e.g. Actility connection' | translate\"\n                  id=\"name\"\n                  name=\"name\"\n                  [(ngModel)]=\"connection.name\"\n                  required\n                  [pattern]=\"namePattern\"\n                />\n                <c8y-messages>\n                  <c8y-message name=\"pattern\" [text]=\"namePatternError\"></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"description\">\n                  {{ 'Description' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"\n                    'e.g. This connection has a built-in functionality to\u2026' | translate\n                  \"\n                  id=\"description\"\n                  name=\"description\"\n                  [(ngModel)]=\"connection.description\"\n                />\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"baseUrl\">\n                  {{ 'URL' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"\n                    'e.g. {{ example }}' | translate: { example: 'https://dx-api.thingpark.io' }\n                  \"\n                  id=\"baseUrl\"\n                  name=\"baseUrl\"\n                  [(ngModel)]=\"connection.baseUrl\"\n                  required\n                />\n              </c8y-form-group>\n              <c8y-form-group>\n                <label for=\"profileId\">\n                  {{ 'Profile ID' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'dev1-api' }\"\n                  id=\"profileId\"\n                  name=\"profileId\"\n                  [(ngModel)]=\"connection.profileId\"\n                  required\n                />\n              </c8y-form-group>\n              <!-- DM-1171 start-->\n              <c8y-form-group>\n                <label for=\"applicationServerId\">\n                  {{ 'Application server ID' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"'e.g. Application Server' | translate\"\n                  id=\"applicationServerId\"\n                  name=\"applicationServerId\"\n                  [(ngModel)]=\"connection.routeApplicationServerId\"\n                  [required]=\"connection.routeApplicationServerKey ? 'required' : null\"\n                />\n              </c8y-form-group>\n              <c8y-form-group>\n                <label for=\"applicationServerKey\">\n                  {{ 'Application server key' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"\n                    'e.g. {{ example }}'\n                      | translate: { example: '0011AEDF0011AEDF0011AEDF0011AEDF' }\n                  \"\n                  id=\"applicationServerKey\"\n                  name=\"applicationServerKey\"\n                  [(ngModel)]=\"connection.routeApplicationServerKey\"\n                  [required]=\"connection.routeApplicationServerId ? 'required' : null\"\n                  pattern=\"[A-Fa-f0-9]{32}\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    text=\"{{ 'Must be a valid server key' | translate }}\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n              <c8y-form-group>\n                <label for=\"adminApiVersion\">\n                  {{ 'Admin API version' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'v102' }\"\n                  id=\"adminApiVersion\"\n                  name=\"adminApiVersion\"\n                  [(ngModel)]=\"connection.adminApiVersion\"\n                  required\n                  pattern=\"^v\\d+$|latest\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    text=\"{{ 'Must be a valid API version' | translate }}\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"coreApiVersion\">\n                  {{ 'Core API version' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'v121' }\"\n                  id=\"coreApiVersion\"\n                  name=\"coreApiVersion\"\n                  [(ngModel)]=\"connection.coreApiVersion\"\n                  required\n                  pattern=\"^v\\d+$|latest\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    text=\"{{ 'Must be a valid API version' | translate }}\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n              <!-- DM-1171 end-->\n              <c8y-form-group>\n                <label for=\"username\">\n                  {{ 'Username' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  placeholder=\"{{ 'e.g. joe`LOCALIZE`' | translate }}\"\n                  id=\"username\"\n                  name=\"username\"\n                  [(ngModel)]=\"connection.username\"\n                  required\n                />\n              </c8y-form-group>\n\n              <c8y-form-group *ngIf=\"showPassword\">\n                <label for=\"password\">\n                  {{ 'Password' | translate }}\n                </label>\n                <input\n                  type=\"password\"\n                  class=\"form-control\"\n                  placeholder=\"{{ 'e.g. my_password' | translate }}\"\n                  id=\"password\"\n                  name=\"password\"\n                  [(ngModel)]=\"connection.password\"\n                  required\n                />\n              </c8y-form-group>\n              \n              <!-- DM-1254 begins -->\n              <c8y-form-group>\n                <label title=\"{{ 'Connection type' | translate }}\">\n                  {{ 'Connection type' | translate }}\n                </label>\n                <label title=\"{{ 'Thingpark Enterprise' }}\" class=\"c8y-radio radio-inline\">\n                  <input type=\"radio\" name=\"c8y-group\" [value]=\"true\"\n                  [(ngModel)]=\"connection.enterpriseConnection\" required>\n                  <span></span> \n                  <span>{{ 'Thingpark Enterprise' }}</span>\n                </label>\n                <label title=\"{{ 'Thingpark Wireless' }}\" class=\"c8y-radio radio-inline\">\n                  <input type=\"radio\" name=\"c8y-group\" [value]=\"false\"\n                  [(ngModel)]=\"connection.enterpriseConnection\" required>\n                  <span></span> \n                  <span>{{ 'Thingpark Wireless' }}</span>\n                </label>\n              </c8y-form-group>\n              <!-- DM-1254 ends -->\n              <button\n                *ngIf=\"state === 'updateConnection'\"\n                type=\"button\"\n                class=\"btn btn-default\"\n                name=\"changePassword\"\n                (click)=\"changePassword()\"\n              >\n                <span title=\"{{ 'Change password' | translate }}\" *ngIf=\"!showPassword\">\n                  {{ 'Change password' | translate }}\n                </span>\n                <span title=\"{{ 'Cancel password change' | translate }}\" *ngIf=\"showPassword\">\n                  {{ 'Cancel password change' | translate }}\n                </span>\n              </button>\n            </div>\n          </div>\n\n          <div class=\"card-footer separator-top\">\n            <button\n              title=\"{{ 'Cancel' | translate }}\"\n              class=\"btn btn-default\"\n              (click)=\"setModel()\"\n              translate\n              type=\"button\"\n            >\n              Cancel\n            </button>\n            <button\n              *ngIf=\"state === 'updateConnection'\"\n              title=\"{{ 'Delete' | translate }}\"\n              class=\"btn btn-danger\"\n              data-cy=\"actility-multiple-lns-connector--delete-connectivity\"\n              (click)=\"deleteConnection(originalConnection)\"\n              translate\n              type=\"button\"\n            >\n              Delete\n            </button>\n            <button\n              [disabled]=\"!connectorsForm.form.valid || connectorsForm.form.pristine\"\n              title=\"{{ 'Save' | translate }}\"\n              class=\"btn btn-primary\"\n              data-cy=\"actility-multiple-lns-connector.component--save-connectivity\"\n              (click)=\"save()\"\n              translate\n              type=\"submit\"\n            >\n              Save\n            </button>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</ng-template>\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: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "component", type: i2.TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "directive", type: i6.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i6.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: i6.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i6.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i6.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i6.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { 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: "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: NoConnectionsFoundComponent, selector: "no-connections-found", inputs: ["header"], outputs: ["onAction"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ActilityMultipleLnsConnectorComponent, isStandalone: true, selector: "actility-multiple-lns-connector", viewQueries: [{ propertyName: "connectorsForm", first: true, predicate: ["connectorsForm"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"state === 'loadingConnection'; else renderListAndForm\">\n  <c8y-loading></c8y-loading>\n</ng-container>\n\n<c8y-title>{{ 'Connectivity' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [label]=\"'Settings' | translate\"\n    [icon]=\"'cog'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Connectivity' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Actility' | translate\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<ng-template #renderListAndForm>\n  <no-connections-found\n    (onAction)=\"addConnection()\"\n    *ngIf=\"connections.length === 0 && state !== 'addConnections'\"\n    [header]=\"cardHeader | translate\"\n  ></no-connections-found>\n  <div>\n    <div\n      class=\"card content-fullpage split-view--5-7\"\n      *ngIf=\"connections.length !== 0 || state === 'addConnections'\"\n    >\n      <div class=\"card-header separator grid__col--fullspan\">\n        <div class=\"card-title\">{{ cardHeader | translate }}</div>\n      </div>\n      <div class=\"inner-scroll split-view__list\">\n        <div class=\"bg-level-1 flex-grow\">\n          <c8y-list-group class=\"nav c8y-nav-stacked\">\n            <c8y-li\n              class=\"c8y-stacked-item p-0\"\n              [class.active]=\"connection.name === connectionBeingEdited\"\n              *ngFor=\"let connection of connections; let index = index\"\n              (click)=\"setModel(connection)\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              <span title=\"{{ connection.name }}\">\n                {{ connection.name }}\n              </span>\n            </c8y-li>\n\n            <c8y-li\n              *ngIf=\"state === 'addConnections'\"\n              class=\"c8y-nav-stacked active\"\n              (click)=\"addConnection()\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              {{ 'New connection' | translate }}\n            </c8y-li>\n          </c8y-list-group>\n        </div>\n        <div class=\"card-footer separator-top\">\n          <button\n            [disabled]=\"state === 'addConnections'\"\n            title=\"{{ 'Add connection' | translate }}\"\n            class=\"btn btn-default\"\n            (click)=\"addConnection()\"\n          >\n            <i [c8yIcon]=\"'plus-circle'\"></i>\n            {{ 'Add connection' | translate }}\n          </button>\n        </div>\n      </div>\n\n      <!-- 'split-view__detail--selected' condition needs to be fixed. this is needed so that both columns are visible in tablet format -->\n\n      <div\n        class=\"inner-scroll split-view__detail\"\n        ng-class=\"{ 'split-view__detail--selected': vm.selected && vm.jsonSchemaObjects }\"\n      >\n        <div class=\"card-header separator visible-sm visible-xs fit-w sticky-top\">\n          <button\n            title=\"{{ 'Back' | translate }}\"\n            class=\"btn btn-clean text-primary\"\n            ng-click=\"vm.deselect()\"\n          >\n            <i [c8yIcon]=\"'chevron-left'\"></i>\n            <span>{{ 'Back' | translate }}</span>\n          </button>\n        </div>\n        <form #connectorsForm=\"ngForm\" class=\"d-contents\">\n          <div class=\"flex-grow\">\n            <div class=\"card-block large-padding\">\n              <c8y-form-group>\n                <label for=\"name\">\n                  {{ 'Name' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"'e.g. Actility connection' | translate\"\n                  id=\"name\"\n                  name=\"name\"\n                  [(ngModel)]=\"connection.name\"\n                  required\n                  [pattern]=\"namePattern\"\n                />\n                <c8y-messages>\n                  <c8y-message name=\"pattern\" [text]=\"namePatternError\"></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"description\">\n                  {{ 'Description' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"\n                    'e.g. This connection has a built-in functionality to\u2026' | translate\n                  \"\n                  id=\"description\"\n                  name=\"description\"\n                  [(ngModel)]=\"connection.description\"\n                />\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"baseUrl\">\n                  {{ 'URL' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"\n                    'e.g. {{ example }}' | translate: { example: 'https://dx-api.thingpark.io' }\n                  \"\n                  id=\"baseUrl\"\n                  name=\"baseUrl\"\n                  [(ngModel)]=\"connection.baseUrl\"\n                  required\n                />\n              </c8y-form-group>\n              <c8y-form-group>\n                <label for=\"profileId\">\n                  {{ 'Profile ID' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'dev1-api' }\"\n                  id=\"profileId\"\n                  name=\"profileId\"\n                  [(ngModel)]=\"connection.profileId\"\n                  required\n                />\n              </c8y-form-group>\n              <!-- DM-1171 start-->\n              <c8y-form-group>\n                <label for=\"applicationServerId\">\n                  {{ 'Application server ID' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"'e.g. Application Server' | translate\"\n                  id=\"applicationServerId\"\n                  name=\"applicationServerId\"\n                  [(ngModel)]=\"connection.routeApplicationServerId\"\n                  [required]=\"connection.routeApplicationServerKey ? 'required' : null\"\n                />\n              </c8y-form-group>\n              <c8y-form-group>\n                <label for=\"applicationServerKey\">\n                  {{ 'Application server key' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"\n                    'e.g. {{ example }}'\n                      | translate: { example: '0011AEDF0011AEDF0011AEDF0011AEDF' }\n                  \"\n                  id=\"applicationServerKey\"\n                  name=\"applicationServerKey\"\n                  [(ngModel)]=\"connection.routeApplicationServerKey\"\n                  [required]=\"connection.routeApplicationServerId ? 'required' : null\"\n                  pattern=\"[A-Fa-f0-9]{32}\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    text=\"{{ 'Must be a valid server key' | translate }}\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n              <c8y-form-group>\n                <label for=\"adminApiVersion\">\n                  {{ 'Admin API version' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'v102' }\"\n                  id=\"adminApiVersion\"\n                  name=\"adminApiVersion\"\n                  [(ngModel)]=\"connection.adminApiVersion\"\n                  required\n                  pattern=\"^v\\d+$|latest\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    text=\"{{ 'Must be a valid API version' | translate }}\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"coreApiVersion\">\n                  {{ 'Core API version' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'v121' }\"\n                  id=\"coreApiVersion\"\n                  name=\"coreApiVersion\"\n                  [(ngModel)]=\"connection.coreApiVersion\"\n                  required\n                  pattern=\"^v\\d+$|latest\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    text=\"{{ 'Must be a valid API version' | translate }}\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n              <!-- DM-1171 end-->\n              <c8y-form-group>\n                <label for=\"username\">\n                  {{ 'Username' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  placeholder=\"{{ 'e.g. joe`LOCALIZE`' | translate }}\"\n                  id=\"username\"\n                  name=\"username\"\n                  [(ngModel)]=\"connection.username\"\n                  required\n                />\n              </c8y-form-group>\n\n              <c8y-form-group *ngIf=\"showPassword\">\n                <label for=\"password\">\n                  {{ 'Password' | translate }}\n                </label>\n                <input\n                  type=\"password\"\n                  class=\"form-control\"\n                  placeholder=\"{{ 'e.g. my_password' | translate }}\"\n                  id=\"password\"\n                  name=\"password\"\n                  [(ngModel)]=\"connection.password\"\n                  required\n                />\n              </c8y-form-group>\n              \n              <!-- DM-1254 begins -->\n              <c8y-form-group>\n                <label title=\"{{ 'Connection type' | translate }}\">\n                  {{ 'Connection type' | translate }}\n                </label>\n                <label title=\"{{ 'Thingpark Enterprise' }}\" class=\"c8y-radio radio-inline\">\n                  <input type=\"radio\" name=\"c8y-group\" [value]=\"true\"\n                  [(ngModel)]=\"connection.enterpriseConnection\" required>\n                  <span></span> \n                  <span>{{ 'Thingpark Enterprise' }}</span>\n                </label>\n                <label title=\"{{ 'Thingpark Wireless' }}\" class=\"c8y-radio radio-inline\">\n                  <input type=\"radio\" name=\"c8y-group\" [value]=\"false\"\n                  [(ngModel)]=\"connection.enterpriseConnection\" required>\n                  <span></span> \n                  <span>{{ 'Thingpark Wireless' }}</span>\n                </label>\n              </c8y-form-group>\n              <!-- DM-1254 ends -->\n              <button\n                *ngIf=\"state === 'updateConnection'\"\n                type=\"button\"\n                class=\"btn btn-default\"\n                name=\"changePassword\"\n                (click)=\"changePassword()\"\n              >\n                <span title=\"{{ 'Change password' | translate }}\" *ngIf=\"!showPassword\">\n                  {{ 'Change password' | translate }}\n                </span>\n                <span title=\"{{ 'Cancel password change' | translate }}\" *ngIf=\"showPassword\">\n                  {{ 'Cancel password change' | translate }}\n                </span>\n              </button>\n            </div>\n          </div>\n\n          <div class=\"card-footer separator-top\">\n            <button\n              title=\"{{ 'Cancel' | translate }}\"\n              class=\"btn btn-default\"\n              (click)=\"setModel()\"\n              translate\n              type=\"button\"\n            >\n              Cancel\n            </button>\n            <button\n              *ngIf=\"state === 'updateConnection'\"\n              title=\"{{ 'Delete' | translate }}\"\n              class=\"btn btn-danger\"\n              data-cy=\"actility-multiple-lns-connector--delete-connectivity\"\n              (click)=\"deleteConnection(originalConnection)\"\n              translate\n              type=\"button\"\n            >\n              Delete\n            </button>\n            <button\n              [disabled]=\"!connectorsForm.form.valid || connectorsForm.form.pristine\"\n              title=\"{{ 'Save' | translate }}\"\n              class=\"btn btn-primary\"\n              data-cy=\"actility-multiple-lns-connector.component--save-connectivity\"\n              (click)=\"save()\"\n              translate\n              type=\"submit\"\n            >\n              Save\n            </button>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { 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: NoConnectionsFoundComponent, selector: "no-connections-found", inputs: ["header"], outputs: ["onAction"] }, { kind: "component", type: ListGroupComponent, selector: "c8y-list-group" }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.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: i5.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i5.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { 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: MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage"] }, { kind: "directive", type: MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { 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: ActilityMultipleLnsConnectorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'actility-multiple-lns-connector', standalone: false, template: "<ng-container *ngIf=\"state === 'loadingConnection'; else renderListAndForm\">\n  <c8y-loading></c8y-loading>\n</ng-container>\n\n<c8y-title>{{ 'Connectivity' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [label]=\"'Settings' | translate\"\n    [icon]=\"'cog'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Connectivity' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Actility' | translate\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<ng-template #renderListAndForm>\n  <no-connections-found\n    (onAction)=\"addConnection()\"\n    *ngIf=\"connections.length === 0 && state !== 'addConnections'\"\n    [header]=\"cardHeader | translate\"\n  ></no-connections-found>\n  <div>\n    <div\n      class=\"card content-fullpage split-view--5-7\"\n      *ngIf=\"connections.length !== 0 || state === 'addConnections'\"\n    >\n      <div class=\"card-header separator grid__col--fullspan\">\n        <div class=\"card-title\">{{ cardHeader | translate }}</div>\n      </div>\n      <div class=\"inner-scroll split-view__list\">\n        <div class=\"bg-level-1 flex-grow\">\n          <c8y-list-group class=\"nav c8y-nav-stacked\">\n            <c8y-li\n              class=\"c8y-stacked-item p-0\"\n              [class.active]=\"connection.name === connectionBeingEdited\"\n              *ngFor=\"let connection of connections; let index = index\"\n              (click)=\"setModel(connection)\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              <span title=\"{{ connection.name }}\">\n                {{ connection.name }}\n              </span>\n            </c8y-li>\n\n            <c8y-li\n              *ngIf=\"state === 'addConnections'\"\n              class=\"c8y-nav-stacked active\"\n              (click)=\"addConnection()\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              {{ 'New connection' | translate }}\n            </c8y-li>\n          </c8y-list-group>\n        </div>\n        <div class=\"card-footer separator-top\">\n          <button\n            [disabled]=\"state === 'addConnections'\"\n            title=\"{{ 'Add connection' | translate }}\"\n            class=\"btn btn-default\"\n            (click)=\"addConnection()\"\n          >\n            <i [c8yIcon]=\"'plus-circle'\"></i>\n            {{ 'Add connection' | translate }}\n          </button>\n        </div>\n      </div>\n\n      <!-- 'split-view__detail--selected' condition needs to be fixed. this is needed so that both columns are visible in tablet format -->\n\n      <div\n        class=\"inner-scroll split-view__detail\"\n        ng-class=\"{ 'split-view__detail--selected': vm.selected && vm.jsonSchemaObjects }\"\n      >\n        <div class=\"card-header separator visible-sm visible-xs fit-w sticky-top\">\n          <button\n            title=\"{{ 'Back' | translate }}\"\n            class=\"btn btn-clean text-primary\"\n            ng-click=\"vm.deselect()\"\n          >\n            <i [c8yIcon]=\"'chevron-left'\"></i>\n            <span>{{ 'Back' | translate }}</span>\n          </button>\n        </div>\n        <form #connectorsForm=\"ngForm\" class=\"d-contents\">\n          <div class=\"flex-grow\">\n            <div class=\"card-block large-padding\">\n              <c8y-form-group>\n                <label for=\"name\">\n                  {{ 'Name' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"'e.g. Actility connection' | translate\"\n                  id=\"name\"\n                  name=\"name\"\n                  [(ngModel)]=\"connection.name\"\n                  required\n                  [pattern]=\"namePattern\"\n                />\n                <c8y-messages>\n                  <c8y-message name=\"pattern\" [text]=\"namePatternError\"></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"description\">\n                  {{ 'Description' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"\n                    'e.g. This connection has a built-in functionality to\u2026' | translate\n                  \"\n                  id=\"description\"\n                  name=\"description\"\n                  [(ngModel)]=\"connection.description\"\n                />\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"baseUrl\">\n                  {{ 'URL' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"\n                    'e.g. {{ example }}' | translate: { example: 'https://dx-api.thingpark.io' }\n                  \"\n                  id=\"baseUrl\"\n                  name=\"baseUrl\"\n                  [(ngModel)]=\"connection.baseUrl\"\n                  required\n                />\n              </c8y-form-group>\n              <c8y-form-group>\n                <label for=\"profileId\">\n                  {{ 'Profile ID' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'dev1-api' }\"\n                  id=\"profileId\"\n                  name=\"profileId\"\n                  [(ngModel)]=\"connection.profileId\"\n                  required\n                />\n              </c8y-form-group>\n              <!-- DM-1171 start-->\n              <c8y-form-group>\n                <label for=\"applicationServerId\">\n                  {{ 'Application server ID' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"'e.g. Application Server' | translate\"\n                  id=\"applicationServerId\"\n                  name=\"applicationServerId\"\n                  [(ngModel)]=\"connection.routeApplicationServerId\"\n                  [required]=\"connection.routeApplicationServerKey ? 'required' : null\"\n                />\n              </c8y-form-group>\n              <c8y-form-group>\n                <label for=\"applicationServerKey\">\n                  {{ 'Application server key' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"\n                    'e.g. {{ example }}'\n                      | translate: { example: '0011AEDF0011AEDF0011AEDF0011AEDF' }\n                  \"\n                  id=\"applicationServerKey\"\n                  name=\"applicationServerKey\"\n                  [(ngModel)]=\"connection.routeApplicationServerKey\"\n                  [required]=\"connection.routeApplicationServerId ? 'required' : null\"\n                  pattern=\"[A-Fa-f0-9]{32}\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    text=\"{{ 'Must be a valid server key' | translate }}\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n              <c8y-form-group>\n                <label for=\"adminApiVersion\">\n                  {{ 'Admin API version' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'v102' }\"\n                  id=\"adminApiVersion\"\n                  name=\"adminApiVersion\"\n                  [(ngModel)]=\"connection.adminApiVersion\"\n                  required\n                  pattern=\"^v\\d+$|latest\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    text=\"{{ 'Must be a valid API version' | translate }}\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"coreApiVersion\">\n                  {{ 'Core API version' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'v121' }\"\n                  id=\"coreApiVersion\"\n                  name=\"coreApiVersion\"\n                  [(ngModel)]=\"connection.coreApiVersion\"\n                  required\n                  pattern=\"^v\\d+$|latest\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    text=\"{{ 'Must be a valid API version' | translate }}\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n              <!-- DM-1171 end-->\n              <c8y-form-group>\n                <label for=\"username\">\n                  {{ 'Username' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  placeholder=\"{{ 'e.g. joe`LOCALIZE`' | translate }}\"\n                  id=\"username\"\n                  name=\"username\"\n                  [(ngModel)]=\"connection.username\"\n                  required\n                />\n              </c8y-form-group>\n\n              <c8y-form-group *ngIf=\"showPassword\">\n                <label for=\"password\">\n                  {{ 'Password' | translate }}\n                </label>\n                <input\n                  type=\"password\"\n                  class=\"form-control\"\n                  placeholder=\"{{ 'e.g. my_password' | translate }}\"\n                  id=\"password\"\n                  name=\"password\"\n                  [(ngModel)]=\"connection.password\"\n                  required\n                />\n              </c8y-form-group>\n              \n              <!-- DM-1254 begins -->\n              <c8y-form-group>\n                <label title=\"{{ 'Connection type' | translate }}\">\n                  {{ 'Connection type' | translate }}\n                </label>\n                <label title=\"{{ 'Thingpark Enterprise' }}\" class=\"c8y-radio radio-inline\">\n                  <input type=\"radio\" name=\"c8y-group\" [value]=\"true\"\n                  [(ngModel)]=\"connection.enterpriseConnection\" required>\n                  <span></span> \n                  <span>{{ 'Thingpark Enterprise' }}</span>\n                </label>\n                <label title=\"{{ 'Thingpark Wireless' }}\" class=\"c8y-radio radio-inline\">\n                  <input type=\"radio\" name=\"c8y-group\" [value]=\"false\"\n                  [(ngModel)]=\"connection.enterpriseConnection\" required>\n                  <span></span> \n                  <span>{{ 'Thingpark Wireless' }}</span>\n                </label>\n              </c8y-form-group>\n              <!-- DM-1254 ends -->\n              <button\n                *ngIf=\"state === 'updateConnection'\"\n                type=\"button\"\n                class=\"btn btn-default\"\n                name=\"changePassword\"\n                (click)=\"changePassword()\"\n              >\n                <span title=\"{{ 'Change password' | translate }}\" *ngIf=\"!showPassword\">\n                  {{ 'Change password' | translate }}\n                </span>\n                <span title=\"{{ 'Cancel password change' | translate }}\" *ngIf=\"showPassword\">\n                  {{ 'Cancel password change' | translate }}\n                </span>\n              </button>\n            </div>\n          </div>\n\n          <div class=\"card-footer separator-top\">\n            <button\n              title=\"{{ 'Cancel' | translate }}\"\n              class=\"btn btn-default\"\n              (click)=\"setModel()\"\n              translate\n              type=\"button\"\n            >\n              Cancel\n            </button>\n            <button\n              *ngIf=\"state === 'updateConnection'\"\n              title=\"{{ 'Delete' | translate }}\"\n              class=\"btn btn-danger\"\n              data-cy=\"actility-multiple-lns-connector--delete-connectivity\"\n              (click)=\"deleteConnection(originalConnection)\"\n              translate\n              type=\"button\"\n            >\n              Delete\n            </button>\n            <button\n              [disabled]=\"!connectorsForm.form.valid || connectorsForm.form.pristine\"\n              title=\"{{ 'Save' | translate }}\"\n              class=\"btn btn-primary\"\n              data-cy=\"actility-multiple-lns-connector.component--save-connectivity\"\n              (click)=\"save()\"\n              translate\n              type=\"submit\"\n            >\n              Save\n            </button>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</ng-template>\n" }]
+            args: [{ selector: 'actility-multiple-lns-connector', imports: [
+                        NgIf,
+                        LoadingComponent,
+                        TitleComponent,
+                        BreadcrumbComponent,
+                        BreadcrumbItemComponent,
+                        NoConnectionsFoundComponent,
+                        ListGroupComponent,
+                        NgFor,
+                        ListItemComponent,
+                        ListItemIconComponent,
+                        IconDirective,
+                        FormsModule,
+                        FormGroupComponent,
+                        RequiredInputPlaceholderDirective,
+                        MessagesComponent,
+                        MessageDirective,
+                        C8yTranslateDirective,
+                        C8yTranslatePipe
+                    ], template: "<ng-container *ngIf=\"state === 'loadingConnection'; else renderListAndForm\">\n  <c8y-loading></c8y-loading>\n</ng-container>\n\n<c8y-title>{{ 'Connectivity' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [label]=\"'Settings' | translate\"\n    [icon]=\"'cog'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Connectivity' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Actility' | translate\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<ng-template #renderListAndForm>\n  <no-connections-found\n    (onAction)=\"addConnection()\"\n    *ngIf=\"connections.length === 0 && state !== 'addConnections'\"\n    [header]=\"cardHeader | translate\"\n  ></no-connections-found>\n  <div>\n    <div\n      class=\"card content-fullpage split-view--5-7\"\n      *ngIf=\"connections.length !== 0 || state === 'addConnections'\"\n    >\n      <div class=\"card-header separator grid__col--fullspan\">\n        <div class=\"card-title\">{{ cardHeader | translate }}</div>\n      </div>\n      <div class=\"inner-scroll split-view__list\">\n        <div class=\"bg-level-1 flex-grow\">\n          <c8y-list-group class=\"nav c8y-nav-stacked\">\n            <c8y-li\n              class=\"c8y-stacked-item p-0\"\n              [class.active]=\"connection.name === connectionBeingEdited\"\n              *ngFor=\"let connection of connections; let index = index\"\n              (click)=\"setModel(connection)\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              <span title=\"{{ connection.name }}\">\n                {{ connection.name }}\n              </span>\n            </c8y-li>\n\n            <c8y-li\n              *ngIf=\"state === 'addConnections'\"\n              class=\"c8y-nav-stacked active\"\n              (click)=\"addConnection()\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              {{ 'New connection' | translate }}\n            </c8y-li>\n          </c8y-list-group>\n        </div>\n        <div class=\"card-footer separator-top\">\n          <button\n            [disabled]=\"state === 'addConnections'\"\n            title=\"{{ 'Add connection' | translate }}\"\n            class=\"btn btn-default\"\n            (click)=\"addConnection()\"\n          >\n            <i [c8yIcon]=\"'plus-circle'\"></i>\n            {{ 'Add connection' | translate }}\n          </button>\n        </div>\n      </div>\n\n      <!-- 'split-view__detail--selected' condition needs to be fixed. this is needed so that both columns are visible in tablet format -->\n\n      <div\n        class=\"inner-scroll split-view__detail\"\n        ng-class=\"{ 'split-view__detail--selected': vm.selected && vm.jsonSchemaObjects }\"\n      >\n        <div class=\"card-header separator visible-sm visible-xs fit-w sticky-top\">\n          <button\n            title=\"{{ 'Back' | translate }}\"\n            class=\"btn btn-clean text-primary\"\n            ng-click=\"vm.deselect()\"\n          >\n            <i [c8yIcon]=\"'chevron-left'\"></i>\n            <span>{{ 'Back' | translate }}</span>\n          </button>\n        </div>\n        <form #connectorsForm=\"ngForm\" class=\"d-contents\">\n          <div class=\"flex-grow\">\n            <div class=\"card-block large-padding\">\n              <c8y-form-group>\n                <label for=\"name\">\n                  {{ 'Name' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"'e.g. Actility connection' | translate\"\n                  id=\"name\"\n                  name=\"name\"\n                  [(ngModel)]=\"connection.name\"\n                  required\n                  [pattern]=\"namePattern\"\n                />\n                <c8y-messages>\n                  <c8y-message name=\"pattern\" [text]=\"namePatternError\"></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"description\">\n                  {{ 'Description' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"\n                    'e.g. This connection has a built-in functionality to\u2026' | translate\n                  \"\n                  id=\"description\"\n                  name=\"description\"\n                  [(ngModel)]=\"connection.description\"\n                />\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"baseUrl\">\n                  {{ 'URL' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"\n                    'e.g. {{ example }}' | translate: { example: 'https://dx-api.thingpark.io' }\n                  \"\n                  id=\"baseUrl\"\n                  name=\"baseUrl\"\n                  [(ngModel)]=\"connection.baseUrl\"\n                  required\n                />\n              </c8y-form-group>\n              <c8y-form-group>\n                <label for=\"profileId\">\n                  {{ 'Profile ID' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'dev1-api' }\"\n                  id=\"profileId\"\n                  name=\"profileId\"\n                  [(ngModel)]=\"connection.profileId\"\n                  required\n                />\n              </c8y-form-group>\n              <!-- DM-1171 start-->\n              <c8y-form-group>\n                <label for=\"applicationServerId\">\n                  {{ 'Application server ID' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"'e.g. Application Server' | translate\"\n                  id=\"applicationServerId\"\n                  name=\"applicationServerId\"\n                  [(ngModel)]=\"connection.routeApplicationServerId\"\n                  [required]=\"connection.routeApplicationServerKey ? 'required' : null\"\n                />\n              </c8y-form-group>\n              <c8y-form-group>\n                <label for=\"applicationServerKey\">\n                  {{ 'Application server key' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"\n                    'e.g. {{ example }}'\n                      | translate: { example: '0011AEDF0011AEDF0011AEDF0011AEDF' }\n                  \"\n                  id=\"applicationServerKey\"\n                  name=\"applicationServerKey\"\n                  [(ngModel)]=\"connection.routeApplicationServerKey\"\n                  [required]=\"connection.routeApplicationServerId ? 'required' : null\"\n                  pattern=\"[A-Fa-f0-9]{32}\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    text=\"{{ 'Must be a valid server key' | translate }}\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n              <c8y-form-group>\n                <label for=\"adminApiVersion\">\n                  {{ 'Admin API version' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'v102' }\"\n                  id=\"adminApiVersion\"\n                  name=\"adminApiVersion\"\n                  [(ngModel)]=\"connection.adminApiVersion\"\n                  required\n                  pattern=\"^v\\d+$|latest\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    text=\"{{ 'Must be a valid API version' | translate }}\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"coreApiVersion\">\n                  {{ 'Core API version' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'v121' }\"\n                  id=\"coreApiVersion\"\n                  name=\"coreApiVersion\"\n                  [(ngModel)]=\"connection.coreApiVersion\"\n                  required\n                  pattern=\"^v\\d+$|latest\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    text=\"{{ 'Must be a valid API version' | translate }}\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n              <!-- DM-1171 end-->\n              <c8y-form-group>\n                <label for=\"username\">\n                  {{ 'Username' | translate }}\n                </label>\n                <input\n                  type=\"text\"\n                  class=\"form-control\"\n                  placeholder=\"{{ 'e.g. joe`LOCALIZE`' | translate }}\"\n                  id=\"username\"\n                  name=\"username\"\n                  [(ngModel)]=\"connection.username\"\n                  required\n                />\n              </c8y-form-group>\n\n              <c8y-form-group *ngIf=\"showPassword\">\n                <label for=\"password\">\n                  {{ 'Password' | translate }}\n                </label>\n                <input\n                  type=\"password\"\n                  class=\"form-control\"\n                  placeholder=\"{{ 'e.g. my_password' | translate }}\"\n                  id=\"password\"\n                  name=\"password\"\n                  [(ngModel)]=\"connection.password\"\n                  required\n                />\n              </c8y-form-group>\n              \n              <!-- DM-1254 begins -->\n              <c8y-form-group>\n                <label title=\"{{ 'Connection type' | translate }}\">\n                  {{ 'Connection type' | translate }}\n                </label>\n                <label title=\"{{ 'Thingpark Enterprise' }}\" class=\"c8y-radio radio-inline\">\n                  <input type=\"radio\" name=\"c8y-group\" [value]=\"true\"\n                  [(ngModel)]=\"connection.enterpriseConnection\" required>\n                  <span></span> \n                  <span>{{ 'Thingpark Enterprise' }}</span>\n                </label>\n                <label title=\"{{ 'Thingpark Wireless' }}\" class=\"c8y-radio radio-inline\">\n                  <input type=\"radio\" name=\"c8y-group\" [value]=\"false\"\n                  [(ngModel)]=\"connection.enterpriseConnection\" required>\n                  <span></span> \n                  <span>{{ 'Thingpark Wireless' }}</span>\n                </label>\n              </c8y-form-group>\n              <!-- DM-1254 ends -->\n              <button\n                *ngIf=\"state === 'updateConnection'\"\n                type=\"button\"\n                class=\"btn btn-default\"\n                name=\"changePassword\"\n                (click)=\"changePassword()\"\n              >\n                <span title=\"{{ 'Change password' | translate }}\" *ngIf=\"!showPassword\">\n                  {{ 'Change password' | translate }}\n                </span>\n                <span title=\"{{ 'Cancel password change' | translate }}\" *ngIf=\"showPassword\">\n                  {{ 'Cancel password change' | translate }}\n                </span>\n              </button>\n            </div>\n          </div>\n\n          <div class=\"card-footer separator-top\">\n            <button\n              title=\"{{ 'Cancel' | translate }}\"\n              class=\"btn btn-default\"\n              (click)=\"setModel()\"\n              translate\n              type=\"button\"\n            >\n              Cancel\n            </button>\n            <button\n              *ngIf=\"state === 'updateConnection'\"\n              title=\"{{ 'Delete' | translate }}\"\n              class=\"btn btn-danger\"\n              data-cy=\"actility-multiple-lns-connector--delete-connectivity\"\n              (click)=\"deleteConnection(originalConnection)\"\n              translate\n              type=\"button\"\n            >\n              Delete\n            </button>\n            <button\n              [disabled]=\"!connectorsForm.form.valid || connectorsForm.form.pristine\"\n              title=\"{{ 'Save' | translate }}\"\n              class=\"btn btn-primary\"\n              data-cy=\"actility-multiple-lns-connector.component--save-connectivity\"\n              (click)=\"save()\"\n              translate\n              type=\"submit\"\n            >\n              Save\n            </button>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</ng-template>\n" }]
         }], ctorParameters: () => [{ type: MultipleLnsConnectorService }, { type: i2.AlertService }, { type: i3.TranslateService }, { type: i2.ModalService }, { type: i4.BsModalService }], propDecorators: { connectorsForm: [{
                 type: ViewChild,
                 args: ['connectorsForm', { static: false }]
@@ -681,11 +720,30 @@ class LoriotMultipleLnsConnectorComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: LoriotMultipleLnsConnectorComponent, deps: [{ token: MultipleLnsConnectorService }, { token: i2.AlertService }, { token: i3.TranslateService }, { token: i4.BsModalService }, { token: i2.ModalService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: LoriotMultipleLnsConnectorComponent, isStandalone: false, selector: "loriot-multiple-lns-connector", viewQueries: [{ propertyName: "connectorsForm", first: true, predicate: ["connectorsForm"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"state === 'loadingConnection'; else renderListAndForm\">\n  <c8y-loading></c8y-loading>\n</ng-container>\n\n<c8y-title>{{ 'Connectivity' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Settings' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Connectivity' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'LORIOT' | translate\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<ng-template #renderListAndForm>\n  <no-connections-found\n    (onAction)=\"addConnection()\"\n    *ngIf=\"connections.length === 0 && state !== 'addConnections'\"\n    [header]=\"cardHeader | translate\"\n  ></no-connections-found>\n  <div>\n    <div\n      class=\"card content-fullpage split-view--5-7\"\n      *ngIf=\"connections.length !== 0 || state === 'addConnections'\"\n    >\n      <div class=\"card-header separator grid__col--fullspan\">\n        <div class=\"card-title\">{{ cardHeader | translate }}</div>\n      </div>\n      <div class=\"inner-scroll split-view__list\">\n        <div class=\"bg-gray-white flex-grow\">\n          <c8y-list-group class=\"nav c8y-nav-stacked\">\n            <c8y-li\n              class=\"c8y-stacked-item p-0\"\n              [class.active]=\"connection.name === connectionBeingEdited\"\n              *ngFor=\"let connection of connections; let index = index\"\n              (click)=\"setModel(cloneDeep(connection))\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              <span title=\"{{ connection.name }}\">\n                {{ connection.name }}\n              </span>\n            </c8y-li>\n\n            <c8y-li\n              class=\"c8y-nav-stacked active\"\n              *ngIf=\"state === 'addConnections'\"\n              (click)=\"addConnection()\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              {{ 'New connection' | translate }}\n            </c8y-li>\n          </c8y-list-group>\n        </div>\n        <div class=\"card-footer separator-top\">\n          <button\n            class=\"btn btn-default\"\n            title=\"{{ 'Add connection' | translate }}\"\n            [disabled]=\"state === 'addConnections'\"\n            (click)=\"addConnection()\"\n          >\n            <i [c8yIcon]=\"'plus-circle'\"></i>\n            {{ 'Add connection' | translate }}\n          </button>\n        </div>\n      </div>\n\n      <!-- 'split-view__detail--selected' condition needs to be fixed. this is needed so that both columns are visible in tablet format -->\n\n      <div\n        class=\"inner-scroll split-view__detail\"\n        [class]=\"{ 'split-view__detail--selected': connection }\"\n      >\n        <div class=\"card-header separator visible-sm visible-xs fit-w sticky-top\">\n          <button\n            class=\"btn btn-clean text-primary\"\n            title=\"{{ 'Back' | translate }}\"\n            (click)=\"resetEditedUnsavedConnection()\"\n          >\n            <i [c8yIcon]=\"'chevron-left'\"></i>\n            <span>{{ 'Back' | translate }}</span>\n          </button>\n        </div>\n        <form\n          class=\"d-contents\"\n          #connectorsForm=\"ngForm\"\n        >\n          <div class=\"flex-grow\">\n            <div class=\"card-block large-padding\">\n              <c8y-form-group>\n                <label for=\"name\">\n                  {{ 'Name' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"name\"\n                  name=\"name\"\n                  type=\"text\"\n                  required\n                  [placeholder]=\"'e.g. LORIOT connection' | translate\"\n                  [(ngModel)]=\"connection.name\"\n                  [pattern]=\"namePattern\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    [text]=\"namePatternError\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"description\">\n                  {{ 'Description' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"description\"\n                  name=\"description\"\n                  type=\"text\"\n                  [placeholder]=\"\n                    'e.g. This connection has a built-in functionality to\u2026' | translate\n                  \"\n                  [(ngModel)]=\"connection.description\"\n                />\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"baseUrl\">\n                  {{ 'URL' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"baseUrl\"\n                  name=\"baseUrl\"\n                  type=\"text\"\n                  required\n                  [placeholder]=\"\n                    'e.g. {{ example }}' | translate : { example: 'https://ap3.loriot.io' }\n                  \"\n                  [(ngModel)]=\"connection.baseUrl\"\n                />\n              </c8y-form-group>\n              <c8y-form-group>\n                <label for=\"username\">\n                  {{ 'Username' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"username\"\n                  placeholder=\"{{ 'e.g. joe`LOCALIZE`' | translate }}\"\n                  name=\"username\"\n                  type=\"text\"\n                  required\n                  [(ngModel)]=\"connection.username\"\n                />\n              </c8y-form-group>\n              <c8y-form-group *ngIf=\"showPassword\">\n                <label for=\"password\">\n                  {{ 'Password' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"password\"\n                  placeholder=\"{{ 'e.g. my_password' | translate }}\"\n                  name=\"password\"\n                  type=\"password\"\n                  required\n                  [(ngModel)]=\"connection.password\"\n                />\n              </c8y-form-group>\n\n              <button\n                class=\"btn btn-default\"\n                name=\"changePassword\"\n                type=\"button\"\n                *ngIf=\"state === 'updateConnection'\"\n                (click)=\"changePassword()\"\n              >\n                <span\n                  title=\"{{ 'Change password' | translate }}\"\n                  *ngIf=\"!showPassword\"\n                >\n                  {{ 'Change password' | translate }}\n                </span>\n                <span\n                  title=\"{{ 'Cancel password change' | translate }}\"\n                  *ngIf=\"showPassword\"\n                >\n                  {{ 'Cancel password change' | translate }}\n                </span>\n              </button>\n            </div>\n          </div>\n\n          <div class=\"card-footer separator-top\">\n            <button\n              class=\"btn btn-default\"\n              title=\"{{ 'Cancel' | translate }}\"\n              type=\"button\"\n              (click)=\"setModel()\"\n              translate\n            >\n              Cancel\n            </button>\n            <button\n              class=\"btn btn-danger\"\n              title=\"{{ 'Delete' | translate }}\"\n              type=\"button\"\n              data-cy=\"loriot-multiple-lns-connector.component--delete-connectivity\"\n              *ngIf=\"state === 'updateConnection'\"\n              (click)=\"deleteConnection(originalConnection)\"\n              translate\n            >\n              Delete\n            </button>\n            <button\n              class=\"btn btn-primary\"\n              title=\"{{ 'Save' | translate }}\"\n              type=\"submit\"\n              [disabled]=\"!connectorsForm.form.valid || connectorsForm.form.pristine\"\n              (click)=\"save()\"\n              data-cy=\"loriot-multiple-lns-connector.component--button-save\"\n              translate\n            >\n              Save\n            </button>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</ng-template>\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: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "component", type: i2.TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "directive", type: i6.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i6.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i6.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i6.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { 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: "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: NoConnectionsFoundComponent, selector: "no-connections-found", inputs: ["header"], outputs: ["onAction"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: LoriotMultipleLnsConnectorComponent, isStandalone: true, selector: "loriot-multiple-lns-connector", viewQueries: [{ propertyName: "connectorsForm", first: true, predicate: ["connectorsForm"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"state === 'loadingConnection'; else renderListAndForm\">\n  <c8y-loading></c8y-loading>\n</ng-container>\n\n<c8y-title>{{ 'Connectivity' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Settings' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Connectivity' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'LORIOT' | translate\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<ng-template #renderListAndForm>\n  <no-connections-found\n    (onAction)=\"addConnection()\"\n    *ngIf=\"connections.length === 0 && state !== 'addConnections'\"\n    [header]=\"cardHeader | translate\"\n  ></no-connections-found>\n  <div>\n    <div\n      class=\"card content-fullpage split-view--5-7\"\n      *ngIf=\"connections.length !== 0 || state === 'addConnections'\"\n    >\n      <div class=\"card-header separator grid__col--fullspan\">\n        <div class=\"card-title\">{{ cardHeader | translate }}</div>\n      </div>\n      <div class=\"inner-scroll split-view__list\">\n        <div class=\"bg-gray-white flex-grow\">\n          <c8y-list-group class=\"nav c8y-nav-stacked\">\n            <c8y-li\n              class=\"c8y-stacked-item p-0\"\n              [class.active]=\"connection.name === connectionBeingEdited\"\n              *ngFor=\"let connection of connections; let index = index\"\n              (click)=\"setModel(cloneDeep(connection))\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              <span title=\"{{ connection.name }}\">\n                {{ connection.name }}\n              </span>\n            </c8y-li>\n\n            <c8y-li\n              class=\"c8y-nav-stacked active\"\n              *ngIf=\"state === 'addConnections'\"\n              (click)=\"addConnection()\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              {{ 'New connection' | translate }}\n            </c8y-li>\n          </c8y-list-group>\n        </div>\n        <div class=\"card-footer separator-top\">\n          <button\n            class=\"btn btn-default\"\n            title=\"{{ 'Add connection' | translate }}\"\n            [disabled]=\"state === 'addConnections'\"\n            (click)=\"addConnection()\"\n          >\n            <i [c8yIcon]=\"'plus-circle'\"></i>\n            {{ 'Add connection' | translate }}\n          </button>\n        </div>\n      </div>\n\n      <!-- 'split-view__detail--selected' condition needs to be fixed. this is needed so that both columns are visible in tablet format -->\n\n      <div\n        class=\"inner-scroll split-view__detail\"\n        [class]=\"{ 'split-view__detail--selected': connection }\"\n      >\n        <div class=\"card-header separator visible-sm visible-xs fit-w sticky-top\">\n          <button\n            class=\"btn btn-clean text-primary\"\n            title=\"{{ 'Back' | translate }}\"\n            (click)=\"resetEditedUnsavedConnection()\"\n          >\n            <i [c8yIcon]=\"'chevron-left'\"></i>\n            <span>{{ 'Back' | translate }}</span>\n          </button>\n        </div>\n        <form\n          class=\"d-contents\"\n          #connectorsForm=\"ngForm\"\n        >\n          <div class=\"flex-grow\">\n            <div class=\"card-block large-padding\">\n              <c8y-form-group>\n                <label for=\"name\">\n                  {{ 'Name' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"name\"\n                  name=\"name\"\n                  type=\"text\"\n                  required\n                  [placeholder]=\"'e.g. LORIOT connection' | translate\"\n                  [(ngModel)]=\"connection.name\"\n                  [pattern]=\"namePattern\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    [text]=\"namePatternError\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"description\">\n                  {{ 'Description' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"description\"\n                  name=\"description\"\n                  type=\"text\"\n                  [placeholder]=\"\n                    'e.g. This connection has a built-in functionality to\u2026' | translate\n                  \"\n                  [(ngModel)]=\"connection.description\"\n                />\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"baseUrl\">\n                  {{ 'URL' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"baseUrl\"\n                  name=\"baseUrl\"\n                  type=\"text\"\n                  required\n                  [placeholder]=\"\n                    'e.g. {{ example }}' | translate : { example: 'https://ap3.loriot.io' }\n                  \"\n                  [(ngModel)]=\"connection.baseUrl\"\n                />\n              </c8y-form-group>\n              <c8y-form-group>\n                <label for=\"username\">\n                  {{ 'Username' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"username\"\n                  placeholder=\"{{ 'e.g. joe`LOCALIZE`' | translate }}\"\n                  name=\"username\"\n                  type=\"text\"\n                  required\n                  [(ngModel)]=\"connection.username\"\n                />\n              </c8y-form-group>\n              <c8y-form-group *ngIf=\"showPassword\">\n                <label for=\"password\">\n                  {{ 'Password' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"password\"\n                  placeholder=\"{{ 'e.g. my_password' | translate }}\"\n                  name=\"password\"\n                  type=\"password\"\n                  required\n                  [(ngModel)]=\"connection.password\"\n                />\n              </c8y-form-group>\n\n              <button\n                class=\"btn btn-default\"\n                name=\"changePassword\"\n                type=\"button\"\n                *ngIf=\"state === 'updateConnection'\"\n                (click)=\"changePassword()\"\n              >\n                <span\n                  title=\"{{ 'Change password' | translate }}\"\n                  *ngIf=\"!showPassword\"\n                >\n                  {{ 'Change password' | translate }}\n                </span>\n                <span\n                  title=\"{{ 'Cancel password change' | translate }}\"\n                  *ngIf=\"showPassword\"\n                >\n                  {{ 'Cancel password change' | translate }}\n                </span>\n              </button>\n            </div>\n          </div>\n\n          <div class=\"card-footer separator-top\">\n            <button\n              class=\"btn btn-default\"\n              title=\"{{ 'Cancel' | translate }}\"\n              type=\"button\"\n              (click)=\"setModel()\"\n              translate\n            >\n              Cancel\n            </button>\n            <button\n              class=\"btn btn-danger\"\n              title=\"{{ 'Delete' | translate }}\"\n              type=\"button\"\n              data-cy=\"loriot-multiple-lns-connector.component--delete-connectivity\"\n              *ngIf=\"state === 'updateConnection'\"\n              (click)=\"deleteConnection(originalConnection)\"\n              translate\n            >\n              Delete\n            </button>\n            <button\n              class=\"btn btn-primary\"\n              title=\"{{ 'Save' | translate }}\"\n              type=\"submit\"\n              [disabled]=\"!connectorsForm.form.valid || connectorsForm.form.pristine\"\n              (click)=\"save()\"\n              data-cy=\"loriot-multiple-lns-connector.component--button-save\"\n              translate\n            >\n              Save\n            </button>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { 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: NoConnectionsFoundComponent, selector: "no-connections-found", inputs: ["header"], outputs: ["onAction"] }, { kind: "component", type: ListGroupComponent, selector: "c8y-list-group" }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i5.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { 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: MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage"] }, { kind: "directive", type: MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { 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: LoriotMultipleLnsConnectorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'loriot-multiple-lns-connector', standalone: false, template: "<ng-container *ngIf=\"state === 'loadingConnection'; else renderListAndForm\">\n  <c8y-loading></c8y-loading>\n</ng-container>\n\n<c8y-title>{{ 'Connectivity' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Settings' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Connectivity' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'LORIOT' | translate\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<ng-template #renderListAndForm>\n  <no-connections-found\n    (onAction)=\"addConnection()\"\n    *ngIf=\"connections.length === 0 && state !== 'addConnections'\"\n    [header]=\"cardHeader | translate\"\n  ></no-connections-found>\n  <div>\n    <div\n      class=\"card content-fullpage split-view--5-7\"\n      *ngIf=\"connections.length !== 0 || state === 'addConnections'\"\n    >\n      <div class=\"card-header separator grid__col--fullspan\">\n        <div class=\"card-title\">{{ cardHeader | translate }}</div>\n      </div>\n      <div class=\"inner-scroll split-view__list\">\n        <div class=\"bg-gray-white flex-grow\">\n          <c8y-list-group class=\"nav c8y-nav-stacked\">\n            <c8y-li\n              class=\"c8y-stacked-item p-0\"\n              [class.active]=\"connection.name === connectionBeingEdited\"\n              *ngFor=\"let connection of connections; let index = index\"\n              (click)=\"setModel(cloneDeep(connection))\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              <span title=\"{{ connection.name }}\">\n                {{ connection.name }}\n              </span>\n            </c8y-li>\n\n            <c8y-li\n              class=\"c8y-nav-stacked active\"\n              *ngIf=\"state === 'addConnections'\"\n              (click)=\"addConnection()\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              {{ 'New connection' | translate }}\n            </c8y-li>\n          </c8y-list-group>\n        </div>\n        <div class=\"card-footer separator-top\">\n          <button\n            class=\"btn btn-default\"\n            title=\"{{ 'Add connection' | translate }}\"\n            [disabled]=\"state === 'addConnections'\"\n            (click)=\"addConnection()\"\n          >\n            <i [c8yIcon]=\"'plus-circle'\"></i>\n            {{ 'Add connection' | translate }}\n          </button>\n        </div>\n      </div>\n\n      <!-- 'split-view__detail--selected' condition needs to be fixed. this is needed so that both columns are visible in tablet format -->\n\n      <div\n        class=\"inner-scroll split-view__detail\"\n        [class]=\"{ 'split-view__detail--selected': connection }\"\n      >\n        <div class=\"card-header separator visible-sm visible-xs fit-w sticky-top\">\n          <button\n            class=\"btn btn-clean text-primary\"\n            title=\"{{ 'Back' | translate }}\"\n            (click)=\"resetEditedUnsavedConnection()\"\n          >\n            <i [c8yIcon]=\"'chevron-left'\"></i>\n            <span>{{ 'Back' | translate }}</span>\n          </button>\n        </div>\n        <form\n          class=\"d-contents\"\n          #connectorsForm=\"ngForm\"\n        >\n          <div class=\"flex-grow\">\n            <div class=\"card-block large-padding\">\n              <c8y-form-group>\n                <label for=\"name\">\n                  {{ 'Name' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"name\"\n                  name=\"name\"\n                  type=\"text\"\n                  required\n                  [placeholder]=\"'e.g. LORIOT connection' | translate\"\n                  [(ngModel)]=\"connection.name\"\n                  [pattern]=\"namePattern\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    [text]=\"namePatternError\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"description\">\n                  {{ 'Description' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"description\"\n                  name=\"description\"\n                  type=\"text\"\n                  [placeholder]=\"\n                    'e.g. This connection has a built-in functionality to\u2026' | translate\n                  \"\n                  [(ngModel)]=\"connection.description\"\n                />\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"baseUrl\">\n                  {{ 'URL' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"baseUrl\"\n                  name=\"baseUrl\"\n                  type=\"text\"\n                  required\n                  [placeholder]=\"\n                    'e.g. {{ example }}' | translate : { example: 'https://ap3.loriot.io' }\n                  \"\n                  [(ngModel)]=\"connection.baseUrl\"\n                />\n              </c8y-form-group>\n              <c8y-form-group>\n                <label for=\"username\">\n                  {{ 'Username' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"username\"\n                  placeholder=\"{{ 'e.g. joe`LOCALIZE`' | translate }}\"\n                  name=\"username\"\n                  type=\"text\"\n                  required\n                  [(ngModel)]=\"connection.username\"\n                />\n              </c8y-form-group>\n              <c8y-form-group *ngIf=\"showPassword\">\n                <label for=\"password\">\n                  {{ 'Password' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"password\"\n                  placeholder=\"{{ 'e.g. my_password' | translate }}\"\n                  name=\"password\"\n                  type=\"password\"\n                  required\n                  [(ngModel)]=\"connection.password\"\n                />\n              </c8y-form-group>\n\n              <button\n                class=\"btn btn-default\"\n                name=\"changePassword\"\n                type=\"button\"\n                *ngIf=\"state === 'updateConnection'\"\n                (click)=\"changePassword()\"\n              >\n                <span\n                  title=\"{{ 'Change password' | translate }}\"\n                  *ngIf=\"!showPassword\"\n                >\n                  {{ 'Change password' | translate }}\n                </span>\n                <span\n                  title=\"{{ 'Cancel password change' | translate }}\"\n                  *ngIf=\"showPassword\"\n                >\n                  {{ 'Cancel password change' | translate }}\n                </span>\n              </button>\n            </div>\n          </div>\n\n          <div class=\"card-footer separator-top\">\n            <button\n              class=\"btn btn-default\"\n              title=\"{{ 'Cancel' | translate }}\"\n              type=\"button\"\n              (click)=\"setModel()\"\n              translate\n            >\n              Cancel\n            </button>\n            <button\n              class=\"btn btn-danger\"\n              title=\"{{ 'Delete' | translate }}\"\n              type=\"button\"\n              data-cy=\"loriot-multiple-lns-connector.component--delete-connectivity\"\n              *ngIf=\"state === 'updateConnection'\"\n              (click)=\"deleteConnection(originalConnection)\"\n              translate\n            >\n              Delete\n            </button>\n            <button\n              class=\"btn btn-primary\"\n              title=\"{{ 'Save' | translate }}\"\n              type=\"submit\"\n              [disabled]=\"!connectorsForm.form.valid || connectorsForm.form.pristine\"\n              (click)=\"save()\"\n              data-cy=\"loriot-multiple-lns-connector.component--button-save\"\n              translate\n            >\n              Save\n            </button>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</ng-template>\n" }]
+            args: [{ selector: 'loriot-multiple-lns-connector', imports: [
+                        NgIf,
+                        LoadingComponent,
+                        TitleComponent,
+                        BreadcrumbComponent,
+                        BreadcrumbItemComponent,
+                        NoConnectionsFoundComponent,
+                        ListGroupComponent,
+                        NgFor,
+                        ListItemComponent,
+                        ListItemIconComponent,
+                        IconDirective,
+                        FormsModule,
+                        FormGroupComponent,
+                        RequiredInputPlaceholderDirective,
+                        MessagesComponent,
+                        MessageDirective,
+                        C8yTranslateDirective,
+                        C8yTranslatePipe
+                    ], template: "<ng-container *ngIf=\"state === 'loadingConnection'; else renderListAndForm\">\n  <c8y-loading></c8y-loading>\n</ng-container>\n\n<c8y-title>{{ 'Connectivity' | translate }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Settings' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'Connectivity' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'cog'\"\n    [label]=\"'LORIOT' | translate\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<ng-template #renderListAndForm>\n  <no-connections-found\n    (onAction)=\"addConnection()\"\n    *ngIf=\"connections.length === 0 && state !== 'addConnections'\"\n    [header]=\"cardHeader | translate\"\n  ></no-connections-found>\n  <div>\n    <div\n      class=\"card content-fullpage split-view--5-7\"\n      *ngIf=\"connections.length !== 0 || state === 'addConnections'\"\n    >\n      <div class=\"card-header separator grid__col--fullspan\">\n        <div class=\"card-title\">{{ cardHeader | translate }}</div>\n      </div>\n      <div class=\"inner-scroll split-view__list\">\n        <div class=\"bg-gray-white flex-grow\">\n          <c8y-list-group class=\"nav c8y-nav-stacked\">\n            <c8y-li\n              class=\"c8y-stacked-item p-0\"\n              [class.active]=\"connection.name === connectionBeingEdited\"\n              *ngFor=\"let connection of connections; let index = index\"\n              (click)=\"setModel(cloneDeep(connection))\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              <span title=\"{{ connection.name }}\">\n                {{ connection.name }}\n              </span>\n            </c8y-li>\n\n            <c8y-li\n              class=\"c8y-nav-stacked active\"\n              *ngIf=\"state === 'addConnections'\"\n              (click)=\"addConnection()\"\n            >\n              <c8y-li-icon [icon]=\"'plug'\"></c8y-li-icon>\n              {{ 'New connection' | translate }}\n            </c8y-li>\n          </c8y-list-group>\n        </div>\n        <div class=\"card-footer separator-top\">\n          <button\n            class=\"btn btn-default\"\n            title=\"{{ 'Add connection' | translate }}\"\n            [disabled]=\"state === 'addConnections'\"\n            (click)=\"addConnection()\"\n          >\n            <i [c8yIcon]=\"'plus-circle'\"></i>\n            {{ 'Add connection' | translate }}\n          </button>\n        </div>\n      </div>\n\n      <!-- 'split-view__detail--selected' condition needs to be fixed. this is needed so that both columns are visible in tablet format -->\n\n      <div\n        class=\"inner-scroll split-view__detail\"\n        [class]=\"{ 'split-view__detail--selected': connection }\"\n      >\n        <div class=\"card-header separator visible-sm visible-xs fit-w sticky-top\">\n          <button\n            class=\"btn btn-clean text-primary\"\n            title=\"{{ 'Back' | translate }}\"\n            (click)=\"resetEditedUnsavedConnection()\"\n          >\n            <i [c8yIcon]=\"'chevron-left'\"></i>\n            <span>{{ 'Back' | translate }}</span>\n          </button>\n        </div>\n        <form\n          class=\"d-contents\"\n          #connectorsForm=\"ngForm\"\n        >\n          <div class=\"flex-grow\">\n            <div class=\"card-block large-padding\">\n              <c8y-form-group>\n                <label for=\"name\">\n                  {{ 'Name' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"name\"\n                  name=\"name\"\n                  type=\"text\"\n                  required\n                  [placeholder]=\"'e.g. LORIOT connection' | translate\"\n                  [(ngModel)]=\"connection.name\"\n                  [pattern]=\"namePattern\"\n                />\n                <c8y-messages>\n                  <c8y-message\n                    name=\"pattern\"\n                    [text]=\"namePatternError\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"description\">\n                  {{ 'Description' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"description\"\n                  name=\"description\"\n                  type=\"text\"\n                  [placeholder]=\"\n                    'e.g. This connection has a built-in functionality to\u2026' | translate\n                  \"\n                  [(ngModel)]=\"connection.description\"\n                />\n              </c8y-form-group>\n\n              <c8y-form-group>\n                <label for=\"baseUrl\">\n                  {{ 'URL' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"baseUrl\"\n                  name=\"baseUrl\"\n                  type=\"text\"\n                  required\n                  [placeholder]=\"\n                    'e.g. {{ example }}' | translate : { example: 'https://ap3.loriot.io' }\n                  \"\n                  [(ngModel)]=\"connection.baseUrl\"\n                />\n              </c8y-form-group>\n              <c8y-form-group>\n                <label for=\"username\">\n                  {{ 'Username' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"username\"\n                  placeholder=\"{{ 'e.g. joe`LOCALIZE`' | translate }}\"\n                  name=\"username\"\n                  type=\"text\"\n                  required\n                  [(ngModel)]=\"connection.username\"\n                />\n              </c8y-form-group>\n              <c8y-form-group *ngIf=\"showPassword\">\n                <label for=\"password\">\n                  {{ 'Password' | translate }}\n                </label>\n                <input\n                  class=\"form-control\"\n                  id=\"password\"\n                  placeholder=\"{{ 'e.g. my_password' | translate }}\"\n                  name=\"password\"\n                  type=\"password\"\n                  required\n                  [(ngModel)]=\"connection.password\"\n                />\n              </c8y-form-group>\n\n              <button\n                class=\"btn btn-default\"\n                name=\"changePassword\"\n                type=\"button\"\n                *ngIf=\"state === 'updateConnection'\"\n                (click)=\"changePassword()\"\n              >\n                <span\n                  title=\"{{ 'Change password' | translate }}\"\n                  *ngIf=\"!showPassword\"\n                >\n                  {{ 'Change password' | translate }}\n                </span>\n                <span\n                  title=\"{{ 'Cancel password change' | translate }}\"\n                  *ngIf=\"showPassword\"\n                >\n                  {{ 'Cancel password change' | translate }}\n                </span>\n              </button>\n            </div>\n          </div>\n\n          <div class=\"card-footer separator-top\">\n            <button\n              class=\"btn btn-default\"\n              title=\"{{ 'Cancel' | translate }}\"\n              type=\"button\"\n              (click)=\"setModel()\"\n              translate\n            >\n              Cancel\n            </button>\n            <button\n              class=\"btn btn-danger\"\n              title=\"{{ 'Delete' | translate }}\"\n              type=\"button\"\n              data-cy=\"loriot-multiple-lns-connector.component--delete-connectivity\"\n              *ngIf=\"state === 'updateConnection'\"\n              (click)=\"deleteConnection(originalConnection)\"\n              translate\n            >\n              Delete\n            </button>\n            <button\n              class=\"btn btn-primary\"\n              title=\"{{ 'Save' | translate }}\"\n              type=\"submit\"\n              [disabled]=\"!connectorsForm.form.valid || connectorsForm.form.pristine\"\n              (click)=\"save()\"\n              data-cy=\"loriot-multiple-lns-connector.component--button-save\"\n              translate\n            >\n              Save\n            </button>\n          </div>\n        </form>\n      </div>\n    </div>\n  </div>\n</ng-template>\n" }]
         }], ctorParameters: () => [{ type: MultipleLnsConnectorService }, { type: i2.AlertService }, { type: i3.TranslateService }, { type: i4.BsModalService }, { type: i2.ModalService }], propDecorators: { connectorsForm: [{
                 type: ViewChild,
                 args: ['connectorsForm', { static: false }]
@@ -707,24 +765,36 @@ const settingsRoutes = [
 ];
 class MultipleLnsConnectorsModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: MultipleLnsConnectorsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: MultipleLnsConnectorsModule, declarations: [SigfoxMultipleLnsConnectorComponent,
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: MultipleLnsConnectorsModule, imports: [CoreModule,
+            CommonModule,
+            FormsModule$1, i3$1.RouterModule, SigfoxMultipleLnsConnectorComponent,
             NoConnectionsFoundComponent,
             ActilityMultipleLnsConnectorComponent,
             LoriotMultipleLnsConnectorComponent,
-            ConnectionInfoWithDownloadCsvComponent], imports: [CoreModule, CommonModule, FormsModule, i3$1.RouterModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: MultipleLnsConnectorsModule, providers: [MultipleLnsConnectorService], imports: [CoreModule, CommonModule, FormsModule, RouterModule.forChild(settingsRoutes)] }); }
+            ConnectionInfoWithDownloadCsvComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: MultipleLnsConnectorsModule, providers: [MultipleLnsConnectorService], imports: [CoreModule,
+            CommonModule,
+            FormsModule$1,
+            RouterModule.forChild(settingsRoutes),
+            SigfoxMultipleLnsConnectorComponent,
+            NoConnectionsFoundComponent,
+            ActilityMultipleLnsConnectorComponent,
+            LoriotMultipleLnsConnectorComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: MultipleLnsConnectorsModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [
+                    imports: [
+                        CoreModule,
+                        CommonModule,
+                        FormsModule$1,
+                        RouterModule.forChild(settingsRoutes),
                         SigfoxMultipleLnsConnectorComponent,
                         NoConnectionsFoundComponent,
                         ActilityMultipleLnsConnectorComponent,
                         LoriotMultipleLnsConnectorComponent,
                         ConnectionInfoWithDownloadCsvComponent
                     ],
-                    imports: [CoreModule, CommonModule, FormsModule, RouterModule.forChild(settingsRoutes)],
                     providers: [MultipleLnsConnectorService]
                 }]
         }] });
@@ -892,11 +962,24 @@ class LpwanAssignLnsConnectionsComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: LpwanAssignLnsConnectionsComponent, deps: [{ token: LpwanSetDeviceProtocolService }, { token: i2.AlertService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: LpwanAssignLnsConnectionsComponent, isStandalone: false, selector: "set-lns-connections", inputs: { device: "device" }, viewQueries: [{ propertyName: "popoverConfirm", first: true, predicate: PopoverConfirmComponent, descendants: true, static: true }], ngImport: i0, template: "<div class=\"col-md-6\">\n  <div class=\"form-group\">\n    <label translate>Current connection</label>\n    <p class=\"form-control-static\" *ngIf=\"!currentConnection\">\n      {{ 'Connection is not set. Select connection for this device' | translate }}\n    </p>\n    <p class=\"form-control-static text-truncate\" *ngIf=\"currentConnection\" title=\"{{ currentConnection.name }}\">\n      {{ currentConnection.name }}\n    </p>\n  </div>\n\n  <c8y-form-group>\n    <c8y-popover-confirm\n      outsideClick=\"true\"\n      containerClass=\"lns-connection-popover\"\n      [message]=\"reRegisterMsg\"\n      [buttons]=\"buttons\"\n      [placement]=\"'bottom'\"\n    ></c8y-popover-confirm>\n    <c8y-typeahead\n      *ngIf=\"!loading\"\n      [(ngModel)]=\"newConnection\"\n      placeholder=\"{{ 'Select new connection' | translate }}\"\n      name=\"newConnection\"\n      (onSearch)=\"setConnectionPipe($event)\"\n      [allowFreeEntries]=\"false\"\n    >\n      <c8y-li\n        *c8yFor=\"let connection of availableConnections; loadMore: 'hidden'; pipe: filterConnection\"\n        class=\"p-l-8 p-r-8 c8y-list__item--link\"\n        (click)=\"togglePopover(popoverConfirm)\"\n      >\n        <c8y-highlight [text]=\"connection.name\" [pattern]=\"pattern\"></c8y-highlight>\n      </c8y-li>\n    </c8y-typeahead>\n    <c8y-messages\n      ><c8y-message\n        name=\"notExisting\"\n        [text]=\"'Select one of the connections.' | translate\"\n      ></c8y-message>\n    </c8y-messages>\n  </c8y-form-group>\n</div>\n", dependencies: [{ kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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.PopoverConfirmComponent, selector: "c8y-popover-confirm", inputs: ["buttons", "message", "title", "isOpen", "containerClass", "placement", "outsideClick", "adaptivePosition", "container"] }, { 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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.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: "directive", type: i2.MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "component", type: i2.MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage"] }, { kind: "component", type: i2.ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: LpwanAssignLnsConnectionsComponent, isStandalone: true, selector: "set-lns-connections", inputs: { device: "device" }, viewQueries: [{ propertyName: "popoverConfirm", first: true, predicate: PopoverConfirmComponent, descendants: true, static: true }], ngImport: i0, template: "<div class=\"col-md-6\">\n  <div class=\"form-group\">\n    <label translate>Current connection</label>\n    <p class=\"form-control-static\" *ngIf=\"!currentConnection\">\n      {{ 'Connection is not set. Select connection for this device' | translate }}\n    </p>\n    <p class=\"form-control-static text-truncate\" *ngIf=\"currentConnection\" title=\"{{ currentConnection.name }}\">\n      {{ currentConnection.name }}\n    </p>\n  </div>\n\n  <c8y-form-group>\n    <c8y-popover-confirm\n      outsideClick=\"true\"\n      containerClass=\"lns-connection-popover\"\n      [message]=\"reRegisterMsg\"\n      [buttons]=\"buttons\"\n      [placement]=\"'bottom'\"\n    ></c8y-popover-confirm>\n    <c8y-typeahead\n      *ngIf=\"!loading\"\n      [(ngModel)]=\"newConnection\"\n      placeholder=\"{{ 'Select new connection' | translate }}\"\n      name=\"newConnection\"\n      (onSearch)=\"setConnectionPipe($event)\"\n      [allowFreeEntries]=\"false\"\n    >\n      <c8y-li\n        *c8yFor=\"let connection of availableConnections; loadMore: 'hidden'; pipe: filterConnection\"\n        class=\"p-l-8 p-r-8 c8y-list__item--link\"\n        (click)=\"togglePopover(popoverConfirm)\"\n      >\n        <c8y-highlight [text]=\"connection.name\" [pattern]=\"pattern\"></c8y-highlight>\n      </c8y-li>\n    </c8y-typeahead>\n    <c8y-messages\n      ><c8y-message\n        name=\"notExisting\"\n        [text]=\"'Select one of the connections.' | translate\"\n      ></c8y-message>\n    </c8y-messages>\n  </c8y-form-group>\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: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "component", type: PopoverConfirmComponent, selector: "c8y-popover-confirm", inputs: ["buttons", "message", "title", "isOpen", "containerClass", "placement", "outsideClick", "adaptivePosition", "container"] }, { 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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.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: HighlightComponent, selector: "c8y-highlight", inputs: ["pattern", "text", "elementClass", "shouldTrimPattern"] }, { kind: "component", type: MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage"] }, { kind: "directive", type: MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: LpwanAssignLnsConnectionsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'set-lns-connections', standalone: false, template: "<div class=\"col-md-6\">\n  <div class=\"form-group\">\n    <label translate>Current connection</label>\n    <p class=\"form-control-static\" *ngIf=\"!currentConnection\">\n      {{ 'Connection is not set. Select connection for this device' | translate }}\n    </p>\n    <p class=\"form-control-static text-truncate\" *ngIf=\"currentConnection\" title=\"{{ currentConnection.name }}\">\n      {{ currentConnection.name }}\n    </p>\n  </div>\n\n  <c8y-form-group>\n    <c8y-popover-confirm\n      outsideClick=\"true\"\n      containerClass=\"lns-connection-popover\"\n      [message]=\"reRegisterMsg\"\n      [buttons]=\"buttons\"\n      [placement]=\"'bottom'\"\n    ></c8y-popover-confirm>\n    <c8y-typeahead\n      *ngIf=\"!loading\"\n      [(ngModel)]=\"newConnection\"\n      placeholder=\"{{ 'Select new connection' | translate }}\"\n      name=\"newConnection\"\n      (onSearch)=\"setConnectionPipe($event)\"\n      [allowFreeEntries]=\"false\"\n    >\n      <c8y-li\n        *c8yFor=\"let connection of availableConnections; loadMore: 'hidden'; pipe: filterConnection\"\n        class=\"p-l-8 p-r-8 c8y-list__item--link\"\n        (click)=\"togglePopover(popoverConfirm)\"\n      >\n        <c8y-highlight [text]=\"connection.name\" [pattern]=\"pattern\"></c8y-highlight>\n      </c8y-li>\n    </c8y-typeahead>\n    <c8y-messages\n      ><c8y-message\n        name=\"notExisting\"\n        [text]=\"'Select one of the connections.' | translate\"\n      ></c8y-message>\n    </c8y-messages>\n  </c8y-form-group>\n</div>\n" }]
+            args: [{ selector: 'set-lns-connections', imports: [
+                        C8yTranslateDirective,
+                        NgIf,
+                        FormGroupComponent,
+                        PopoverConfirmComponent,
+                        TypeaheadComponent,
+                        FormsModule,
+                        ForOfDirective,
+                        ListItemComponent,
+                        HighlightComponent,
+                        MessagesComponent,
+                        MessageDirective,
+                        C8yTranslatePipe
+                    ], template: "<div class=\"col-md-6\">\n  <div class=\"form-group\">\n    <label translate>Current connection</label>\n    <p class=\"form-control-static\" *ngIf=\"!currentConnection\">\n      {{ 'Connection is not set. Select connection for this device' | translate }}\n    </p>\n    <p class=\"form-control-static text-truncate\" *ngIf=\"currentConnection\" title=\"{{ currentConnection.name }}\">\n      {{ currentConnection.name }}\n    </p>\n  </div>\n\n  <c8y-form-group>\n    <c8y-popover-confirm\n      outsideClick=\"true\"\n      containerClass=\"lns-connection-popover\"\n      [message]=\"reRegisterMsg\"\n      [buttons]=\"buttons\"\n      [placement]=\"'bottom'\"\n    ></c8y-popover-confirm>\n    <c8y-typeahead\n      *ngIf=\"!loading\"\n      [(ngModel)]=\"newConnection\"\n      placeholder=\"{{ 'Select new connection' | translate }}\"\n      name=\"newConnection\"\n      (onSearch)=\"setConnectionPipe($event)\"\n      [allowFreeEntries]=\"false\"\n    >\n      <c8y-li\n        *c8yFor=\"let connection of availableConnections; loadMore: 'hidden'; pipe: filterConnection\"\n        class=\"p-l-8 p-r-8 c8y-list__item--link\"\n        (click)=\"togglePopover(popoverConfirm)\"\n      >\n        <c8y-highlight [text]=\"connection.name\" [pattern]=\"pattern\"></c8y-highlight>\n      </c8y-li>\n    </c8y-typeahead>\n    <c8y-messages\n      ><c8y-message\n        name=\"notExisting\"\n        [text]=\"'Select one of the connections.' | translate\"\n      ></c8y-message>\n    </c8y-messages>\n  </c8y-form-group>\n</div>\n" }]
         }], ctorParameters: () => [{ type: LpwanSetDeviceProtocolService }, { type: i2.AlertService }], propDecorators: { device: [{
                 type: Input
             }], popoverConfirm: [{
@@ -965,11 +1048,25 @@ class LpwanAssignDeviceProtocolComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: LpwanAssignDeviceProtocolComponent, deps: [{ token: LpwanSetDeviceProtocolService }, { token: i2.AlertService }, { token: i3$1.Router }, { token: i1.InventoryService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: LpwanAssignDeviceProtocolComponent, isStandalone: false, selector: "set-device-protocol", viewQueries: [{ propertyName: "lpwanSetDeviceProtocolForm", first: true, predicate: ["lpwanSetDeviceProtocolForm"], descendants: true }], ngImport: i0, template: "<form #lpwanSetDeviceProtocolForm=\"ngForm\">\n  <div class=\"row\">\n    <div class=\"col-md-9\">\n      <div class=\"card card--fullpage\">\n        <div class=\"card-header separator\">\n          <div class=\"card-title\">\n            {{ 'LPWAN configuration' | translate }}\n          </div>\n        </div>\n\n        <div class=\"card-block p-t-24 p-b-8 overflow-visible\">\n          <div *ngIf=\"loading\">\n            <c8y-loading></c8y-loading>\n          </div>\n\n          <div *ngIf=\"!loading\">\n            <div class=\"col-md-6\">\n              <div class=\"form-group\">\n                <label translate>Current device protocol</label>\n                <p class=\"form-control-static\" *ngIf=\"!currentProtocol\">\n                  {{ device.type }}\n                </p>\n                <p\n                  class=\"form-control-static text-truncate\"\n                  *ngIf=\"currentProtocol\"\n                  title=\"{{ currentProtocol.name }}\"\n                >\n                  {{ currentProtocol.name }}\n                </p>\n              </div>\n              <c8y-form-group>\n                <c8y-typeahead\n                  [(ngModel)]=\"newProtocol\"\n                  placeholder=\"{{ 'Select new device protocol' | translate }}\"\n                  (onSearch)=\"setPipe($event)\"\n                  name=\"newProtocol\"\n                  [allowFreeEntries]=\"false\"\n                >\n                  <c8y-li\n                    *c8yFor=\"\n                      let protocol of availableProtocols;\n                      loadMore: 'hidden';\n                      pipe: filterProtocols\n                    \"\n                    class=\"p-l-8 p-r-8 c8y-list__item--link\"\n                    (click)=\"newProtocol = protocol; setPipe('')\"\n                  >\n                    <c8y-highlight [text]=\"protocol.name\" [pattern]=\"pattern\"></c8y-highlight>\n                  </c8y-li>\n                </c8y-typeahead>\n                <c8y-messages>\n                  <c8y-message\n                    name=\"notExisting\"\n                    [text]=\"'Select one of the protocols.' | translate\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n            </div>\n            <set-lns-connections [device]=\"device\"></set-lns-connections>\n          </div>\n        </div>\n\n        <div class=\"card-footer separator\">\n          <button\n            title=\"{{ 'Save' | translate }}\"\n            type=\"submit\"\n            class=\"btn btn-primary\"\n            (click)=\"apply(newProtocol)\"\n            [disabled]=\"!newProtocol\"\n          >\n            {{ 'Save' | translate }}\n          </button>\n        </div>\n      </div>\n    </div>\n  </div>\n</form>\n\u200C\n", dependencies: [{ kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { 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.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: i6.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i6.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { 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: "component", type: i2.ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: LpwanAssignLnsConnectionsComponent, selector: "set-lns-connections", inputs: ["device"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: LpwanAssignDeviceProtocolComponent, isStandalone: true, selector: "set-device-protocol", viewQueries: [{ propertyName: "lpwanSetDeviceProtocolForm", first: true, predicate: ["lpwanSetDeviceProtocolForm"], descendants: true }], ngImport: i0, template: "<form #lpwanSetDeviceProtocolForm=\"ngForm\">\n  <div class=\"row\">\n    <div class=\"col-md-9\">\n      <div class=\"card card--fullpage\">\n        <div class=\"card-header separator\">\n          <div class=\"card-title\">\n            {{ 'LPWAN configuration' | translate }}\n          </div>\n        </div>\n\n        <div class=\"card-block p-t-24 p-b-8 overflow-visible\">\n          <div *ngIf=\"loading\">\n            <c8y-loading></c8y-loading>\n          </div>\n\n          <div *ngIf=\"!loading\">\n            <div class=\"col-md-6\">\n              <div class=\"form-group\">\n                <label translate>Current device protocol</label>\n                <p class=\"form-control-static\" *ngIf=\"!currentProtocol\">\n                  {{ device.type }}\n                </p>\n                <p\n                  class=\"form-control-static text-truncate\"\n                  *ngIf=\"currentProtocol\"\n                  title=\"{{ currentProtocol.name }}\"\n                >\n                  {{ currentProtocol.name }}\n                </p>\n              </div>\n              <c8y-form-group>\n                <c8y-typeahead\n                  [(ngModel)]=\"newProtocol\"\n                  placeholder=\"{{ 'Select new device protocol' | translate }}\"\n                  (onSearch)=\"setPipe($event)\"\n                  name=\"newProtocol\"\n                  [allowFreeEntries]=\"false\"\n                >\n                  <c8y-li\n                    *c8yFor=\"\n                      let protocol of availableProtocols;\n                      loadMore: 'hidden';\n                      pipe: filterProtocols\n                    \"\n                    class=\"p-l-8 p-r-8 c8y-list__item--link\"\n                    (click)=\"newProtocol = protocol; setPipe('')\"\n                  >\n                    <c8y-highlight [text]=\"protocol.name\" [pattern]=\"pattern\"></c8y-highlight>\n                  </c8y-li>\n                </c8y-typeahead>\n                <c8y-messages>\n                  <c8y-message\n                    name=\"notExisting\"\n                    [text]=\"'Select one of the protocols.' | translate\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n            </div>\n            <set-lns-connections [device]=\"device\"></set-lns-connections>\n          </div>\n        </div>\n\n        <div class=\"card-footer separator\">\n          <button\n            title=\"{{ 'Save' | translate }}\"\n            type=\"submit\"\n            class=\"btn btn-primary\"\n            (click)=\"apply(newProtocol)\"\n            [disabled]=\"!newProtocol\"\n          >\n            {{ 'Save' | translate }}\n          </button>\n        </div>\n      </div>\n    </div>\n  </div>\n</form>\n\u200C\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { 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: "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: HighlightComponent, selector: "c8y-highlight", inputs: ["pattern", "text", "elementClass", "shouldTrimPattern"] }, { kind: "component", type: MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage"] }, { kind: "directive", type: MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "component", type: LpwanAssignLnsConnectionsComponent, selector: "set-lns-connections", inputs: ["device"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: LpwanAssignDeviceProtocolComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'set-device-protocol', standalone: false, template: "<form #lpwanSetDeviceProtocolForm=\"ngForm\">\n  <div class=\"row\">\n    <div class=\"col-md-9\">\n      <div class=\"card card--fullpage\">\n        <div class=\"card-header separator\">\n          <div class=\"card-title\">\n            {{ 'LPWAN configuration' | translate }}\n          </div>\n        </div>\n\n        <div class=\"card-block p-t-24 p-b-8 overflow-visible\">\n          <div *ngIf=\"loading\">\n            <c8y-loading></c8y-loading>\n          </div>\n\n          <div *ngIf=\"!loading\">\n            <div class=\"col-md-6\">\n              <div class=\"form-group\">\n                <label translate>Current device protocol</label>\n                <p class=\"form-control-static\" *ngIf=\"!currentProtocol\">\n                  {{ device.type }}\n                </p>\n                <p\n                  class=\"form-control-static text-truncate\"\n                  *ngIf=\"currentProtocol\"\n                  title=\"{{ currentProtocol.name }}\"\n                >\n                  {{ currentProtocol.name }}\n                </p>\n              </div>\n              <c8y-form-group>\n                <c8y-typeahead\n                  [(ngModel)]=\"newProtocol\"\n                  placeholder=\"{{ 'Select new device protocol' | translate }}\"\n                  (onSearch)=\"setPipe($event)\"\n                  name=\"newProtocol\"\n                  [allowFreeEntries]=\"false\"\n                >\n                  <c8y-li\n                    *c8yFor=\"\n                      let protocol of availableProtocols;\n                      loadMore: 'hidden';\n                      pipe: filterProtocols\n                    \"\n                    class=\"p-l-8 p-r-8 c8y-list__item--link\"\n                    (click)=\"newProtocol = protocol; setPipe('')\"\n                  >\n                    <c8y-highlight [text]=\"protocol.name\" [pattern]=\"pattern\"></c8y-highlight>\n                  </c8y-li>\n                </c8y-typeahead>\n                <c8y-messages>\n                  <c8y-message\n                    name=\"notExisting\"\n                    [text]=\"'Select one of the protocols.' | translate\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n            </div>\n            <set-lns-connections [device]=\"device\"></set-lns-connections>\n          </div>\n        </div>\n\n        <div class=\"card-footer separator\">\n          <button\n            title=\"{{ 'Save' | translate }}\"\n            type=\"submit\"\n            class=\"btn btn-primary\"\n            (click)=\"apply(newProtocol)\"\n            [disabled]=\"!newProtocol\"\n          >\n            {{ 'Save' | translate }}\n          </button>\n        </div>\n      </div>\n    </div>\n  </div>\n</form>\n\u200C\n" }]
+            args: [{ selector: 'set-device-protocol', imports: [
+                        FormsModule,
+                        NgIf,
+                        LoadingComponent,
+                        C8yTranslateDirective,
+                        FormGroupComponent,
+                        TypeaheadComponent,
+                        ForOfDirective,
+                        ListItemComponent,
+                        HighlightComponent,
+                        MessagesComponent,
+                        MessageDirective,
+                        LpwanAssignLnsConnectionsComponent,
+                        C8yTranslatePipe
+                    ], template: "<form #lpwanSetDeviceProtocolForm=\"ngForm\">\n  <div class=\"row\">\n    <div class=\"col-md-9\">\n      <div class=\"card card--fullpage\">\n        <div class=\"card-header separator\">\n          <div class=\"card-title\">\n            {{ 'LPWAN configuration' | translate }}\n          </div>\n        </div>\n\n        <div class=\"card-block p-t-24 p-b-8 overflow-visible\">\n          <div *ngIf=\"loading\">\n            <c8y-loading></c8y-loading>\n          </div>\n\n          <div *ngIf=\"!loading\">\n            <div class=\"col-md-6\">\n              <div class=\"form-group\">\n                <label translate>Current device protocol</label>\n                <p class=\"form-control-static\" *ngIf=\"!currentProtocol\">\n                  {{ device.type }}\n                </p>\n                <p\n                  class=\"form-control-static text-truncate\"\n                  *ngIf=\"currentProtocol\"\n                  title=\"{{ currentProtocol.name }}\"\n                >\n                  {{ currentProtocol.name }}\n                </p>\n              </div>\n              <c8y-form-group>\n                <c8y-typeahead\n                  [(ngModel)]=\"newProtocol\"\n                  placeholder=\"{{ 'Select new device protocol' | translate }}\"\n                  (onSearch)=\"setPipe($event)\"\n                  name=\"newProtocol\"\n                  [allowFreeEntries]=\"false\"\n                >\n                  <c8y-li\n                    *c8yFor=\"\n                      let protocol of availableProtocols;\n                      loadMore: 'hidden';\n                      pipe: filterProtocols\n                    \"\n                    class=\"p-l-8 p-r-8 c8y-list__item--link\"\n                    (click)=\"newProtocol = protocol; setPipe('')\"\n                  >\n                    <c8y-highlight [text]=\"protocol.name\" [pattern]=\"pattern\"></c8y-highlight>\n                  </c8y-li>\n                </c8y-typeahead>\n                <c8y-messages>\n                  <c8y-message\n                    name=\"notExisting\"\n                    [text]=\"'Select one of the protocols.' | translate\"\n                  ></c8y-message>\n                </c8y-messages>\n              </c8y-form-group>\n            </div>\n            <set-lns-connections [device]=\"device\"></set-lns-connections>\n          </div>\n        </div>\n\n        <div class=\"card-footer separator\">\n          <button\n            title=\"{{ 'Save' | translate }}\"\n            type=\"submit\"\n            class=\"btn btn-primary\"\n            (click)=\"apply(newProtocol)\"\n            [disabled]=\"!newProtocol\"\n          >\n            {{ 'Save' | translate }}\n          </button>\n        </div>\n      </div>\n    </div>\n  </div>\n</form>\n\u200C\n" }]
         }], ctorParameters: () => [{ type: LpwanSetDeviceProtocolService }, { type: i2.AlertService }, { type: i3$1.Router }, { type: i1.InventoryService }], propDecorators: { lpwanSetDeviceProtocolForm: [{
                 type: ViewChild,
                 args: ['lpwanSetDeviceProtocolForm', { static: false }]
@@ -1002,14 +1099,24 @@ const lpwanRoutes = [
 ];
 class LpwanProtocolModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: LpwanProtocolModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: LpwanProtocolModule, declarations: [LpwanAssignDeviceProtocolComponent, LpwanAssignLnsConnectionsComponent], imports: [CoreModule, FormsModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: LpwanProtocolModule, providers: [LpwanAgentGuard, LpwanSetDeviceProtocolService, hookRoute(lpwanRoutes)], imports: [CoreModule, FormsModule] }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: LpwanProtocolModule, imports: [CoreModule,
+            FormsModule$1,
+            LpwanAssignDeviceProtocolComponent,
+            LpwanAssignLnsConnectionsComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: LpwanProtocolModule, providers: [LpwanAgentGuard, LpwanSetDeviceProtocolService, hookRoute(lpwanRoutes)], imports: [CoreModule,
+            FormsModule$1,
+            LpwanAssignDeviceProtocolComponent,
+            LpwanAssignLnsConnectionsComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: LpwanProtocolModule, decorators: [{
             type: NgModule,
             args: [{
-                    declarations: [LpwanAssignDeviceProtocolComponent, LpwanAssignLnsConnectionsComponent],
-                    imports: [CoreModule, FormsModule],
+                    imports: [
+                        CoreModule,
+                        FormsModule$1,
+                        LpwanAssignDeviceProtocolComponent,
+                        LpwanAssignLnsConnectionsComponent
+                    ],
                     providers: [LpwanAgentGuard, LpwanSetDeviceProtocolService, hookRoute(lpwanRoutes)]
                 }]
         }] });