@c8y/ngx-components 1022.10.1 → 1022.13.0

package/fesm2022/c8y-ngx-components-register-device.mjs

@@ -1,30 +1,28 @@
 import * as i0 from '@angular/core';
-import { Injectable, ViewChild, Component, ChangeDetectionStrategy, inject, InjectionToken, Input, NgModule } from '@angular/core';
+import { Injectable, ChangeDetectionStrategy, Component, inject, InjectionToken, Input, ViewChild, NgModule } from '@angular/core';
 import * as i4 from 'ngx-bootstrap/modal';
 import { BsModalService } from 'ngx-bootstrap/modal';
 import { __decorate, __metadata } from 'tslib';
-import * as i1$1 from '@c8y/ngx-components';
-import { gettext, C8yStepper, memoize, hookGeneric, ExtensionPointWithoutStateForPlugins, fromTriggerOnce, Status, Permissions, NavigatorNode, CommonModule, CoreModule, StepperModule, DynamicFormsModule, hookNavigator, DeviceBootstrapRealtimeService } from '@c8y/ngx-components';
-import * as i8 from '@angular/forms';
-import { FormGroup } from '@angular/forms';
+import * as i5 from '@ngx-formly/core';
+import { FormlyModule } from '@ngx-formly/core';
+import * as i1$2 from '@c8y/ngx-components';
+import { gettext, ModalComponent, IconDirective, C8yStepper, C8yTranslateDirective, C8yStepperButtons, OperationResultComponent, ListGroupComponent, ListItemComponent, ListItemIconComponent, ListItemCollapseComponent, C8yTranslatePipe, memoize, hookGeneric, ExtensionPointWithoutStateForPlugins, fromTriggerOnce, OutletDirective, Status, TitleComponent, BreadcrumbComponent, BreadcrumbItemComponent, ActionBarItemComponent, ListDisplaySwitchComponent, IfAllowedDirective, HelpComponent, RequiredInputPlaceholderDirective, LoadMoreComponent, DatePipe, Permissions, NavigatorNode, FormGroupComponent, LoadingComponent, CommonModule, CoreModule, StepperModule, DynamicFormsModule, hookNavigator, DeviceBootstrapRealtimeService } from '@c8y/ngx-components';
+import * as i6 from '@angular/forms';
+import { FormGroup, FormsModule } from '@angular/forms';
 import { Subject, BehaviorSubject, from, forkJoin, defer, Observable } from 'rxjs';
 import { takeUntil, finalize, mergeMap, takeLast, map, tap, filter, switchMap, shareReplay, startWith } from 'rxjs/operators';
-import * as i2 from '@c8y/client';
+import * as i1$1 from '@c8y/client';
 import { DeviceRegistrationStatus, DeviceRegistrationSecurityMode, ApplicationType } from '@c8y/client';
 import * as i1 from '@angular/router';
 import { RouterModule } from '@angular/router';
 import { get, pick, sortBy, flatMap } from 'lodash-es';
-import { saveAs } from 'file-saver';
-import * as i5 from '@ngx-translate/core';
-import * as i5$1 from '@angular/common';
-import * as i6 from '@angular/cdk/stepper';
-import { STEP_STATE } from '@angular/cdk/stepper';
-import * as i7 from '@ngx-formly/core';
-import * as i5$2 from 'ngx-bootstrap/popover';
-import { PopoverModule } from 'ngx-bootstrap/popover';
+import { CdkStep, STEP_STATE } from '@angular/cdk/stepper';
+import { NgIf, NgClass, NgFor, AsyncPipe, JsonPipe, NgTemplateOutlet } from '@angular/common';
+import { PopoverDirective, PopoverModule } from 'ngx-bootstrap/popover';
+import * as i3 from '@ngx-translate/core';
 import { flatten } from 'lodash';
-import * as i3 from 'ngx-bootstrap/dropdown';
-import { BsDropdownModule } from 'ngx-bootstrap/dropdown';
+import { BsDropdownDirective, BsDropdownToggleDirective, BsDropdownMenuDirective, BsDropdownModule } from 'ngx-bootstrap/dropdown';
+import { saveAs } from 'file-saver';
 
 class RegisterDeviceService {
     constructor(router, deviceRegService, alertService) {
@@ -197,7 +195,7 @@ class RegisterDeviceService {
         this._loading.next(false);
         return items;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: RegisterDeviceService, deps: [{ token: i1.Router }, { token: i2.DeviceRegistrationService }, { token: i1$1.AlertService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: RegisterDeviceService, deps: [{ token: i1.Router }, { token: i1$1.DeviceRegistrationService }, { token: i1$2.AlertService }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: RegisterDeviceService, providedIn: 'root' }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: RegisterDeviceService, decorators: [{
@@ -205,142 +203,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
             args: [{
                     providedIn: 'root'
                 }]
-        }], ctorParameters: () => [{ type: i1.Router }, { type: i2.DeviceRegistrationService }, { type: i1$1.AlertService }] });
-
-const PRODUCT_EXPERIENCE_BASE_REGISTRATION = {
-    EVENT: 'deviceRegistration',
-    COMPONENT: {
-        BULK: 'bulk-registration',
-        EXTENSIBLE_BULK: 'bulk-extensible-registration',
-        EXTENSIBLE_SINGLE: 'single-extensible-registration'
-    },
-    RESULT: { SUCCESS: 'registrationSuccess', FAILURE: 'registrationFailure' }
-};
-
-const registerDeviceBulkSchema = {
-    $schema: 'https://json-schema.org/draft/2019-09/schema',
-    type: 'object',
-    properties: {
-        csvBulkFile: {
-            type: 'array',
-            title: gettext('CSV file upload'),
-            description: gettext('You can use file upload component to let users send files. This input accepts only a single CSV file.'),
-            contentMediaType: 'csv'
-        }
-    },
-    required: ['csvBulkFile'],
-    additionalProperties: false
-};
-const simpleCsvHeaders = ['ID', 'PATH'];
-const csvHeaders = [
-    'ID',
-    'TYPE',
-    'NAME',
-    'ICCID',
-    'IDTYPE',
-    'PATH',
-    'SHELL',
-    'AUTH_TYPE'
-];
-const fullCsvHeaders = [...csvHeaders, 'CREDENTIALS'];
-const ESTCsvHeaders = [...csvHeaders, 'ENROLLMENT_OTP'];
-class BulkDeviceRegistrationModalComponent {
-    constructor(jsonschema, deviceRegistrationService, registerDeviceService, bsModalRef, gainsightService, featureCacheService, translateService) {
-        this.jsonschema = jsonschema;
-        this.deviceRegistrationService = deviceRegistrationService;
-        this.registerDeviceService = registerDeviceService;
-        this.bsModalRef = bsModalRef;
-        this.gainsightService = gainsightService;
-        this.featureCacheService = featureCacheService;
-        this.translateService = translateService;
-        this.form = new FormGroup({});
-        this.model = {};
-        this.certificateAuthorityFeatureEnabled = this.featureCacheService.getFeatureState('certificate-authority');
-    }
-    ngOnInit() {
-        this.template = [this.jsonschema.toFieldConfig(registerDeviceBulkSchema)];
-    }
-    upload() {
-        this.pending = true;
-        const file = this.getFile(this.model);
-        this.deviceRegistrationService
-            .create(file)
-            .then(({ res, data }) => {
-            if (res.status < 400) {
-                this.result = data;
-                this.success = data.numberOfFailed === 0 && data.numberOfSuccessful === data.numberOfAll;
-                this.message = this.success
-                    ? gettext('Device registration created.')
-                    : (this.message = gettext('Device registration failed.'));
-                if (this.success) {
-                    this.gainsightService.triggerEvent(PRODUCT_EXPERIENCE_BASE_REGISTRATION.EVENT, {
-                        result: PRODUCT_EXPERIENCE_BASE_REGISTRATION.RESULT.SUCCESS,
-                        component: PRODUCT_EXPERIENCE_BASE_REGISTRATION.COMPONENT.BULK
-                    });
-                }
-                else {
-                    this.gainsightService.triggerEvent(PRODUCT_EXPERIENCE_BASE_REGISTRATION.EVENT, {
-                        result: PRODUCT_EXPERIENCE_BASE_REGISTRATION.RESULT.FAILURE,
-                        component: PRODUCT_EXPERIENCE_BASE_REGISTRATION.COMPONENT.BULK
-                    });
-                }
-            }
-            else {
-                this.failedResult = data;
-                this.message = gettext('Device registration failed.');
-                this.gainsightService.triggerEvent(PRODUCT_EXPERIENCE_BASE_REGISTRATION.EVENT, {
-                    result: PRODUCT_EXPERIENCE_BASE_REGISTRATION.RESULT.FAILURE,
-                    component: PRODUCT_EXPERIENCE_BASE_REGISTRATION.COMPONENT.BULK
-                });
-            }
-            this.model = {};
-            this.pending = false;
-            this.stepper.next();
-        })
-            .catch(() => {
-            this.message = gettext('Error occurred while processing the uploaded file.');
-            this.pending = false;
-            this.stepper.next();
-        });
-    }
-    downloadSimple() {
-        return this.download(simpleCsvHeaders, gettext('Simple bulk registration - template.csv'));
-    }
-    downloadFull() {
-        return this.download(fullCsvHeaders, gettext('Full bulk registration - template.csv'));
-    }
-    downloadEst() {
-        return this.download(ESTCsvHeaders, gettext('EST registration - template.csv'));
-    }
-    download(headers, fileName) {
-        const headerRaw = headers.map(header => `"${header}"`).join(';');
-        const binaryFile = new Blob([headerRaw], { type: 'text/csv' });
-        saveAs(binaryFile, this.translateService.instant(fileName));
-    }
-    complete() {
-        this.registerDeviceService.list();
-        this.bsModalRef.hide();
-    }
-    cancel() {
-        this.bsModalRef.hide();
-    }
-    getFile(model) {
-        const csvBulkFile = model?.csvBulkFile;
-        return csvBulkFile ? csvBulkFile[0]?.file : undefined;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: BulkDeviceRegistrationModalComponent, deps: [{ token: i1$1.C8yJSONSchema }, { token: i2.DeviceRegistrationBulkService }, { token: RegisterDeviceService }, { token: i4.BsModalRef }, { token: i1$1.GainsightService }, { token: i1$1.FeatureCacheService }, { token: i5.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: BulkDeviceRegistrationModalComponent, isStandalone: false, selector: "bulk-device-registration", viewQueries: [{ propertyName: "stepper", first: true, predicate: C8yStepper, descendants: true, static: true }], ngImport: i0, template: "<c8y-modal\n  [title]=\"'Bulk device registration' | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <i c8yIcon=\"upload\"></i>\n  </ng-container>\n\n  <c8y-stepper [hideStepProgress]=\"true\" linear id=\"modal-body\">\n    <cdk-step>\n      <p class=\"modal-subtitle sticky-top\" translate>Register devices in bulk</p>\n\n      <c8y-form-group class=\"d-block p-24 p-t-16 p-b-0 m-b-0\">\n        <formly-form [form]=\"form\" [fields]=\"template\" [model]=\"model\"></formly-form>\n      </c8y-form-group>\n\n      <div class=\"p-24 m-t-0 bg-level-1\">\n          <div class=\"bg-gray-white separator-bottom p-t-16 p-b-16 p-l-24 p-r-24\">\n            <div>\n              <p class=\"m-b-8 text-medium\">\n                <strong translate>Simple registration</strong>\n              </p>\n              <small class=\"text-muted\" translate>\n                Creates all registration requests at once, then each one needs to go through regular\n                acceptance process.\n              </small>\n            </div>\n            <div class=\"m-b-16 m-t-16\">\n              <a\n                title=\"{{ 'Download template' | translate }}\"\n                class=\"btn btn-default btn-sm\"\n                target=\"_self\"\n                (click)=\"downloadSimple()\"\n              >\n                <i c8yIcon=\"download\" translate></i>\n                {{ 'Download template' | translate }}\n              </a>\n            </div>\n          </div>\n          <div class=\"bg-gray-white separator-bottom p-t-16 p-b-16 p-l-24 p-r-24\">\n            <div>\n              <p class=\"m-b-8 text-medium\">\n                <strong translate>Full registration</strong>\n              </p>\n              <small class=\"text-muted\" translate>\n                Creates all device credentials and devices using provided list of property values.\n                Devices can start communicating with the platform immediately.\n              </small>\n            </div>\n            <div class=\"m-b-16 m-t-16\">\n              <a\n                title=\"{{ 'Download template' | translate }}\"\n                class=\"btn btn-default btn-sm\"\n                target=\"_self\"\n                (click)=\"downloadFull()\"\n              >\n                <i c8yIcon=\"download\" translate></i>\n                {{ 'Download template' | translate }}\n              </a>\n            </div>\n          </div>\n          <div class=\"bg-gray-white separator-bottom p-t-16 p-b-16 p-l-24 p-r-24\" *ngIf=\"certificateAuthorityFeatureEnabled | async\">\n            <div>\n              <p class=\"m-b-8 text-medium\">\n                <strong translate>Full registration with device certificate creation</strong>\n              </p>\n              <small class=\"text-muted\" translate>\n                Creates device certificates and devices using the provided list of property values. Once the certificates are provisioned, the devices can immediately start communicating with the platform\n              </small>\n            </div>\n            <div class=\"m-b-16 m-t-16\">\n              <a\n                title=\"{{ 'Download template' | translate }}\"\n                class=\"btn btn-default btn-sm\"\n                target=\"_self\"\n                (click)=\"downloadEst()\"\n              >\n                <i c8yIcon=\"download\"></i>\n                {{ 'Download template' | translate }}\n              </a>\n            </div>\n          </div>\n      </div>\n\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        [showButtons]=\"{ cancel: true, next: true }\"\n        [disabled]=\"form.invalid\"\n        [pending]=\"pending\"\n        (onCancel)=\"cancel()\"\n        (onNext)=\"upload()\"\n        [labels]=\"{ next: 'Upload' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n\n    <cdk-step state=\"final\">\n      <div class=\"m-24\">\n        <div *ngIf=\"success; else warning\">\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"success\"\n            class=\"lead\"\n          ></c8y-operation-result>\n        </div>\n        <ng-template #warning>\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"error\"\n            class=\"lead\"\n          ></c8y-operation-result>\n        </ng-template>\n        <c8y-list-group class=\"separator-top m-t-16\">\n          <ng-container *ngIf=\"result; else failedResponse\">\n            <c8y-li *ngIf=\"success; else fail\">\n              <c8y-li-icon class=\"text-success\" icon=\"check-circle\"></c8y-li-icon>\n              <p>{{ 'All devices have been processed.' | translate }}</p>\n              <c8y-li-collapse>\n                <pre><code>{{ result | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n            <ng-template #fail>\n              <c8y-li>\n                <c8y-li-icon class=\"text-danger\" icon=\"ban\"></c8y-li-icon>\n                <p\n                  ngNonBindable\n                  [translateParams]=\"{ count: result?.numberOfFailed, total: result?.numberOfAll }\"\n                  translate\n                >\n                  Failed to process {{ count }} out of {{ total }}.\n                </p>\n                <c8y-li-collapse>\n                  <pre><code>{{ result | json }}</code></pre>\n                </c8y-li-collapse>\n              </c8y-li>\n            </ng-template>\n          </ng-container>\n          <ng-template #failedResponse>\n            <c8y-li>\n              <c8y-li-icon class=\"text-danger\" [icon]=\"'ban'\"></c8y-li-icon>\n              <small>{{ failedResult?.message | translate }}</small>\n              <c8y-li-collapse>\n                <pre><code>{{ failedResult | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n          </ng-template>\n        </c8y-list-group>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        [showButtons]=\"{ next: true }\"\n        (onNext)=\"complete()\"\n        [labels]=\"{ next: success ? 'Close' : 'Cancel' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n  </c8y-stepper>\n</c8y-modal>\n", dependencies: [{ kind: "directive", type: i1$1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i1$1.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i5$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$1.OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "component", type: i1$1.ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "component", type: i1$1.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "component", type: i1$1.C8yStepper, selector: "c8y-stepper", inputs: ["disableDefaultIcons", "disableProgressButtons", "customClasses", "hideStepProgress", "useStepLabelsAsTitlesOnly"], outputs: ["onStepChange"] }, { kind: "component", type: i6.CdkStep, selector: "cdk-step", inputs: ["stepControl", "label", "errorMessage", "aria-label", "aria-labelledby", "state", "editable", "optional", "completed", "hasError"], outputs: ["interacted"], exportAs: ["cdkStep"] }, { kind: "component", type: i1$1.C8yStepperButtons, selector: "c8y-stepper-buttons", inputs: ["labels", "pending", "disabled", "showButtons"], outputs: ["onCancel", "onNext", "onBack", "onCustom"] }, { kind: "component", type: i1$1.ListGroupComponent, selector: "c8y-list-group" }, { kind: "component", type: i1$1.ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: i1$1.ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: i1$1.ListItemCollapseComponent, selector: "c8y-list-item-collapse, c8y-li-collapse", inputs: ["collapseWay"] }, { kind: "component", type: i7.FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "pipe", type: i1$1.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i5$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5$1.JsonPipe, name: "json" }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: BulkDeviceRegistrationModalComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'bulk-device-registration', standalone: false, template: "<c8y-modal\n  [title]=\"'Bulk device registration' | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <i c8yIcon=\"upload\"></i>\n  </ng-container>\n\n  <c8y-stepper [hideStepProgress]=\"true\" linear id=\"modal-body\">\n    <cdk-step>\n      <p class=\"modal-subtitle sticky-top\" translate>Register devices in bulk</p>\n\n      <c8y-form-group class=\"d-block p-24 p-t-16 p-b-0 m-b-0\">\n        <formly-form [form]=\"form\" [fields]=\"template\" [model]=\"model\"></formly-form>\n      </c8y-form-group>\n\n      <div class=\"p-24 m-t-0 bg-level-1\">\n          <div class=\"bg-gray-white separator-bottom p-t-16 p-b-16 p-l-24 p-r-24\">\n            <div>\n              <p class=\"m-b-8 text-medium\">\n                <strong translate>Simple registration</strong>\n              </p>\n              <small class=\"text-muted\" translate>\n                Creates all registration requests at once, then each one needs to go through regular\n                acceptance process.\n              </small>\n            </div>\n            <div class=\"m-b-16 m-t-16\">\n              <a\n                title=\"{{ 'Download template' | translate }}\"\n                class=\"btn btn-default btn-sm\"\n                target=\"_self\"\n                (click)=\"downloadSimple()\"\n              >\n                <i c8yIcon=\"download\" translate></i>\n                {{ 'Download template' | translate }}\n              </a>\n            </div>\n          </div>\n          <div class=\"bg-gray-white separator-bottom p-t-16 p-b-16 p-l-24 p-r-24\">\n            <div>\n              <p class=\"m-b-8 text-medium\">\n                <strong translate>Full registration</strong>\n              </p>\n              <small class=\"text-muted\" translate>\n                Creates all device credentials and devices using provided list of property values.\n                Devices can start communicating with the platform immediately.\n              </small>\n            </div>\n            <div class=\"m-b-16 m-t-16\">\n              <a\n                title=\"{{ 'Download template' | translate }}\"\n                class=\"btn btn-default btn-sm\"\n                target=\"_self\"\n                (click)=\"downloadFull()\"\n              >\n                <i c8yIcon=\"download\" translate></i>\n                {{ 'Download template' | translate }}\n              </a>\n            </div>\n          </div>\n          <div class=\"bg-gray-white separator-bottom p-t-16 p-b-16 p-l-24 p-r-24\" *ngIf=\"certificateAuthorityFeatureEnabled | async\">\n            <div>\n              <p class=\"m-b-8 text-medium\">\n                <strong translate>Full registration with device certificate creation</strong>\n              </p>\n              <small class=\"text-muted\" translate>\n                Creates device certificates and devices using the provided list of property values. Once the certificates are provisioned, the devices can immediately start communicating with the platform\n              </small>\n            </div>\n            <div class=\"m-b-16 m-t-16\">\n              <a\n                title=\"{{ 'Download template' | translate }}\"\n                class=\"btn btn-default btn-sm\"\n                target=\"_self\"\n                (click)=\"downloadEst()\"\n              >\n                <i c8yIcon=\"download\"></i>\n                {{ 'Download template' | translate }}\n              </a>\n            </div>\n          </div>\n      </div>\n\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        [showButtons]=\"{ cancel: true, next: true }\"\n        [disabled]=\"form.invalid\"\n        [pending]=\"pending\"\n        (onCancel)=\"cancel()\"\n        (onNext)=\"upload()\"\n        [labels]=\"{ next: 'Upload' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n\n    <cdk-step state=\"final\">\n      <div class=\"m-24\">\n        <div *ngIf=\"success; else warning\">\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"success\"\n            class=\"lead\"\n          ></c8y-operation-result>\n        </div>\n        <ng-template #warning>\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"error\"\n            class=\"lead\"\n          ></c8y-operation-result>\n        </ng-template>\n        <c8y-list-group class=\"separator-top m-t-16\">\n          <ng-container *ngIf=\"result; else failedResponse\">\n            <c8y-li *ngIf=\"success; else fail\">\n              <c8y-li-icon class=\"text-success\" icon=\"check-circle\"></c8y-li-icon>\n              <p>{{ 'All devices have been processed.' | translate }}</p>\n              <c8y-li-collapse>\n                <pre><code>{{ result | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n            <ng-template #fail>\n              <c8y-li>\n                <c8y-li-icon class=\"text-danger\" icon=\"ban\"></c8y-li-icon>\n                <p\n                  ngNonBindable\n                  [translateParams]=\"{ count: result?.numberOfFailed, total: result?.numberOfAll }\"\n                  translate\n                >\n                  Failed to process {{ count }} out of {{ total }}.\n                </p>\n                <c8y-li-collapse>\n                  <pre><code>{{ result | json }}</code></pre>\n                </c8y-li-collapse>\n              </c8y-li>\n            </ng-template>\n          </ng-container>\n          <ng-template #failedResponse>\n            <c8y-li>\n              <c8y-li-icon class=\"text-danger\" [icon]=\"'ban'\"></c8y-li-icon>\n              <small>{{ failedResult?.message | translate }}</small>\n              <c8y-li-collapse>\n                <pre><code>{{ failedResult | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n          </ng-template>\n        </c8y-list-group>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        [showButtons]=\"{ next: true }\"\n        (onNext)=\"complete()\"\n        [labels]=\"{ next: success ? 'Close' : 'Cancel' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n  </c8y-stepper>\n</c8y-modal>\n" }]
-        }], ctorParameters: () => [{ type: i1$1.C8yJSONSchema }, { type: i2.DeviceRegistrationBulkService }, { type: RegisterDeviceService }, { type: i4.BsModalRef }, { type: i1$1.GainsightService }, { type: i1$1.FeatureCacheService }, { type: i5.TranslateService }], propDecorators: { stepper: [{
-                type: ViewChild,
-                args: [C8yStepper, { static: true }]
-            }] } });
+        }], ctorParameters: () => [{ type: i1.Router }, { type: i1$1.DeviceRegistrationService }, { type: i1$2.AlertService }] });
 
 class GeneralDeviceRegistrationComponent {
-    constructor(tenantUIService, tenantService, registerDeviceService, inventoryService, cd, bsModalRef, gainsightService, deviceRegistrationService, featureCacheService) {
+    constructor(tenantUIService, tenantService, registerDeviceService, inventoryService, cd, bsModalRef, gainsightService, featureCacheService) {
         this.tenantUIService = tenantUIService;
         this.tenantService = tenantService;
         this.registerDeviceService = registerDeviceService;
@@ -348,7 +214,6 @@ class GeneralDeviceRegistrationComponent {
         this.cd = cd;
         this.bsModalRef = bsModalRef;
         this.gainsightService = gainsightService;
-        this.deviceRegistrationService = deviceRegistrationService;
         this.featureCacheService = featureCacheService;
         this.MANAGEMENT = 'management';
         this.FILTER = {
@@ -504,7 +369,7 @@ class GeneralDeviceRegistrationComponent {
         this.destroy$.complete();
     }
     registerDevice(eventObject) {
-        !this.useEST$.getValue() ? this.create(eventObject) : this.registerByEst(eventObject);
+        this.create(eventObject);
     }
     fixErrors(event, failedRequests) {
         if (failedRequests && failedRequests.length > 0) {
@@ -529,7 +394,7 @@ class GeneralDeviceRegistrationComponent {
         if (this.model?.devicesToCreate?.length > 0) {
             this.lastCreatedDevices = [...this.model.devicesToCreate];
             const dataToSend = this.model.devicesToCreate.map((el) => {
-                const { id, tenant, group } = el;
+                const { id, tenant, group, oneTimePassword } = el;
                 let data = { id };
                 if (tenant?.id) {
                     data = { ...data, tenantId: tenant.id };
@@ -537,6 +402,9 @@ class GeneralDeviceRegistrationComponent {
                 if (group?.id) {
                     data = { ...data, groupId: group.id };
                 }
+                if (oneTimePassword) {
+                    data = { ...data, enrollmentToken: oneTimePassword };
+                }
                 return data;
             });
             this.registerDeviceService
@@ -563,52 +431,6 @@ class GeneralDeviceRegistrationComponent {
             });
         }
     }
-    registerByEst(eventObject) {
-        this.lastCreatedDevices = [...this.model.devicesToCreate];
-        this.deviceRegistrationService
-            .create(this.convertObjectToCSVFile(this.model.devicesToCreate))
-            .then(({ res, data }) => {
-            if (res.status < 400) {
-                this.failed = data.failedCreationList.map(value => {
-                    return {
-                        id: value.deviceId,
-                        message: value.failureReason
-                    };
-                });
-                const failedIds = new Set(this.failed.map(item => item.id));
-                this.success = this.model.devicesToCreate.filter(item => !failedIds.has(item.id));
-            }
-            eventObject.stepper.next();
-        })
-            .catch(() => {
-            eventObject.stepper.next();
-        });
-    }
-    convertObjectToCSVFile(data) {
-        const fullCsvHeaders = ESTCsvHeaders;
-        const csvHeaders = fullCsvHeaders.join(';') + '\n';
-        const dataToSend = data.map(el => {
-            return {
-                ID: el.id,
-                AUTH_TYPE: 'CERTIFICATES',
-                ENROLLMENT_OTP: el.oneTimePassword,
-                PATH: el.group?.id || '',
-                TENANT: el.tenant?.id || ''
-            };
-        });
-        const escapeValue = (value) => {
-            if (value.includes(';') || value.includes('"')) {
-                return `"${value.replace(/"/g, '""')}"`;
-            }
-            return value;
-        };
-        const csvRows = dataToSend
-            .map(row => fullCsvHeaders.map(header => escapeValue(row[header] ?? '')).join(';'))
-            .join('\n');
-        const csvContent = csvHeaders + csvRows;
-        const blob = new Blob([csvContent], { type: 'text/csv' });
-        return new File([blob], `ESTRegistrationFile.csv`, { type: 'text/csv' });
-    }
     canLoadTenants$() {
         return defer(() => from(this.tenantUIService.isManagementTenant())).pipe(shareReplay(1));
     }
@@ -618,8 +440,8 @@ class GeneralDeviceRegistrationComponent {
     getGroups$() {
         return defer(() => from(this.inventoryService.listQuery({ __filter: { __has: 'c8y_IsDeviceGroup' }, __orderby: [{ name: 1 }] }, { ...this.FILTER }))).pipe(shareReplay(1));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: GeneralDeviceRegistrationComponent, deps: [{ token: i1$1.TenantUiService }, { token: i2.TenantService }, { token: RegisterDeviceService }, { token: i2.InventoryService }, { token: i0.ChangeDetectorRef }, { token: i4.BsModalRef }, { token: i1$1.GainsightService }, { token: i2.DeviceRegistrationBulkService }, { token: i1$1.FeatureCacheService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: GeneralDeviceRegistrationComponent, isStandalone: false, selector: "c8y-general-device-registration", ngImport: i0, template: "<c8y-modal\n  [title]=\"'Register devices' | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <span [c8yIcon]=\"'c8y-device-connect'\"></span>\n  </ng-container>\n  <c8y-stepper\n    [hideStepProgress]=\"true\"\n    linear\n    c8y-modal-body\n  >\n    <cdk-step [stepControl]=\"form\">\n      <div class=\"text-center sticky-top bg-component\">\n        <p\n          class=\"text-medium text-16 separator-bottom p-16\"\n          translate\n        >\n          Register general devices\n        </p>\n        <label\n          class=\"c8y-switch m-24 a-i-center\"\n          title=\"{{ 'Create device certificates during device registration' | translate }}\"\n          for=\"useEST\"\n          *ngIf=\"certificateAuthorityFeatureEnabled | async\"\n        >\n          <input\n            id=\"useEST\"\n            name=\"useEST\"\n            type=\"checkbox\"\n            [ngModel]=\"useEST$.getValue()\"\n            (ngModelChange)=\"useEST$.next($event)\"\n          />\n          <span></span>\n          <span class=\"control-label\">\n            {{ 'Create device certificates during device registration' | translate }}\n          </span>\n          <button\n            class=\"btn-help\"\n            [attr.aria-label]=\"'Help' | translate\"\n            popover=\"{{\n              'The device registration process includes creating device certificates, which are issued by the tenant\\'s Certificate Authority (CA).'\n                | translate\n            }}\"\n            placement=\"right\"\n            triggers=\"focus\"\n            container=\"body\"\n            type=\"button\"\n          ></button>\n        </label>\n      </div>\n      <div>\n        <formly-form\n          class=\"formly-group-array-cols d-block p-l-24 p-b-24 min-height-fit p-r-8\"\n          [form]=\"form\"\n          [fields]=\"fields\"\n          [model]=\"model\"\n          [options]=\"options\"\n          [ngClass]=\"{ 'p-t-24': !(certificateAuthorityFeatureEnabled | async) }\"\n        ></formly-form>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        (onNext)=\"registerDevice($event)\"\n        (onCancel)=\"cancel()\"\n        [showButtons]=\"{ cancel: true, next: true }\"\n        [disabled]=\"!form?.valid\"\n        [pending]=\"isLoading$ | async\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n    <cdk-step state=\"final\">\n      <div class=\"p-24 min-height-fit\">\n        <c8y-operation-result\n          class=\"lead\"\n          type=\"success\"\n          *ngIf=\"success.length === 1 && failed.length === 0\"\n          text=\"{{ 'Device registered' | translate }}\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n        ></c8y-operation-result>\n        <c8y-operation-result\n          class=\"lead\"\n          type=\"error\"\n          *ngIf=\"success.length === 0 && failed.length === 1\"\n          text=\"{{ 'Failed to register device' | translate }}\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n        ></c8y-operation-result>\n\n        <ng-container *ngIf=\"success.length > 1 || failed.length > 1\">\n          <c8y-operation-result\n            class=\"lead\"\n            type=\"success\"\n            *ngIf=\"failed.length === 0\"\n            [text]=\"\n              '{{ successfulDevicesCount }} devices registered'\n                | translate: { successfulDevicesCount: success.length }\n            \"\n            [size]=\"84\"\n            [vertical]=\"true\"\n          ></c8y-operation-result>\n          <c8y-operation-result\n            class=\"lead\"\n            type=\"error\"\n            *ngIf=\"success.length === 0\"\n            [text]=\"\n              '{{ failedDevicesCount }} devices failed to register'\n                | translate: { failedDevicesCount: failed.length }\n            \"\n            [size]=\"84\"\n            [vertical]=\"true\"\n          ></c8y-operation-result>\n        </ng-container>\n\n        <div\n          class=\"p-l-24 p-r-24 text-center\"\n          data-cy=\"device-registration-failure-message\"\n          *ngIf=\"success.length > 0 && failed.length > 0\"\n        >\n          <c8y-operation-result\n            class=\"lead\"\n            type=\"error\"\n            text=\"{{ 'Several devices failed to register' | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n          ></c8y-operation-result>\n          <p\n            class=\"p-b-16 text-danger\"\n            ngNonBindable\n            translate\n            [translateParams]=\"{ count: failed.length, total: failed.length + success.length }\"\n          >\n            Registration failed for {{ count }} devices out of {{ total }}.\n          </p>\n        </div>\n\n        <div\n          class=\"m-b-8 p-l-24 p-r-24\"\n          data-cy=\"device-registration-success-message\"\n          *ngIf=\"success.length > 0\"\n        >\n          <span\n            *ngIf=\"!(useEST$ | async)\"\n            translate\n          >\n            Turn on the registered devices and wait for connections to be established. Once a device\n            is connected, its status will change to \"Pending acceptance\". You will need to approve\n            it by clicking on the \"Accept\" button.\n          </span>\n          <span\n            *ngIf=\"useEST$ | async\"\n            translate\n          >\n            The successfully enrolled devices can now request signed certificates and use them to\n            connect and authenticate to the platform via certificate-based authentication.\n          </span>\n        </div>\n\n        <c8y-list-group class=\"separator-top m-t-16\">\n          <c8y-li *ngFor=\"let fail of failed\">\n            <c8y-li-icon\n              class=\"text-danger\"\n              [icon]=\"'ban'\"\n            ></c8y-li-icon>\n            <p>{{ fail?.id }}</p>\n            <small>{{ fail?.message | translate }}</small>\n            <c8y-li-collapse>\n              <pre><code>{{ fail?.details | json }}</code></pre>\n            </c8y-li-collapse>\n          </c8y-li>\n\n          <c8y-li *ngFor=\"let s of success\">\n            <c8y-li-icon\n              class=\"text-success\"\n              [icon]=\"'check-circle'\"\n            ></c8y-li-icon>\n            {{ s?.id }}\n          </c8y-li>\n        </c8y-list-group>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        (onCustom)=\"close()\"\n        (onBack)=\"fixErrors($event, failed)\"\n        [showButtons]=\"{ back: failed.length > 0, custom: true }\"\n        [labels]=\"{ back: 'Fix errors', custom: 'Close' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n  </c8y-stepper>\n</c8y-modal>\n", dependencies: [{ kind: "directive", type: i5$2.PopoverDirective, selector: "[popover]", inputs: ["adaptivePosition", "boundariesElement", "popover", "popoverContext", "popoverTitle", "placement", "outsideClick", "triggers", "container", "containerClass", "isOpen", "delay"], outputs: ["onShown", "onHidden"], exportAs: ["bs-popover"] }, { kind: "directive", type: i1$1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i1$1.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i5$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$1.OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "component", type: i1$1.ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "directive", type: i8.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i1$1.C8yStepper, selector: "c8y-stepper", inputs: ["disableDefaultIcons", "disableProgressButtons", "customClasses", "hideStepProgress", "useStepLabelsAsTitlesOnly"], outputs: ["onStepChange"] }, { kind: "component", type: i6.CdkStep, selector: "cdk-step", inputs: ["stepControl", "label", "errorMessage", "aria-label", "aria-labelledby", "state", "editable", "optional", "completed", "hasError"], outputs: ["interacted"], exportAs: ["cdkStep"] }, { kind: "component", type: i1$1.C8yStepperButtons, selector: "c8y-stepper-buttons", inputs: ["labels", "pending", "disabled", "showButtons"], outputs: ["onCancel", "onNext", "onBack", "onCustom"] }, { kind: "component", type: i1$1.ListGroupComponent, selector: "c8y-list-group" }, { kind: "component", type: i1$1.ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: i1$1.ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: i1$1.ListItemCollapseComponent, selector: "c8y-list-item-collapse, c8y-li-collapse", inputs: ["collapseWay"] }, { kind: "component", type: i7.FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "pipe", type: i1$1.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i5$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5$1.JsonPipe, name: "json" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: GeneralDeviceRegistrationComponent, deps: [{ token: i1$2.TenantUiService }, { token: i1$1.TenantService }, { token: RegisterDeviceService }, { token: i1$1.InventoryService }, { token: i0.ChangeDetectorRef }, { token: i4.BsModalRef }, { token: i1$2.GainsightService }, { token: i1$2.FeatureCacheService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: GeneralDeviceRegistrationComponent, isStandalone: true, selector: "c8y-general-device-registration", ngImport: i0, template: "<c8y-modal\n  [title]=\"'Register devices' | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <span [c8yIcon]=\"'c8y-device-connect'\"></span>\n  </ng-container>\n  <c8y-stepper\n    [hideStepProgress]=\"true\"\n    linear\n    c8y-modal-body\n  >\n    <cdk-step [stepControl]=\"form\">\n      <div class=\"text-center sticky-top bg-component\">\n        <p\n          class=\"text-medium text-16 separator-bottom p-16\"\n          translate\n        >\n          Register general devices\n        </p>\n        <label\n          class=\"c8y-switch m-24 a-i-center\"\n          title=\"{{ 'Create device certificates during device registration' | translate }}\"\n          for=\"useEST\"\n          *ngIf=\"certificateAuthorityFeatureEnabled | async\"\n        >\n          <input\n            id=\"useEST\"\n            name=\"useEST\"\n            type=\"checkbox\"\n            [ngModel]=\"useEST$.getValue()\"\n            (ngModelChange)=\"useEST$.next($event)\"\n          />\n          <span></span>\n          <span class=\"control-label\">\n            {{ 'Create device certificates during device registration' | translate }}\n          </span>\n          <button\n            class=\"btn-help\"\n            [attr.aria-label]=\"'Help' | translate\"\n            popover=\"{{\n              'The device registration process includes creating device certificates, which are issued by the tenant\\'s Certificate Authority (CA).'\n                | translate\n            }}\"\n            placement=\"right\"\n            triggers=\"focus\"\n            container=\"body\"\n            type=\"button\"\n          ></button>\n        </label>\n      </div>\n      <div>\n        <formly-form\n          class=\"formly-group-array-cols d-block p-l-24 p-b-24 min-height-fit p-r-8\"\n          [form]=\"form\"\n          [fields]=\"fields\"\n          [model]=\"model\"\n          [options]=\"options\"\n          [ngClass]=\"{ 'p-t-24': !(certificateAuthorityFeatureEnabled | async) }\"\n        ></formly-form>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        (onNext)=\"registerDevice($event)\"\n        (onCancel)=\"cancel()\"\n        [showButtons]=\"{ cancel: true, next: true }\"\n        [disabled]=\"!form?.valid\"\n        [pending]=\"isLoading$ | async\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n    <cdk-step state=\"final\">\n      <div class=\"p-24 min-height-fit\">\n        <c8y-operation-result\n          class=\"lead\"\n          type=\"success\"\n          *ngIf=\"success.length === 1 && failed.length === 0\"\n          text=\"{{ 'Device registered' | translate }}\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n        ></c8y-operation-result>\n        <c8y-operation-result\n          class=\"lead\"\n          type=\"error\"\n          *ngIf=\"success.length === 0 && failed.length === 1\"\n          text=\"{{ 'Failed to register device' | translate }}\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n        ></c8y-operation-result>\n\n        <ng-container *ngIf=\"success.length > 1 || failed.length > 1\">\n          <c8y-operation-result\n            class=\"lead\"\n            type=\"success\"\n            *ngIf=\"failed.length === 0\"\n            [text]=\"\n              '{{ successfulDevicesCount }} devices registered'\n                | translate: { successfulDevicesCount: success.length }\n            \"\n            [size]=\"84\"\n            [vertical]=\"true\"\n          ></c8y-operation-result>\n          <c8y-operation-result\n            class=\"lead\"\n            type=\"error\"\n            *ngIf=\"success.length === 0\"\n            [text]=\"\n              '{{ failedDevicesCount }} devices failed to register'\n                | translate: { failedDevicesCount: failed.length }\n            \"\n            [size]=\"84\"\n            [vertical]=\"true\"\n          ></c8y-operation-result>\n        </ng-container>\n\n        <div\n          class=\"p-l-24 p-r-24 text-center\"\n          data-cy=\"device-registration-failure-message\"\n          *ngIf=\"success.length > 0 && failed.length > 0\"\n        >\n          <c8y-operation-result\n            class=\"lead\"\n            type=\"error\"\n            text=\"{{ 'Several devices failed to register' | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n          ></c8y-operation-result>\n          <p\n            class=\"p-b-16 text-danger\"\n            ngNonBindable\n            translate\n            [translateParams]=\"{ count: failed.length, total: failed.length + success.length }\"\n          >\n            Registration failed for {{ count }} devices out of {{ total }}.\n          </p>\n        </div>\n\n        <div\n          class=\"m-b-8 p-l-24 p-r-24\"\n          data-cy=\"device-registration-success-message\"\n          *ngIf=\"success.length > 0\"\n        >\n          <span\n            *ngIf=\"!(useEST$ | async)\"\n            translate\n          >\n            Turn on the registered devices and wait for connections to be established. Once a device\n            is connected, its status will change to \"Pending acceptance\". You will need to approve\n            it by clicking on the \"Accept\" button.\n          </span>\n          <span\n            *ngIf=\"useEST$ | async\"\n            translate\n          >\n            The successfully enrolled devices can now request signed certificates and use them to\n            connect and authenticate to the platform via certificate-based authentication.\n          </span>\n        </div>\n\n        <c8y-list-group class=\"separator-top m-t-16\">\n          <c8y-li *ngFor=\"let fail of failed\">\n            <c8y-li-icon\n              class=\"text-danger\"\n              [icon]=\"'ban'\"\n            ></c8y-li-icon>\n            <p>{{ fail?.id }}</p>\n            <small>{{ fail?.message | translate }}</small>\n            <c8y-li-collapse>\n              <pre><code>{{ fail?.details | json }}</code></pre>\n            </c8y-li-collapse>\n          </c8y-li>\n\n          <c8y-li *ngFor=\"let s of success\">\n            <c8y-li-icon\n              class=\"text-success\"\n              [icon]=\"'check-circle'\"\n            ></c8y-li-icon>\n            {{ s?.id }}\n          </c8y-li>\n        </c8y-list-group>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        (onCustom)=\"close()\"\n        (onBack)=\"fixErrors($event, failed)\"\n        [showButtons]=\"{ back: failed.length > 0, custom: true }\"\n        [labels]=\"{ back: 'Fix errors', custom: 'Close' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n  </c8y-stepper>\n</c8y-modal>\n", dependencies: [{ kind: "component", type: ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: C8yStepper, selector: "c8y-stepper", inputs: ["disableDefaultIcons", "disableProgressButtons", "customClasses", "hideStepProgress", "useStepLabelsAsTitlesOnly"], outputs: ["onStepChange"] }, { kind: "component", type: CdkStep, selector: "cdk-step", inputs: ["stepControl", "label", "errorMessage", "aria-label", "aria-labelledby", "state", "editable", "optional", "completed", "hasError"], outputs: ["interacted"], exportAs: ["cdkStep"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i6.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { 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: "directive", type: PopoverDirective, selector: "[popover]", inputs: ["adaptivePosition", "boundariesElement", "popover", "popoverContext", "popoverTitle", "placement", "outsideClick", "triggers", "container", "containerClass", "isOpen", "delay"], outputs: ["onShown", "onHidden"], exportAs: ["bs-popover"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i5.FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: C8yStepperButtons, selector: "c8y-stepper-buttons", inputs: ["labels", "pending", "disabled", "showButtons"], outputs: ["onCancel", "onNext", "onBack", "onCustom"] }, { kind: "component", type: OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { 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: "component", type: ListItemCollapseComponent, selector: "c8y-list-item-collapse, c8y-li-collapse", inputs: ["collapseWay"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: JsonPipe, name: "json" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 __decorate([
     memoize(),
@@ -641,8 +463,29 @@ __decorate([
 ], GeneralDeviceRegistrationComponent.prototype, "getGroups$", null);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: GeneralDeviceRegistrationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-general-device-registration', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<c8y-modal\n  [title]=\"'Register devices' | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <span [c8yIcon]=\"'c8y-device-connect'\"></span>\n  </ng-container>\n  <c8y-stepper\n    [hideStepProgress]=\"true\"\n    linear\n    c8y-modal-body\n  >\n    <cdk-step [stepControl]=\"form\">\n      <div class=\"text-center sticky-top bg-component\">\n        <p\n          class=\"text-medium text-16 separator-bottom p-16\"\n          translate\n        >\n          Register general devices\n        </p>\n        <label\n          class=\"c8y-switch m-24 a-i-center\"\n          title=\"{{ 'Create device certificates during device registration' | translate }}\"\n          for=\"useEST\"\n          *ngIf=\"certificateAuthorityFeatureEnabled | async\"\n        >\n          <input\n            id=\"useEST\"\n            name=\"useEST\"\n            type=\"checkbox\"\n            [ngModel]=\"useEST$.getValue()\"\n            (ngModelChange)=\"useEST$.next($event)\"\n          />\n          <span></span>\n          <span class=\"control-label\">\n            {{ 'Create device certificates during device registration' | translate }}\n          </span>\n          <button\n            class=\"btn-help\"\n            [attr.aria-label]=\"'Help' | translate\"\n            popover=\"{{\n              'The device registration process includes creating device certificates, which are issued by the tenant\\'s Certificate Authority (CA).'\n                | translate\n            }}\"\n            placement=\"right\"\n            triggers=\"focus\"\n            container=\"body\"\n            type=\"button\"\n          ></button>\n        </label>\n      </div>\n      <div>\n        <formly-form\n          class=\"formly-group-array-cols d-block p-l-24 p-b-24 min-height-fit p-r-8\"\n          [form]=\"form\"\n          [fields]=\"fields\"\n          [model]=\"model\"\n          [options]=\"options\"\n          [ngClass]=\"{ 'p-t-24': !(certificateAuthorityFeatureEnabled | async) }\"\n        ></formly-form>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        (onNext)=\"registerDevice($event)\"\n        (onCancel)=\"cancel()\"\n        [showButtons]=\"{ cancel: true, next: true }\"\n        [disabled]=\"!form?.valid\"\n        [pending]=\"isLoading$ | async\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n    <cdk-step state=\"final\">\n      <div class=\"p-24 min-height-fit\">\n        <c8y-operation-result\n          class=\"lead\"\n          type=\"success\"\n          *ngIf=\"success.length === 1 && failed.length === 0\"\n          text=\"{{ 'Device registered' | translate }}\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n        ></c8y-operation-result>\n        <c8y-operation-result\n          class=\"lead\"\n          type=\"error\"\n          *ngIf=\"success.length === 0 && failed.length === 1\"\n          text=\"{{ 'Failed to register device' | translate }}\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n        ></c8y-operation-result>\n\n        <ng-container *ngIf=\"success.length > 1 || failed.length > 1\">\n          <c8y-operation-result\n            class=\"lead\"\n            type=\"success\"\n            *ngIf=\"failed.length === 0\"\n            [text]=\"\n              '{{ successfulDevicesCount }} devices registered'\n                | translate: { successfulDevicesCount: success.length }\n            \"\n            [size]=\"84\"\n            [vertical]=\"true\"\n          ></c8y-operation-result>\n          <c8y-operation-result\n            class=\"lead\"\n            type=\"error\"\n            *ngIf=\"success.length === 0\"\n            [text]=\"\n              '{{ failedDevicesCount }} devices failed to register'\n                | translate: { failedDevicesCount: failed.length }\n            \"\n            [size]=\"84\"\n            [vertical]=\"true\"\n          ></c8y-operation-result>\n        </ng-container>\n\n        <div\n          class=\"p-l-24 p-r-24 text-center\"\n          data-cy=\"device-registration-failure-message\"\n          *ngIf=\"success.length > 0 && failed.length > 0\"\n        >\n          <c8y-operation-result\n            class=\"lead\"\n            type=\"error\"\n            text=\"{{ 'Several devices failed to register' | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n          ></c8y-operation-result>\n          <p\n            class=\"p-b-16 text-danger\"\n            ngNonBindable\n            translate\n            [translateParams]=\"{ count: failed.length, total: failed.length + success.length }\"\n          >\n            Registration failed for {{ count }} devices out of {{ total }}.\n          </p>\n        </div>\n\n        <div\n          class=\"m-b-8 p-l-24 p-r-24\"\n          data-cy=\"device-registration-success-message\"\n          *ngIf=\"success.length > 0\"\n        >\n          <span\n            *ngIf=\"!(useEST$ | async)\"\n            translate\n          >\n            Turn on the registered devices and wait for connections to be established. Once a device\n            is connected, its status will change to \"Pending acceptance\". You will need to approve\n            it by clicking on the \"Accept\" button.\n          </span>\n          <span\n            *ngIf=\"useEST$ | async\"\n            translate\n          >\n            The successfully enrolled devices can now request signed certificates and use them to\n            connect and authenticate to the platform via certificate-based authentication.\n          </span>\n        </div>\n\n        <c8y-list-group class=\"separator-top m-t-16\">\n          <c8y-li *ngFor=\"let fail of failed\">\n            <c8y-li-icon\n              class=\"text-danger\"\n              [icon]=\"'ban'\"\n            ></c8y-li-icon>\n            <p>{{ fail?.id }}</p>\n            <small>{{ fail?.message | translate }}</small>\n            <c8y-li-collapse>\n              <pre><code>{{ fail?.details | json }}</code></pre>\n            </c8y-li-collapse>\n          </c8y-li>\n\n          <c8y-li *ngFor=\"let s of success\">\n            <c8y-li-icon\n              class=\"text-success\"\n              [icon]=\"'check-circle'\"\n            ></c8y-li-icon>\n            {{ s?.id }}\n          </c8y-li>\n        </c8y-list-group>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        (onCustom)=\"close()\"\n        (onBack)=\"fixErrors($event, failed)\"\n        [showButtons]=\"{ back: failed.length > 0, custom: true }\"\n        [labels]=\"{ back: 'Fix errors', custom: 'Close' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n  </c8y-stepper>\n</c8y-modal>\n" }]
-        }], ctorParameters: () => [{ type: i1$1.TenantUiService }, { type: i2.TenantService }, { type: RegisterDeviceService }, { type: i2.InventoryService }, { type: i0.ChangeDetectorRef }, { type: i4.BsModalRef }, { type: i1$1.GainsightService }, { type: i2.DeviceRegistrationBulkService }, { type: i1$1.FeatureCacheService }], propDecorators: { canLoadTenants$: [], getTenants$: [], getGroups$: [] } });
+            args: [{ selector: 'c8y-general-device-registration', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
+                        ModalComponent,
+                        IconDirective,
+                        C8yStepper,
+                        CdkStep,
+                        C8yTranslateDirective,
+                        NgIf,
+                        FormsModule,
+                        PopoverDirective,
+                        FormlyModule,
+                        NgClass,
+                        C8yStepperButtons,
+                        OperationResultComponent,
+                        ListGroupComponent,
+                        NgFor,
+                        ListItemComponent,
+                        ListItemIconComponent,
+                        ListItemCollapseComponent,
+                        C8yTranslatePipe,
+                        AsyncPipe,
+                        JsonPipe
+                    ], template: "<c8y-modal\n  [title]=\"'Register devices' | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <span [c8yIcon]=\"'c8y-device-connect'\"></span>\n  </ng-container>\n  <c8y-stepper\n    [hideStepProgress]=\"true\"\n    linear\n    c8y-modal-body\n  >\n    <cdk-step [stepControl]=\"form\">\n      <div class=\"text-center sticky-top bg-component\">\n        <p\n          class=\"text-medium text-16 separator-bottom p-16\"\n          translate\n        >\n          Register general devices\n        </p>\n        <label\n          class=\"c8y-switch m-24 a-i-center\"\n          title=\"{{ 'Create device certificates during device registration' | translate }}\"\n          for=\"useEST\"\n          *ngIf=\"certificateAuthorityFeatureEnabled | async\"\n        >\n          <input\n            id=\"useEST\"\n            name=\"useEST\"\n            type=\"checkbox\"\n            [ngModel]=\"useEST$.getValue()\"\n            (ngModelChange)=\"useEST$.next($event)\"\n          />\n          <span></span>\n          <span class=\"control-label\">\n            {{ 'Create device certificates during device registration' | translate }}\n          </span>\n          <button\n            class=\"btn-help\"\n            [attr.aria-label]=\"'Help' | translate\"\n            popover=\"{{\n              'The device registration process includes creating device certificates, which are issued by the tenant\\'s Certificate Authority (CA).'\n                | translate\n            }}\"\n            placement=\"right\"\n            triggers=\"focus\"\n            container=\"body\"\n            type=\"button\"\n          ></button>\n        </label>\n      </div>\n      <div>\n        <formly-form\n          class=\"formly-group-array-cols d-block p-l-24 p-b-24 min-height-fit p-r-8\"\n          [form]=\"form\"\n          [fields]=\"fields\"\n          [model]=\"model\"\n          [options]=\"options\"\n          [ngClass]=\"{ 'p-t-24': !(certificateAuthorityFeatureEnabled | async) }\"\n        ></formly-form>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        (onNext)=\"registerDevice($event)\"\n        (onCancel)=\"cancel()\"\n        [showButtons]=\"{ cancel: true, next: true }\"\n        [disabled]=\"!form?.valid\"\n        [pending]=\"isLoading$ | async\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n    <cdk-step state=\"final\">\n      <div class=\"p-24 min-height-fit\">\n        <c8y-operation-result\n          class=\"lead\"\n          type=\"success\"\n          *ngIf=\"success.length === 1 && failed.length === 0\"\n          text=\"{{ 'Device registered' | translate }}\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n        ></c8y-operation-result>\n        <c8y-operation-result\n          class=\"lead\"\n          type=\"error\"\n          *ngIf=\"success.length === 0 && failed.length === 1\"\n          text=\"{{ 'Failed to register device' | translate }}\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n        ></c8y-operation-result>\n\n        <ng-container *ngIf=\"success.length > 1 || failed.length > 1\">\n          <c8y-operation-result\n            class=\"lead\"\n            type=\"success\"\n            *ngIf=\"failed.length === 0\"\n            [text]=\"\n              '{{ successfulDevicesCount }} devices registered'\n                | translate: { successfulDevicesCount: success.length }\n            \"\n            [size]=\"84\"\n            [vertical]=\"true\"\n          ></c8y-operation-result>\n          <c8y-operation-result\n            class=\"lead\"\n            type=\"error\"\n            *ngIf=\"success.length === 0\"\n            [text]=\"\n              '{{ failedDevicesCount }} devices failed to register'\n                | translate: { failedDevicesCount: failed.length }\n            \"\n            [size]=\"84\"\n            [vertical]=\"true\"\n          ></c8y-operation-result>\n        </ng-container>\n\n        <div\n          class=\"p-l-24 p-r-24 text-center\"\n          data-cy=\"device-registration-failure-message\"\n          *ngIf=\"success.length > 0 && failed.length > 0\"\n        >\n          <c8y-operation-result\n            class=\"lead\"\n            type=\"error\"\n            text=\"{{ 'Several devices failed to register' | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n          ></c8y-operation-result>\n          <p\n            class=\"p-b-16 text-danger\"\n            ngNonBindable\n            translate\n            [translateParams]=\"{ count: failed.length, total: failed.length + success.length }\"\n          >\n            Registration failed for {{ count }} devices out of {{ total }}.\n          </p>\n        </div>\n\n        <div\n          class=\"m-b-8 p-l-24 p-r-24\"\n          data-cy=\"device-registration-success-message\"\n          *ngIf=\"success.length > 0\"\n        >\n          <span\n            *ngIf=\"!(useEST$ | async)\"\n            translate\n          >\n            Turn on the registered devices and wait for connections to be established. Once a device\n            is connected, its status will change to \"Pending acceptance\". You will need to approve\n            it by clicking on the \"Accept\" button.\n          </span>\n          <span\n            *ngIf=\"useEST$ | async\"\n            translate\n          >\n            The successfully enrolled devices can now request signed certificates and use them to\n            connect and authenticate to the platform via certificate-based authentication.\n          </span>\n        </div>\n\n        <c8y-list-group class=\"separator-top m-t-16\">\n          <c8y-li *ngFor=\"let fail of failed\">\n            <c8y-li-icon\n              class=\"text-danger\"\n              [icon]=\"'ban'\"\n            ></c8y-li-icon>\n            <p>{{ fail?.id }}</p>\n            <small>{{ fail?.message | translate }}</small>\n            <c8y-li-collapse>\n              <pre><code>{{ fail?.details | json }}</code></pre>\n            </c8y-li-collapse>\n          </c8y-li>\n\n          <c8y-li *ngFor=\"let s of success\">\n            <c8y-li-icon\n              class=\"text-success\"\n              [icon]=\"'check-circle'\"\n            ></c8y-li-icon>\n            {{ s?.id }}\n          </c8y-li>\n        </c8y-list-group>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        (onCustom)=\"close()\"\n        (onBack)=\"fixErrors($event, failed)\"\n        [showButtons]=\"{ back: failed.length > 0, custom: true }\"\n        [labels]=\"{ back: 'Fix errors', custom: 'Close' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n  </c8y-stepper>\n</c8y-modal>\n" }]
+        }], ctorParameters: () => [{ type: i1$2.TenantUiService }, { type: i1$1.TenantService }, { type: RegisterDeviceService }, { type: i1$1.InventoryService }, { type: i0.ChangeDetectorRef }, { type: i4.BsModalRef }, { type: i1$2.GainsightService }, { type: i1$2.FeatureCacheService }], propDecorators: { canLoadTenants$: [], getTenants$: [], getGroups$: [] } });
 
 class GeneralDeviceRegistrationService {
     constructor() {
@@ -683,11 +526,11 @@ class GeneralDeviceRegistrationButtonComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: GeneralDeviceRegistrationButtonComponent, deps: [{ token: GeneralDeviceRegistrationService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: GeneralDeviceRegistrationButtonComponent, isStandalone: false, selector: "c8y-general-device-registration-button", ngImport: i0, template: "<button title=\"{{ 'General' | translate }}\" type=\"button\" (click)=\"open()\">\n  <i c8yIcon=\"c8y-device-connect\"></i>\n  {{ 'General' | translate }}\n</button>\n", dependencies: [{ kind: "directive", type: i1$1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "pipe", type: i1$1.C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: GeneralDeviceRegistrationButtonComponent, isStandalone: true, selector: "c8y-general-device-registration-button", ngImport: i0, template: "<button title=\"{{ 'General' | translate }}\" type=\"button\" (click)=\"open()\">\n  <i c8yIcon=\"c8y-device-connect\"></i>\n  {{ 'General' | translate }}\n</button>\n", dependencies: [{ 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: GeneralDeviceRegistrationButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-general-device-registration-button', standalone: false, template: "<button title=\"{{ 'General' | translate }}\" type=\"button\" (click)=\"open()\">\n  <i c8yIcon=\"c8y-device-connect\"></i>\n  {{ 'General' | translate }}\n</button>\n" }]
+            args: [{ selector: 'c8y-general-device-registration-button', imports: [IconDirective, C8yTranslatePipe], template: "<button title=\"{{ 'General' | translate }}\" type=\"button\" (click)=\"open()\">\n  <i c8yIcon=\"c8y-device-connect\"></i>\n  {{ 'General' | translate }}\n</button>\n" }]
         }], ctorParameters: () => [{ type: GeneralDeviceRegistrationService }] });
 
 /**
@@ -734,7 +577,7 @@ class RegisterDeviceExtensionService extends ExtensionPointWithoutStateForPlugin
             () => this.factories
         ]).pipe(startWith([]), shareReplay(1));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: RegisterDeviceExtensionService, deps: [{ token: i0.Injector }, { token: i1.Router }, { token: i1$1.PluginsResolveService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: RegisterDeviceExtensionService, deps: [{ token: i0.Injector }, { token: i1.Router }, { token: i1$2.PluginsResolveService }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: RegisterDeviceExtensionService, providedIn: 'root' }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: RegisterDeviceExtensionService, decorators: [{
@@ -742,7 +585,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
             args: [{
                     providedIn: 'root'
                 }]
-        }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.Router }, { type: i1$1.PluginsResolveService }] });
+        }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.Router }, { type: i1$2.PluginsResolveService }] });
 
 class RegisterDeviceDropdownComponent {
     constructor(registerDeviceExtensionService, registerDeviceService) {
@@ -753,11 +596,23 @@ class RegisterDeviceDropdownComponent {
         this.limit$ = this.registerDeviceService.limit$.pipe(map(limit => limit.isReached));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: RegisterDeviceDropdownComponent, deps: [{ token: RegisterDeviceExtensionService }, { token: RegisterDeviceService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: RegisterDeviceDropdownComponent, isStandalone: false, selector: "c8y-register-device-dropdown", ngImport: i0, template: "<div class=\"dropdown\" dropdown>\n  <button\n    *ngIf=\"!(limit$ | async); else disable\"\n    title=\"{{ 'Register device' | translate }}\"\n    type=\"button\"\n    class=\"dropdown-toggle c8y-dropdown d-flex a-i-center\"\n    dropdownToggle\n    aria-haspopup=\"true\"\n    data-cy=\"register-device--dropdown-button\"\n  >\n    <span class=\"text-truncate\" translate>Register device</span>\n    <i [c8yIcon]=\"'caret-down'\" class=\"m-l-4 text-primary\"></i>\n  </button>\n  <ng-template #disable>\n    <button\n      title=\"{{ 'Device registration disabled' | translate }}\"\n      type=\"button\"\n      class=\"btn btn-clean d-flex p-l-8\"\n      disabled\n    >\n      <span class=\"text-truncate\" translate>Register device</span>\n      <i [c8yIcon]=\"'caret-down'\"></i>\n    </button>\n  </ng-template>\n\n  <!-- dropdown for normal screen sizes -->\n  <ul class=\"dropdown-menu dropdown-menu-right hidden-xs\" data-cy=\"register-device--dropdown\" *dropdownMenu>\n    <ng-container *ngTemplateOutlet=\"dropdown\"></ng-container>\n  </ul>\n\n  <!-- fake dropdown for mobile screen sizes. *dropdownMenu is missing by design! -->\n  <ul class=\"dropdown-menu dropdown-menu visible-xs\">\n    <ng-container *ngTemplateOutlet=\"dropdown\"></ng-container>\n  </ul>\n\n  <ng-template #dropdown>\n    <ng-container *ngIf=\"single$ | async as single\">\n      <li class=\"dropdown-header\" *ngIf=\"single.length > 0\" translate data-cy=\"single-group\">Single registration</li>\n      <li *ngFor=\"let item of single\">\n        <ng-container *c8yOutlet=\"item.template\"></ng-container>\n      </li>\n    </ng-container>\n    <ng-container *ngIf=\"bulk$ | async as bulk\">\n      <li class=\"dropdown-header\" *ngIf=\"bulk.length > 0\" translate data-cy=\"bulk-group\">Bulk registration</li>\n      <li *ngFor=\"let item of bulk\">\n        <ng-container *c8yOutlet=\"item.template\"></ng-container>\n      </li>\n    </ng-container>\n  </ng-template>\n</div>\n", dependencies: [{ kind: "directive", type: i3.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { kind: "directive", type: i3.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { kind: "directive", type: i3.BsDropdownDirective, selector: "[bsDropdown], [dropdown]", inputs: ["placement", "triggers", "container", "dropup", "autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen"], outputs: ["isOpenChange", "onShown", "onHidden"], exportAs: ["bs-dropdown"] }, { kind: "directive", type: i1$1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i1$1.OutletDirective, selector: "[c8yOutlet]", inputs: ["c8yOutlet", "c8yOutletProperties", "c8yOutletInjector"] }, { kind: "directive", type: i1$1.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i5$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1$1.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i5$1.AsyncPipe, name: "async" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: RegisterDeviceDropdownComponent, isStandalone: true, selector: "c8y-register-device-dropdown", ngImport: i0, template: "<div class=\"dropdown\" dropdown>\n  <button\n    *ngIf=\"!(limit$ | async); else disable\"\n    title=\"{{ 'Register device' | translate }}\"\n    type=\"button\"\n    class=\"dropdown-toggle c8y-dropdown d-flex a-i-center\"\n    dropdownToggle\n    aria-haspopup=\"true\"\n    data-cy=\"register-device--dropdown-button\"\n  >\n    <span class=\"text-truncate\" translate>Register device</span>\n    <i [c8yIcon]=\"'caret-down'\" class=\"m-l-4 text-primary\"></i>\n  </button>\n  <ng-template #disable>\n    <button\n      title=\"{{ 'Device registration disabled' | translate }}\"\n      type=\"button\"\n      class=\"btn btn-clean d-flex p-l-8\"\n      disabled\n    >\n      <span class=\"text-truncate\" translate>Register device</span>\n      <i [c8yIcon]=\"'caret-down'\"></i>\n    </button>\n  </ng-template>\n\n  <!-- dropdown for normal screen sizes -->\n  <ul class=\"dropdown-menu dropdown-menu-right hidden-xs\" data-cy=\"register-device--dropdown\" *dropdownMenu>\n    <ng-container *ngTemplateOutlet=\"dropdown\"></ng-container>\n  </ul>\n\n  <!-- fake dropdown for mobile screen sizes. *dropdownMenu is missing by design! -->\n  <ul class=\"dropdown-menu dropdown-menu visible-xs\">\n    <ng-container *ngTemplateOutlet=\"dropdown\"></ng-container>\n  </ul>\n\n  <ng-template #dropdown>\n    <ng-container *ngIf=\"single$ | async as single\">\n      <li class=\"dropdown-header\" *ngIf=\"single.length > 0\" translate data-cy=\"single-group\">Single registration</li>\n      <li *ngFor=\"let item of single\">\n        <ng-container *c8yOutlet=\"item.template\"></ng-container>\n      </li>\n    </ng-container>\n    <ng-container *ngIf=\"bulk$ | async as bulk\">\n      <li class=\"dropdown-header\" *ngIf=\"bulk.length > 0\" translate data-cy=\"bulk-group\">Bulk registration</li>\n      <li *ngFor=\"let item of bulk\">\n        <ng-container *c8yOutlet=\"item.template\"></ng-container>\n      </li>\n    </ng-container>\n  </ng-template>\n</div>\n", dependencies: [{ kind: "directive", type: BsDropdownDirective, selector: "[bsDropdown], [dropdown]", inputs: ["placement", "triggers", "container", "dropup", "autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen"], outputs: ["isOpenChange", "onShown", "onHidden"], exportAs: ["bs-dropdown"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: OutletDirective, selector: "[c8yOutlet]", inputs: ["c8yOutlet", "c8yOutletProperties", "c8yOutletInjector"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: RegisterDeviceDropdownComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-register-device-dropdown', standalone: false, template: "<div class=\"dropdown\" dropdown>\n  <button\n    *ngIf=\"!(limit$ | async); else disable\"\n    title=\"{{ 'Register device' | translate }}\"\n    type=\"button\"\n    class=\"dropdown-toggle c8y-dropdown d-flex a-i-center\"\n    dropdownToggle\n    aria-haspopup=\"true\"\n    data-cy=\"register-device--dropdown-button\"\n  >\n    <span class=\"text-truncate\" translate>Register device</span>\n    <i [c8yIcon]=\"'caret-down'\" class=\"m-l-4 text-primary\"></i>\n  </button>\n  <ng-template #disable>\n    <button\n      title=\"{{ 'Device registration disabled' | translate }}\"\n      type=\"button\"\n      class=\"btn btn-clean d-flex p-l-8\"\n      disabled\n    >\n      <span class=\"text-truncate\" translate>Register device</span>\n      <i [c8yIcon]=\"'caret-down'\"></i>\n    </button>\n  </ng-template>\n\n  <!-- dropdown for normal screen sizes -->\n  <ul class=\"dropdown-menu dropdown-menu-right hidden-xs\" data-cy=\"register-device--dropdown\" *dropdownMenu>\n    <ng-container *ngTemplateOutlet=\"dropdown\"></ng-container>\n  </ul>\n\n  <!-- fake dropdown for mobile screen sizes. *dropdownMenu is missing by design! -->\n  <ul class=\"dropdown-menu dropdown-menu visible-xs\">\n    <ng-container *ngTemplateOutlet=\"dropdown\"></ng-container>\n  </ul>\n\n  <ng-template #dropdown>\n    <ng-container *ngIf=\"single$ | async as single\">\n      <li class=\"dropdown-header\" *ngIf=\"single.length > 0\" translate data-cy=\"single-group\">Single registration</li>\n      <li *ngFor=\"let item of single\">\n        <ng-container *c8yOutlet=\"item.template\"></ng-container>\n      </li>\n    </ng-container>\n    <ng-container *ngIf=\"bulk$ | async as bulk\">\n      <li class=\"dropdown-header\" *ngIf=\"bulk.length > 0\" translate data-cy=\"bulk-group\">Bulk registration</li>\n      <li *ngFor=\"let item of bulk\">\n        <ng-container *c8yOutlet=\"item.template\"></ng-container>\n      </li>\n    </ng-container>\n  </ng-template>\n</div>\n" }]
+            args: [{ selector: 'c8y-register-device-dropdown', imports: [
+                        BsDropdownDirective,
+                        NgIf,
+                        BsDropdownToggleDirective,
+                        C8yTranslateDirective,
+                        IconDirective,
+                        BsDropdownMenuDirective,
+                        NgTemplateOutlet,
+                        NgFor,
+                        OutletDirective,
+                        C8yTranslatePipe,
+                        AsyncPipe
+                    ], template: "<div class=\"dropdown\" dropdown>\n  <button\n    *ngIf=\"!(limit$ | async); else disable\"\n    title=\"{{ 'Register device' | translate }}\"\n    type=\"button\"\n    class=\"dropdown-toggle c8y-dropdown d-flex a-i-center\"\n    dropdownToggle\n    aria-haspopup=\"true\"\n    data-cy=\"register-device--dropdown-button\"\n  >\n    <span class=\"text-truncate\" translate>Register device</span>\n    <i [c8yIcon]=\"'caret-down'\" class=\"m-l-4 text-primary\"></i>\n  </button>\n  <ng-template #disable>\n    <button\n      title=\"{{ 'Device registration disabled' | translate }}\"\n      type=\"button\"\n      class=\"btn btn-clean d-flex p-l-8\"\n      disabled\n    >\n      <span class=\"text-truncate\" translate>Register device</span>\n      <i [c8yIcon]=\"'caret-down'\"></i>\n    </button>\n  </ng-template>\n\n  <!-- dropdown for normal screen sizes -->\n  <ul class=\"dropdown-menu dropdown-menu-right hidden-xs\" data-cy=\"register-device--dropdown\" *dropdownMenu>\n    <ng-container *ngTemplateOutlet=\"dropdown\"></ng-container>\n  </ul>\n\n  <!-- fake dropdown for mobile screen sizes. *dropdownMenu is missing by design! -->\n  <ul class=\"dropdown-menu dropdown-menu visible-xs\">\n    <ng-container *ngTemplateOutlet=\"dropdown\"></ng-container>\n  </ul>\n\n  <ng-template #dropdown>\n    <ng-container *ngIf=\"single$ | async as single\">\n      <li class=\"dropdown-header\" *ngIf=\"single.length > 0\" translate data-cy=\"single-group\">Single registration</li>\n      <li *ngFor=\"let item of single\">\n        <ng-container *c8yOutlet=\"item.template\"></ng-container>\n      </li>\n    </ng-container>\n    <ng-container *ngIf=\"bulk$ | async as bulk\">\n      <li class=\"dropdown-header\" *ngIf=\"bulk.length > 0\" translate data-cy=\"bulk-group\">Bulk registration</li>\n      <li *ngFor=\"let item of bulk\">\n        <ng-container *c8yOutlet=\"item.template\"></ng-container>\n      </li>\n    </ng-container>\n  </ng-template>\n</div>\n" }]
         }], ctorParameters: () => [{ type: RegisterDeviceExtensionService }, { type: RegisterDeviceService }] });
 
 class DeviceRegistrationViewComponent {
@@ -895,13 +750,34 @@ class DeviceRegistrationViewComponent {
     showTokenInputBasedOnSecurityMode() {
         return this._securityTokenPolicy.getValue() !== DeviceRegistrationSecurityMode.IGNORED;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DeviceRegistrationViewComponent, deps: [{ token: RegisterDeviceService }, { token: i1$1.DeviceBootstrapRealtimeService }, { token: i1$1.TenantUiService }, { token: i1$1.ModalService }, { token: i5.TranslateService }, { token: i1$1.OptionsService }, { token: i1.ActivatedRoute }, { token: GeneralDeviceRegistrationService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DeviceRegistrationViewComponent, isStandalone: false, selector: "c8y-device-registration-view", ngImport: i0, template: "<ng-container *ngIf=\"deviceRequests$ | async as deviceRequestList\">\n  <c8y-title>\n    {{ 'Device registration' | translate }}\n    <small *ngIf=\"deviceRequestList.data.length === 1\">1 {{ 'new device' | translate }}</small>\n    <small *ngIf=\"deviceRequestList.data.length > 1\">\n      {{ deviceRequestList.data.length }} {{ 'new devices' | translate }}\n    </small>\n  </c8y-title>\n\n  <c8y-breadcrumb>\n    <c8y-breadcrumb-item\n      [icon]=\"'exchange'\"\n      [label]=\"'Devices' | translate\"\n    ></c8y-breadcrumb-item>\n    <c8y-breadcrumb-item\n      [icon]=\"'c8y-device-connect'\"\n      [label]=\"'Device registration' | translate\"\n    ></c8y-breadcrumb-item>\n  </c8y-breadcrumb>\n\n  <c8y-action-bar-item\n    [placement]=\"'left'\"\n    itemClass=\"navbar-form hidden-xs\"\n  >\n    <c8y-list-display-switch (onListClassChange)=\"displayMode($event)\"></c8y-list-display-switch>\n  </c8y-action-bar-item>\n\n  <ng-container *ngIf=\"limit$ | async as limitStatus\">\n    <c8y-action-bar-item\n      [placement]=\"'right'\"\n      [priority]=\"10\"\n    >\n      <button\n        class=\"btn btn-link\"\n        title=\"{{ 'Accept all' | translate }}\"\n        type=\"button\"\n        *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\n        (click)=\"acceptAll()\"\n        [disabled]=\"canAcceptAll() || limitStatus?.isReached\"\n      >\n        <i [c8yIcon]=\"'check'\"></i>\n        {{ 'Accept all' | translate }}\n      </button>\n    </c8y-action-bar-item>\n\n    <c8y-action-bar-item\n      [placement]=\"'right'\"\n      [priority]=\"9\"\n    >\n      <button\n        class=\"btn btn-link\"\n        title=\"{{ 'Reload' | translate }}\"\n        type=\"button\"\n        (click)=\"loadAll()\"\n        [disabled]=\"isLoading\"\n      >\n        <i\n          [c8yIcon]=\"'refresh'\"\n          [ngClass]=\"{ 'icon-spin': isLoading }\"\n        ></i>\n        {{ 'Reload' | translate }}\n      </button>\n    </c8y-action-bar-item>\n\n    <c8y-action-bar-item\n      [placement]=\"'right'\"\n      *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\n    >\n      <c8y-register-device-dropdown></c8y-register-device-dropdown>\n    </c8y-action-bar-item>\n\n    <c8y-help\n      src=\"/docs/device-management-application/registering-devices/#registering-devices\"\n    ></c8y-help>\n\n    <ng-container *ngIf=\"deviceRequestList.data.length > 0; else noData\">\n      <div\n        class=\"card-group\"\n        [ngClass]=\"gridOrList\"\n      >\n        <!-- START interact-list sticky header START -->\n        <div\n          class=\"page-sticky-header hidden-xs\"\n          *ngIf=\"gridOrList === 'interact-list'\"\n        >\n          <div class=\"d-flex\">\n            <div class=\"card-header p-l-40\">\n              <p translate>Device</p>\n            </div>\n            <div class=\"card-block card-column-30 p-l-0 m-l-8\">\n              <p translate>Status</p>\n            </div>\n            <div\n              class=\"card-block card-column-30 p-0\"\n              *ngIf=\"showTokenInputBasedOnSecurityMode()\"\n            >\n              <p translate>Security token</p>\n              <button\n                class=\"btn-help\"\n                [attr.aria-label]=\"'Help' | translate\"\n                popover=\"{{\n                  'Security token is required if the connected device uses it.' | translate\n                }}\"\n                placement=\"right\"\n                triggers=\"focus\"\n                container=\"body\"\n                type=\"button\"\n              ></button>\n            </div>\n            <div class=\"card-footer card-column-50\">\n              <div\n                class=\"d-contents\"\n                *ngIf=\"isManagementTenant; else noManagement\"\n              >\n                <div class=\"card-column-50\">\n                  {{ 'Created' | translate }}\n                </div>\n                <div class=\"card-column-30\">\n                  {{ 'By`user`' | translate }}\n                </div>\n                <div class=\"card-column-20\">\n                  {{ 'Tenant ID' | translate }}\n                </div>\n              </div>\n              <ng-template #noManagement>\n                <div class=\"d-contents\">\n                  <div class=\"card-column-50\">\n                    {{ 'Created' | translate }}\n                  </div>\n                  <div class=\"card-column-50\">\n                    {{ 'By`user`' | translate }}\n                  </div>\n                </div>\n              </ng-template>\n            </div>\n            <div\n              class=\"card-actions-group\"\n              style=\"min-width: 176px\"\n            >\n              <div class=\"btn btn-xs invisible\">\n                <!--EMPTY by design-->\n              </div>\n            </div>\n          </div>\n        </div>\n        <!-- END interact-list sticky header END -->\n\n        <div\n          class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3\"\n          *ngIf=\"limitStatus?.isReached\"\n        >\n          <p\n            class=\"alert alert-warning center-block\"\n            role=\"alert\"\n          >\n            <strong>\n              {{ limitReachedInfo$ | async }}\n            </strong>\n            <br />\n            <span translate>Please contact your platform administrator.</span>\n          </p>\n        </div>\n\n        <ng-container *ngFor=\"let singleRequest of deviceRequestList.data\">\n          <div class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3\">\n            <div class=\"card\">\n              <div class=\"card-header separator\">\n                <div class=\"card-icon\">\n                  <i\n                    [class]=\"statusProps[singleRequest.status].cls\"\n                    [c8yIcon]=\"statusProps[singleRequest.status].icon\"\n                  ></i>\n                </div>\n                <p\n                  class=\"card-title text-truncate\"\n                  title=\"{{ singleRequest.id }}\"\n                >\n                  {{ singleRequest.id }}\n                </p>\n              </div>\n\n              <div class=\"card-block text-center card-column-30\">\n                <span\n                  class=\"text-label-small\"\n                  translate\n                >\n                  Status\n                </span>\n                <p>\n                  <i\n                    class=\"icon-spin text-primary\"\n                    c8yIcon=\"refresh\"\n                    *ngIf=\"singleRequest.status === status.WAITING_FOR_CONNECTION\"\n                  ></i>\n                  {{ statusProps[singleRequest.status].label | translate }}\n                </p>\n              </div>\n\n              <ng-container *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\">\n                <div\n                  class=\"card-block text-center card-column-30 p-t-0\"\n                  [ngClass]=\"{ 'p-b-0': !shouldShowSecurityTokenInput(singleRequest) }\"\n                  *ngIf=\"showTokenInputBasedOnSecurityMode()\"\n                >\n                  <ng-container *ngIf=\"shouldShowSecurityTokenInput(singleRequest)\">\n                    <span\n                      class=\"text-label-small\"\n                      *ngIf=\"gridOrList !== 'interact-list'\"\n                      translate\n                    >\n                      Security token\n                    </span>\n                    <input\n                      class=\"form-control\"\n                      type=\"text\"\n                      [(ngModel)]=\"singleRequest.securityToken\"\n                      [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'A1e3gh5ds' }\"\n                      [required]=\"requireSecurityToken\"\n                    />\n                  </ng-container>\n                </div>\n\n                <div\n                  class=\"card-actions-group d-flex a-i-center j-c-center\"\n                  style=\"min-width: 176px\"\n                >\n                  <button\n                    class=\"btn btn-sm\"\n                    title=\"{{\n                      singleRequest.status === status.PENDING_ACCEPTANCE\n                        ? ('Remove' | translate)\n                        : ('Cancel' | translate)\n                    }}\"\n                    type=\"button\"\n                    [ngClass]=\"{\n                      'btn-danger': singleRequest.status === status.PENDING_ACCEPTANCE,\n                      'btn-default': singleRequest.status !== status.PENDING_ACCEPTANCE\n                    }\"\n                    (click)=\"delete(singleRequest.id)\"\n                    [disabled]=\"isLoading\"\n                  >\n                    <span *ngIf=\"singleRequest.status === status.PENDING_ACCEPTANCE\">\n                      {{ 'Remove' | translate }}\n                    </span>\n                    <span *ngIf=\"singleRequest.status !== status.PENDING_ACCEPTANCE\">\n                      {{ 'Cancel' | translate }}\n                    </span>\n                  </button>\n                  <button\n                    class=\"btn btn-primary btn-sm\"\n                    title=\"{{ 'Accept' | translate }}\"\n                    type=\"button\"\n                    (click)=\"accept(singleRequest)\"\n                    *ngIf=\"singleRequest.status === status.PENDING_ACCEPTANCE\"\n                    [disabled]=\"\n                      isLoading ||\n                      limitStatus?.isReached ||\n                      (!singleRequest.securityToken && requireSecurityToken)\n                    \"\n                  >\n                    {{ 'Accept' | translate }}\n                  </button>\n                </div>\n              </ng-container>\n\n              <div class=\"card-footer separator text-center card-column-50\">\n                <small\n                  class=\"d-contents\"\n                  *ngIf=\"isManagementTenant; else noManagement\"\n                >\n                  <div\n                    class=\"d-contents\"\n                    *ngIf=\"singleRequest.creationTime && singleRequest.owner\"\n                  >\n                    <span class=\"card-column-50\">\n                      <span\n                        class=\"text-label-small m-l-4 m-r-4\"\n                        translate\n                      >\n                        Created on`date`\n                      </span>\n                      <span data-cy=\"device-registration--creation-date\">\n                        {{ singleRequest.creationTime | c8yDate }}\n                      </span>\n                    </span>\n                    <span class=\"card-column-30 text-truncate\">\n                      <span\n                        class=\"text-label-small m-l-4 m-r-4\"\n                        translate\n                      >\n                        by`user`\n                      </span>\n                      <span\n                        title=\"{{ singleRequest.owner }}\"\n                        data-cy=\"device-registration--created-by\"\n                      >\n                        {{ singleRequest.owner }}\n                      </span>\n                    </span>\n                    <span class=\"card-column-20\">\n                      <span\n                        class=\"text-label-small m-l-4 m-r-4\"\n                        translate\n                      >\n                        in`tenant`\n                      </span>\n                      <span>{{ singleRequest.tenantId }}</span>\n                    </span>\n                  </div>\n                  <div\n                    class=\"d-contents\"\n                    *ngIf=\"!singleRequest.creationTime || !singleRequest.owner\"\n                  >\n                    <div class=\"card-column-50\"></div>\n                    <div class=\"card-column-30\"></div>\n                    <span\n                      class=\"text-label-small\"\n                      translate\n                    >\n                      Created in`tenant`\n                    </span>\n                    <div class=\"card-column-20\">\n                      <span>\n                        {{ singleRequest.tenantId }}\n                      </span>\n                    </div>\n                  </div>\n                </small>\n                <ng-template #noManagement>\n                  <small class=\"d-contents\">\n                    <span class=\"card-column-50\">\n                      <span\n                        class=\"text-label-small m-l-4 m-r-4\"\n                        translate\n                      >\n                        Created on`date`\n                      </span>\n                      <span data-cy=\"device-registration--creation-date\">\n                        {{ singleRequest.creationTime | c8yDate }}\n                      </span>\n                    </span>\n                    <span class=\"card-column-50 text-truncate\">\n                      <span\n                        class=\"text-label-small m-l-4 m-r-4\"\n                        translate\n                      >\n                        by`user`\n                      </span>\n                      <span\n                        title=\"{{ singleRequest.owner }}\"\n                        data-cy=\"device-registration--created-by\"\n                      >\n                        {{ singleRequest.owner }}\n                      </span>\n                    </span>\n                  </small>\n                </ng-template>\n              </div>\n            </div>\n          </div>\n        </ng-container>\n      </div>\n      <c8y-load-more\n        [paging]=\"deviceRequestList.paging\"\n        [hidden]=\"true\"\n        (onLoad)=\"updateList($event)\"\n      ></c8y-load-more>\n    </ng-container>\n\n    <ng-template #noData>\n      <div class=\"c8y-empty-state m-t-40 text-center\">\n        <h1 class=\"c8y-icon c8y-icon-device-connect c8y-icon-duocolor\"></h1>\n        <ng-container *ngIf=\"limitStatus?.isReached; else limitNotReached\">\n          <h3>\n            {{ limitReachedInfo$ | async }}\n          </h3>\n          <p translate>Please contact your platform administrator.</p>\n        </ng-container>\n        <ng-template #limitNotReached>\n          <h3 translate>No pending registrations to display.</h3>\n          <p\n            *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\n            translate\n          >\n            Use the \"Register device\" dropdown in the top right corner.\n          </p>\n        </ng-template>\n      </div>\n    </ng-template>\n  </ng-container>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i5$2.PopoverDirective, selector: "[popover]", inputs: ["adaptivePosition", "boundariesElement", "popover", "popoverContext", "popoverTitle", "placement", "outsideClick", "triggers", "container", "containerClass", "isOpen", "delay"], outputs: ["onShown", "onHidden"], exportAs: ["bs-popover"] }, { kind: "directive", type: i1$1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i1$1.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i5$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.IfAllowedDirective, selector: "[c8yIfAllowed]", inputs: ["c8yIfAllowed", "c8yIfAllowedAllowAny"] }, { kind: "component", type: i1$1.LoadMoreComponent, selector: "c8y-load-more", inputs: ["paging", "useIntersection", "hidden", "container", "class", "maxIterations", "noMoreDataHint", "loadingTemplate", "hideNoMoreDataHint", "loadNextLabel", "loadingLabel"], outputs: ["onLoad"] }, { kind: "component", type: i1$1.ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "component", type: i1$1.BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: i1$1.BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "component", type: i1$1.TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "directive", type: i8.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: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i8.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$1.RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "component", type: i1$1.HelpComponent, selector: "c8y-help", inputs: ["src", "isCollapsed", "priority", "icon"] }, { kind: "component", type: i1$1.ListDisplaySwitchComponent, selector: "c8y-list-display-switch", inputs: ["listKey", "listLength", "filterPipe"], outputs: ["onListClassChange"] }, { kind: "component", type: RegisterDeviceDropdownComponent, selector: "c8y-register-device-dropdown" }, { kind: "pipe", type: i1$1.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i5$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$1.DatePipe, name: "c8yDate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DeviceRegistrationViewComponent, deps: [{ token: RegisterDeviceService }, { token: i1$2.DeviceBootstrapRealtimeService }, { token: i1$2.TenantUiService }, { token: i1$2.ModalService }, { token: i3.TranslateService }, { token: i1$2.OptionsService }, { token: i1.ActivatedRoute }, { token: GeneralDeviceRegistrationService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DeviceRegistrationViewComponent, isStandalone: true, selector: "c8y-device-registration-view", ngImport: i0, template: "<ng-container *ngIf=\"deviceRequests$ | async as deviceRequestList\">\n  <c8y-title>\n    {{ 'Device registration' | translate }}\n    <small *ngIf=\"deviceRequestList.data.length === 1\">1 {{ 'new device' | translate }}</small>\n    <small *ngIf=\"deviceRequestList.data.length > 1\">\n      {{ deviceRequestList.data.length }} {{ 'new devices' | translate }}\n    </small>\n  </c8y-title>\n\n  <c8y-breadcrumb>\n    <c8y-breadcrumb-item\n      [icon]=\"'exchange'\"\n      [label]=\"'Devices' | translate\"\n    ></c8y-breadcrumb-item>\n    <c8y-breadcrumb-item\n      [icon]=\"'c8y-device-connect'\"\n      [label]=\"'Device registration' | translate\"\n    ></c8y-breadcrumb-item>\n  </c8y-breadcrumb>\n\n  <c8y-action-bar-item\n    [placement]=\"'left'\"\n    itemClass=\"navbar-form hidden-xs\"\n  >\n    <c8y-list-display-switch (onListClassChange)=\"displayMode($event)\"></c8y-list-display-switch>\n  </c8y-action-bar-item>\n\n  <ng-container *ngIf=\"limit$ | async as limitStatus\">\n    <c8y-action-bar-item\n      [placement]=\"'right'\"\n      [priority]=\"10\"\n    >\n      <button\n        class=\"btn btn-link\"\n        title=\"{{ 'Accept all' | translate }}\"\n        type=\"button\"\n        *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\n        (click)=\"acceptAll()\"\n        [disabled]=\"canAcceptAll() || limitStatus?.isReached\"\n      >\n        <i [c8yIcon]=\"'check'\"></i>\n        {{ 'Accept all' | translate }}\n      </button>\n    </c8y-action-bar-item>\n\n    <c8y-action-bar-item\n      [placement]=\"'right'\"\n      [priority]=\"9\"\n    >\n      <button\n        class=\"btn btn-link\"\n        title=\"{{ 'Reload' | translate }}\"\n        type=\"button\"\n        (click)=\"loadAll()\"\n        [disabled]=\"isLoading\"\n      >\n        <i\n          [c8yIcon]=\"'refresh'\"\n          [ngClass]=\"{ 'icon-spin': isLoading }\"\n        ></i>\n        {{ 'Reload' | translate }}\n      </button>\n    </c8y-action-bar-item>\n\n    <c8y-action-bar-item\n      [placement]=\"'right'\"\n      *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\n    >\n      <c8y-register-device-dropdown></c8y-register-device-dropdown>\n    </c8y-action-bar-item>\n\n    <c8y-help\n      src=\"/docs/device-management-application/registering-devices/#registering-devices\"\n    ></c8y-help>\n\n    <ng-container *ngIf=\"deviceRequestList.data.length > 0; else noData\">\n      <div\n        class=\"card-group\"\n        [ngClass]=\"gridOrList\"\n      >\n        <!-- START interact-list sticky header START -->\n        <div\n          class=\"page-sticky-header hidden-xs\"\n          *ngIf=\"gridOrList === 'interact-list'\"\n        >\n          <div class=\"d-flex\">\n            <div class=\"card-header p-l-40\">\n              <p translate>Device</p>\n            </div>\n            <div class=\"card-block card-column-30 p-l-0 m-l-8\">\n              <p translate>Status</p>\n            </div>\n            <div\n              class=\"card-block card-column-30 p-0\"\n              *ngIf=\"showTokenInputBasedOnSecurityMode()\"\n            >\n              <p translate>Security token</p>\n              <button\n                class=\"btn-help\"\n                [attr.aria-label]=\"'Help' | translate\"\n                popover=\"{{\n                  'Security token is required if the connected device uses it.' | translate\n                }}\"\n                placement=\"right\"\n                triggers=\"focus\"\n                container=\"body\"\n                type=\"button\"\n              ></button>\n            </div>\n            <div class=\"card-footer card-column-50\">\n              <div\n                class=\"d-contents\"\n                *ngIf=\"isManagementTenant; else noManagement\"\n              >\n                <div class=\"card-column-50\">\n                  {{ 'Created' | translate }}\n                </div>\n                <div class=\"card-column-30\">\n                  {{ 'By`user`' | translate }}\n                </div>\n                <div class=\"card-column-20\">\n                  {{ 'Tenant ID' | translate }}\n                </div>\n              </div>\n              <ng-template #noManagement>\n                <div class=\"d-contents\">\n                  <div class=\"card-column-50\">\n                    {{ 'Created' | translate }}\n                  </div>\n                  <div class=\"card-column-50\">\n                    {{ 'By`user`' | translate }}\n                  </div>\n                </div>\n              </ng-template>\n            </div>\n            <div\n              class=\"card-actions-group\"\n              style=\"min-width: 176px\"\n            >\n              <div class=\"btn btn-xs invisible\">\n                <!--EMPTY by design-->\n              </div>\n            </div>\n          </div>\n        </div>\n        <!-- END interact-list sticky header END -->\n\n        <div\n          class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3\"\n          *ngIf=\"limitStatus?.isReached\"\n        >\n          <p\n            class=\"alert alert-warning center-block\"\n            role=\"alert\"\n          >\n            <strong>\n              {{ limitReachedInfo$ | async }}\n            </strong>\n            <br />\n            <span translate>Please contact your platform administrator.</span>\n          </p>\n        </div>\n\n        <ng-container *ngFor=\"let singleRequest of deviceRequestList.data\">\n          <div class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3\">\n            <div class=\"card\">\n              <div class=\"card-header separator\">\n                <div class=\"card-icon\">\n                  <i\n                    [class]=\"statusProps[singleRequest.status].cls\"\n                    [c8yIcon]=\"statusProps[singleRequest.status].icon\"\n                  ></i>\n                </div>\n                <p\n                  class=\"card-title text-truncate\"\n                  title=\"{{ singleRequest.id }}\"\n                >\n                  {{ singleRequest.id }}\n                </p>\n              </div>\n\n              <div class=\"card-block text-center card-column-30\">\n                <span\n                  class=\"text-label-small\"\n                  translate\n                >\n                  Status\n                </span>\n                <p>\n                  <i\n                    class=\"icon-spin text-primary\"\n                    c8yIcon=\"refresh\"\n                    *ngIf=\"singleRequest.status === status.WAITING_FOR_CONNECTION\"\n                  ></i>\n                  {{ statusProps[singleRequest.status].label | translate }}\n                </p>\n              </div>\n\n              <ng-container *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\">\n                <div\n                  class=\"card-block text-center card-column-30 p-t-0\"\n                  [ngClass]=\"{ 'p-b-0': !shouldShowSecurityTokenInput(singleRequest) }\"\n                  *ngIf=\"showTokenInputBasedOnSecurityMode()\"\n                >\n                  <ng-container *ngIf=\"shouldShowSecurityTokenInput(singleRequest)\">\n                    <span\n                      class=\"text-label-small\"\n                      *ngIf=\"gridOrList !== 'interact-list'\"\n                      translate\n                    >\n                      Security token\n                    </span>\n                    <input\n                      class=\"form-control\"\n                      type=\"text\"\n                      [(ngModel)]=\"singleRequest.securityToken\"\n                      [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'A1e3gh5ds' }\"\n                      [required]=\"requireSecurityToken\"\n                    />\n                  </ng-container>\n                </div>\n\n                <div\n                  class=\"card-actions-group d-flex a-i-center j-c-center\"\n                  style=\"min-width: 176px\"\n                >\n                  <button\n                    class=\"btn btn-sm\"\n                    title=\"{{\n                      singleRequest.status === status.PENDING_ACCEPTANCE\n                        ? ('Remove' | translate)\n                        : ('Cancel' | translate)\n                    }}\"\n                    type=\"button\"\n                    [ngClass]=\"{\n                      'btn-danger': singleRequest.status === status.PENDING_ACCEPTANCE,\n                      'btn-default': singleRequest.status !== status.PENDING_ACCEPTANCE\n                    }\"\n                    (click)=\"delete(singleRequest.id)\"\n                    [disabled]=\"isLoading\"\n                  >\n                    <span *ngIf=\"singleRequest.status === status.PENDING_ACCEPTANCE\">\n                      {{ 'Remove' | translate }}\n                    </span>\n                    <span *ngIf=\"singleRequest.status !== status.PENDING_ACCEPTANCE\">\n                      {{ 'Cancel' | translate }}\n                    </span>\n                  </button>\n                  <button\n                    class=\"btn btn-primary btn-sm\"\n                    title=\"{{ 'Accept' | translate }}\"\n                    type=\"button\"\n                    (click)=\"accept(singleRequest)\"\n                    *ngIf=\"singleRequest.status === status.PENDING_ACCEPTANCE\"\n                    [disabled]=\"\n                      isLoading ||\n                      limitStatus?.isReached ||\n                      (!singleRequest.securityToken && requireSecurityToken)\n                    \"\n                  >\n                    {{ 'Accept' | translate }}\n                  </button>\n                </div>\n              </ng-container>\n\n              <div class=\"card-footer separator text-center card-column-50\">\n                <small\n                  class=\"d-contents\"\n                  *ngIf=\"isManagementTenant; else noManagement\"\n                >\n                  <div\n                    class=\"d-contents\"\n                    *ngIf=\"singleRequest.creationTime && singleRequest.owner\"\n                  >\n                    <span class=\"card-column-50\">\n                      <span\n                        class=\"text-label-small m-l-4 m-r-4\"\n                        translate\n                      >\n                        Created on`date`\n                      </span>\n                      <span data-cy=\"device-registration--creation-date\">\n                        {{ singleRequest.creationTime | c8yDate }}\n                      </span>\n                    </span>\n                    <span class=\"card-column-30 text-truncate\">\n                      <span\n                        class=\"text-label-small m-l-4 m-r-4\"\n                        translate\n                      >\n                        by`user`\n                      </span>\n                      <span\n                        title=\"{{ singleRequest.owner }}\"\n                        data-cy=\"device-registration--created-by\"\n                      >\n                        {{ singleRequest.owner }}\n                      </span>\n                    </span>\n                    <span class=\"card-column-20\">\n                      <span\n                        class=\"text-label-small m-l-4 m-r-4\"\n                        translate\n                      >\n                        in`tenant`\n                      </span>\n                      <span>{{ singleRequest.tenantId }}</span>\n                    </span>\n                  </div>\n                  <div\n                    class=\"d-contents\"\n                    *ngIf=\"!singleRequest.creationTime || !singleRequest.owner\"\n                  >\n                    <div class=\"card-column-50\"></div>\n                    <div class=\"card-column-30\"></div>\n                    <span\n                      class=\"text-label-small\"\n                      translate\n                    >\n                      Created in`tenant`\n                    </span>\n                    <div class=\"card-column-20\">\n                      <span>\n                        {{ singleRequest.tenantId }}\n                      </span>\n                    </div>\n                  </div>\n                </small>\n                <ng-template #noManagement>\n                  <small class=\"d-contents\">\n                    <span class=\"card-column-50\">\n                      <span\n                        class=\"text-label-small m-l-4 m-r-4\"\n                        translate\n                      >\n                        Created on`date`\n                      </span>\n                      <span data-cy=\"device-registration--creation-date\">\n                        {{ singleRequest.creationTime | c8yDate }}\n                      </span>\n                    </span>\n                    <span class=\"card-column-50 text-truncate\">\n                      <span\n                        class=\"text-label-small m-l-4 m-r-4\"\n                        translate\n                      >\n                        by`user`\n                      </span>\n                      <span\n                        title=\"{{ singleRequest.owner }}\"\n                        data-cy=\"device-registration--created-by\"\n                      >\n                        {{ singleRequest.owner }}\n                      </span>\n                    </span>\n                  </small>\n                </ng-template>\n              </div>\n            </div>\n          </div>\n        </ng-container>\n      </div>\n      <c8y-load-more\n        [paging]=\"deviceRequestList.paging\"\n        [hidden]=\"true\"\n        (onLoad)=\"updateList($event)\"\n      ></c8y-load-more>\n    </ng-container>\n\n    <ng-template #noData>\n      <div class=\"c8y-empty-state m-t-40 text-center\">\n        <h1 class=\"c8y-icon c8y-icon-device-connect c8y-icon-duocolor\"></h1>\n        <ng-container *ngIf=\"limitStatus?.isReached; else limitNotReached\">\n          <h3>\n            {{ limitReachedInfo$ | async }}\n          </h3>\n          <p translate>Please contact your platform administrator.</p>\n        </ng-container>\n        <ng-template #limitNotReached>\n          <h3 translate>No pending registrations to display.</h3>\n          <p\n            *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\n            translate\n          >\n            Use the \"Register device\" dropdown in the top right corner.\n          </p>\n        </ng-template>\n      </div>\n    </ng-template>\n  </ng-container>\n</ng-container>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "component", type: BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "component", type: ListDisplaySwitchComponent, selector: "c8y-list-display-switch", inputs: ["listKey", "listLength", "filterPipe"], outputs: ["onListClassChange"] }, { kind: "directive", type: IfAllowedDirective, selector: "[c8yIfAllowed]", inputs: ["c8yIfAllowed", "c8yIfAllowedAllowAny"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: RegisterDeviceDropdownComponent, selector: "c8y-register-device-dropdown" }, { kind: "component", type: HelpComponent, selector: "c8y-help", inputs: ["src", "isCollapsed", "priority", "icon"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: PopoverDirective, selector: "[popover]", inputs: ["adaptivePosition", "boundariesElement", "popover", "popoverContext", "popoverTitle", "placement", "outsideClick", "triggers", "container", "containerClass", "isOpen", "delay"], outputs: ["onShown", "onHidden"], exportAs: ["bs-popover"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: FormsModule }, { 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.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "component", type: LoadMoreComponent, selector: "c8y-load-more", inputs: ["paging", "useIntersection", "hidden", "container", "class", "maxIterations", "noMoreDataHint", "loadingTemplate", "hideNoMoreDataHint", "loadNextLabel", "loadingLabel"], outputs: ["onLoad"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: DatePipe, name: "c8yDate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DeviceRegistrationViewComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-device-registration-view', standalone: false, template: "<ng-container *ngIf=\"deviceRequests$ | async as deviceRequestList\">\n  <c8y-title>\n    {{ 'Device registration' | translate }}\n    <small *ngIf=\"deviceRequestList.data.length === 1\">1 {{ 'new device' | translate }}</small>\n    <small *ngIf=\"deviceRequestList.data.length > 1\">\n      {{ deviceRequestList.data.length }} {{ 'new devices' | translate }}\n    </small>\n  </c8y-title>\n\n  <c8y-breadcrumb>\n    <c8y-breadcrumb-item\n      [icon]=\"'exchange'\"\n      [label]=\"'Devices' | translate\"\n    ></c8y-breadcrumb-item>\n    <c8y-breadcrumb-item\n      [icon]=\"'c8y-device-connect'\"\n      [label]=\"'Device registration' | translate\"\n    ></c8y-breadcrumb-item>\n  </c8y-breadcrumb>\n\n  <c8y-action-bar-item\n    [placement]=\"'left'\"\n    itemClass=\"navbar-form hidden-xs\"\n  >\n    <c8y-list-display-switch (onListClassChange)=\"displayMode($event)\"></c8y-list-display-switch>\n  </c8y-action-bar-item>\n\n  <ng-container *ngIf=\"limit$ | async as limitStatus\">\n    <c8y-action-bar-item\n      [placement]=\"'right'\"\n      [priority]=\"10\"\n    >\n      <button\n        class=\"btn btn-link\"\n        title=\"{{ 'Accept all' | translate }}\"\n        type=\"button\"\n        *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\n        (click)=\"acceptAll()\"\n        [disabled]=\"canAcceptAll() || limitStatus?.isReached\"\n      >\n        <i [c8yIcon]=\"'check'\"></i>\n        {{ 'Accept all' | translate }}\n      </button>\n    </c8y-action-bar-item>\n\n    <c8y-action-bar-item\n      [placement]=\"'right'\"\n      [priority]=\"9\"\n    >\n      <button\n        class=\"btn btn-link\"\n        title=\"{{ 'Reload' | translate }}\"\n        type=\"button\"\n        (click)=\"loadAll()\"\n        [disabled]=\"isLoading\"\n      >\n        <i\n          [c8yIcon]=\"'refresh'\"\n          [ngClass]=\"{ 'icon-spin': isLoading }\"\n        ></i>\n        {{ 'Reload' | translate }}\n      </button>\n    </c8y-action-bar-item>\n\n    <c8y-action-bar-item\n      [placement]=\"'right'\"\n      *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\n    >\n      <c8y-register-device-dropdown></c8y-register-device-dropdown>\n    </c8y-action-bar-item>\n\n    <c8y-help\n      src=\"/docs/device-management-application/registering-devices/#registering-devices\"\n    ></c8y-help>\n\n    <ng-container *ngIf=\"deviceRequestList.data.length > 0; else noData\">\n      <div\n        class=\"card-group\"\n        [ngClass]=\"gridOrList\"\n      >\n        <!-- START interact-list sticky header START -->\n        <div\n          class=\"page-sticky-header hidden-xs\"\n          *ngIf=\"gridOrList === 'interact-list'\"\n        >\n          <div class=\"d-flex\">\n            <div class=\"card-header p-l-40\">\n              <p translate>Device</p>\n            </div>\n            <div class=\"card-block card-column-30 p-l-0 m-l-8\">\n              <p translate>Status</p>\n            </div>\n            <div\n              class=\"card-block card-column-30 p-0\"\n              *ngIf=\"showTokenInputBasedOnSecurityMode()\"\n            >\n              <p translate>Security token</p>\n              <button\n                class=\"btn-help\"\n                [attr.aria-label]=\"'Help' | translate\"\n                popover=\"{{\n                  'Security token is required if the connected device uses it.' | translate\n                }}\"\n                placement=\"right\"\n                triggers=\"focus\"\n                container=\"body\"\n                type=\"button\"\n              ></button>\n            </div>\n            <div class=\"card-footer card-column-50\">\n              <div\n                class=\"d-contents\"\n                *ngIf=\"isManagementTenant; else noManagement\"\n              >\n                <div class=\"card-column-50\">\n                  {{ 'Created' | translate }}\n                </div>\n                <div class=\"card-column-30\">\n                  {{ 'By`user`' | translate }}\n                </div>\n                <div class=\"card-column-20\">\n                  {{ 'Tenant ID' | translate }}\n                </div>\n              </div>\n              <ng-template #noManagement>\n                <div class=\"d-contents\">\n                  <div class=\"card-column-50\">\n                    {{ 'Created' | translate }}\n                  </div>\n                  <div class=\"card-column-50\">\n                    {{ 'By`user`' | translate }}\n                  </div>\n                </div>\n              </ng-template>\n            </div>\n            <div\n              class=\"card-actions-group\"\n              style=\"min-width: 176px\"\n            >\n              <div class=\"btn btn-xs invisible\">\n                <!--EMPTY by design-->\n              </div>\n            </div>\n          </div>\n        </div>\n        <!-- END interact-list sticky header END -->\n\n        <div\n          class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3\"\n          *ngIf=\"limitStatus?.isReached\"\n        >\n          <p\n            class=\"alert alert-warning center-block\"\n            role=\"alert\"\n          >\n            <strong>\n              {{ limitReachedInfo$ | async }}\n            </strong>\n            <br />\n            <span translate>Please contact your platform administrator.</span>\n          </p>\n        </div>\n\n        <ng-container *ngFor=\"let singleRequest of deviceRequestList.data\">\n          <div class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3\">\n            <div class=\"card\">\n              <div class=\"card-header separator\">\n                <div class=\"card-icon\">\n                  <i\n                    [class]=\"statusProps[singleRequest.status].cls\"\n                    [c8yIcon]=\"statusProps[singleRequest.status].icon\"\n                  ></i>\n                </div>\n                <p\n                  class=\"card-title text-truncate\"\n                  title=\"{{ singleRequest.id }}\"\n                >\n                  {{ singleRequest.id }}\n                </p>\n              </div>\n\n              <div class=\"card-block text-center card-column-30\">\n                <span\n                  class=\"text-label-small\"\n                  translate\n                >\n                  Status\n                </span>\n                <p>\n                  <i\n                    class=\"icon-spin text-primary\"\n                    c8yIcon=\"refresh\"\n                    *ngIf=\"singleRequest.status === status.WAITING_FOR_CONNECTION\"\n                  ></i>\n                  {{ statusProps[singleRequest.status].label | translate }}\n                </p>\n              </div>\n\n              <ng-container *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\">\n                <div\n                  class=\"card-block text-center card-column-30 p-t-0\"\n                  [ngClass]=\"{ 'p-b-0': !shouldShowSecurityTokenInput(singleRequest) }\"\n                  *ngIf=\"showTokenInputBasedOnSecurityMode()\"\n                >\n                  <ng-container *ngIf=\"shouldShowSecurityTokenInput(singleRequest)\">\n                    <span\n                      class=\"text-label-small\"\n                      *ngIf=\"gridOrList !== 'interact-list'\"\n                      translate\n                    >\n                      Security token\n                    </span>\n                    <input\n                      class=\"form-control\"\n                      type=\"text\"\n                      [(ngModel)]=\"singleRequest.securityToken\"\n                      [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'A1e3gh5ds' }\"\n                      [required]=\"requireSecurityToken\"\n                    />\n                  </ng-container>\n                </div>\n\n                <div\n                  class=\"card-actions-group d-flex a-i-center j-c-center\"\n                  style=\"min-width: 176px\"\n                >\n                  <button\n                    class=\"btn btn-sm\"\n                    title=\"{{\n                      singleRequest.status === status.PENDING_ACCEPTANCE\n                        ? ('Remove' | translate)\n                        : ('Cancel' | translate)\n                    }}\"\n                    type=\"button\"\n                    [ngClass]=\"{\n                      'btn-danger': singleRequest.status === status.PENDING_ACCEPTANCE,\n                      'btn-default': singleRequest.status !== status.PENDING_ACCEPTANCE\n                    }\"\n                    (click)=\"delete(singleRequest.id)\"\n                    [disabled]=\"isLoading\"\n                  >\n                    <span *ngIf=\"singleRequest.status === status.PENDING_ACCEPTANCE\">\n                      {{ 'Remove' | translate }}\n                    </span>\n                    <span *ngIf=\"singleRequest.status !== status.PENDING_ACCEPTANCE\">\n                      {{ 'Cancel' | translate }}\n                    </span>\n                  </button>\n                  <button\n                    class=\"btn btn-primary btn-sm\"\n                    title=\"{{ 'Accept' | translate }}\"\n                    type=\"button\"\n                    (click)=\"accept(singleRequest)\"\n                    *ngIf=\"singleRequest.status === status.PENDING_ACCEPTANCE\"\n                    [disabled]=\"\n                      isLoading ||\n                      limitStatus?.isReached ||\n                      (!singleRequest.securityToken && requireSecurityToken)\n                    \"\n                  >\n                    {{ 'Accept' | translate }}\n                  </button>\n                </div>\n              </ng-container>\n\n              <div class=\"card-footer separator text-center card-column-50\">\n                <small\n                  class=\"d-contents\"\n                  *ngIf=\"isManagementTenant; else noManagement\"\n                >\n                  <div\n                    class=\"d-contents\"\n                    *ngIf=\"singleRequest.creationTime && singleRequest.owner\"\n                  >\n                    <span class=\"card-column-50\">\n                      <span\n                        class=\"text-label-small m-l-4 m-r-4\"\n                        translate\n                      >\n                        Created on`date`\n                      </span>\n                      <span data-cy=\"device-registration--creation-date\">\n                        {{ singleRequest.creationTime | c8yDate }}\n                      </span>\n                    </span>\n                    <span class=\"card-column-30 text-truncate\">\n                      <span\n                        class=\"text-label-small m-l-4 m-r-4\"\n                        translate\n                      >\n                        by`user`\n                      </span>\n                      <span\n                        title=\"{{ singleRequest.owner }}\"\n                        data-cy=\"device-registration--created-by\"\n                      >\n                        {{ singleRequest.owner }}\n                      </span>\n                    </span>\n                    <span class=\"card-column-20\">\n                      <span\n                        class=\"text-label-small m-l-4 m-r-4\"\n                        translate\n                      >\n                        in`tenant`\n                      </span>\n                      <span>{{ singleRequest.tenantId }}</span>\n                    </span>\n                  </div>\n                  <div\n                    class=\"d-contents\"\n                    *ngIf=\"!singleRequest.creationTime || !singleRequest.owner\"\n                  >\n                    <div class=\"card-column-50\"></div>\n                    <div class=\"card-column-30\"></div>\n                    <span\n                      class=\"text-label-small\"\n                      translate\n                    >\n                      Created in`tenant`\n                    </span>\n                    <div class=\"card-column-20\">\n                      <span>\n                        {{ singleRequest.tenantId }}\n                      </span>\n                    </div>\n                  </div>\n                </small>\n                <ng-template #noManagement>\n                  <small class=\"d-contents\">\n                    <span class=\"card-column-50\">\n                      <span\n                        class=\"text-label-small m-l-4 m-r-4\"\n                        translate\n                      >\n                        Created on`date`\n                      </span>\n                      <span data-cy=\"device-registration--creation-date\">\n                        {{ singleRequest.creationTime | c8yDate }}\n                      </span>\n                    </span>\n                    <span class=\"card-column-50 text-truncate\">\n                      <span\n                        class=\"text-label-small m-l-4 m-r-4\"\n                        translate\n                      >\n                        by`user`\n                      </span>\n                      <span\n                        title=\"{{ singleRequest.owner }}\"\n                        data-cy=\"device-registration--created-by\"\n                      >\n                        {{ singleRequest.owner }}\n                      </span>\n                    </span>\n                  </small>\n                </ng-template>\n              </div>\n            </div>\n          </div>\n        </ng-container>\n      </div>\n      <c8y-load-more\n        [paging]=\"deviceRequestList.paging\"\n        [hidden]=\"true\"\n        (onLoad)=\"updateList($event)\"\n      ></c8y-load-more>\n    </ng-container>\n\n    <ng-template #noData>\n      <div class=\"c8y-empty-state m-t-40 text-center\">\n        <h1 class=\"c8y-icon c8y-icon-device-connect c8y-icon-duocolor\"></h1>\n        <ng-container *ngIf=\"limitStatus?.isReached; else limitNotReached\">\n          <h3>\n            {{ limitReachedInfo$ | async }}\n          </h3>\n          <p translate>Please contact your platform administrator.</p>\n        </ng-container>\n        <ng-template #limitNotReached>\n          <h3 translate>No pending registrations to display.</h3>\n          <p\n            *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\n            translate\n          >\n            Use the \"Register device\" dropdown in the top right corner.\n          </p>\n        </ng-template>\n      </div>\n    </ng-template>\n  </ng-container>\n</ng-container>\n" }]
-        }], ctorParameters: () => [{ type: RegisterDeviceService }, { type: i1$1.DeviceBootstrapRealtimeService }, { type: i1$1.TenantUiService }, { type: i1$1.ModalService }, { type: i5.TranslateService }, { type: i1$1.OptionsService }, { type: i1.ActivatedRoute }, { type: GeneralDeviceRegistrationService }] });
+            args: [{ selector: 'c8y-device-registration-view', imports: [
+                        NgIf,
+                        TitleComponent,
+                        BreadcrumbComponent,
+                        BreadcrumbItemComponent,
+                        ActionBarItemComponent,
+                        ListDisplaySwitchComponent,
+                        IfAllowedDirective,
+                        IconDirective,
+                        NgClass,
+                        RegisterDeviceDropdownComponent,
+                        HelpComponent,
+                        C8yTranslateDirective,
+                        PopoverDirective,
+                        NgFor,
+                        FormsModule,
+                        RequiredInputPlaceholderDirective,
+                        LoadMoreComponent,
+                        C8yTranslatePipe,
+                        AsyncPipe,
+                        DatePipe
+                    ], template: "<ng-container *ngIf=\"deviceRequests$ | async as deviceRequestList\">\n  <c8y-title>\n    {{ 'Device registration' | translate }}\n    <small *ngIf=\"deviceRequestList.data.length === 1\">1 {{ 'new device' | translate }}</small>\n    <small *ngIf=\"deviceRequestList.data.length > 1\">\n      {{ deviceRequestList.data.length }} {{ 'new devices' | translate }}\n    </small>\n  </c8y-title>\n\n  <c8y-breadcrumb>\n    <c8y-breadcrumb-item\n      [icon]=\"'exchange'\"\n      [label]=\"'Devices' | translate\"\n    ></c8y-breadcrumb-item>\n    <c8y-breadcrumb-item\n      [icon]=\"'c8y-device-connect'\"\n      [label]=\"'Device registration' | translate\"\n    ></c8y-breadcrumb-item>\n  </c8y-breadcrumb>\n\n  <c8y-action-bar-item\n    [placement]=\"'left'\"\n    itemClass=\"navbar-form hidden-xs\"\n  >\n    <c8y-list-display-switch (onListClassChange)=\"displayMode($event)\"></c8y-list-display-switch>\n  </c8y-action-bar-item>\n\n  <ng-container *ngIf=\"limit$ | async as limitStatus\">\n    <c8y-action-bar-item\n      [placement]=\"'right'\"\n      [priority]=\"10\"\n    >\n      <button\n        class=\"btn btn-link\"\n        title=\"{{ 'Accept all' | translate }}\"\n        type=\"button\"\n        *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\n        (click)=\"acceptAll()\"\n        [disabled]=\"canAcceptAll() || limitStatus?.isReached\"\n      >\n        <i [c8yIcon]=\"'check'\"></i>\n        {{ 'Accept all' | translate }}\n      </button>\n    </c8y-action-bar-item>\n\n    <c8y-action-bar-item\n      [placement]=\"'right'\"\n      [priority]=\"9\"\n    >\n      <button\n        class=\"btn btn-link\"\n        title=\"{{ 'Reload' | translate }}\"\n        type=\"button\"\n        (click)=\"loadAll()\"\n        [disabled]=\"isLoading\"\n      >\n        <i\n          [c8yIcon]=\"'refresh'\"\n          [ngClass]=\"{ 'icon-spin': isLoading }\"\n        ></i>\n        {{ 'Reload' | translate }}\n      </button>\n    </c8y-action-bar-item>\n\n    <c8y-action-bar-item\n      [placement]=\"'right'\"\n      *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\n    >\n      <c8y-register-device-dropdown></c8y-register-device-dropdown>\n    </c8y-action-bar-item>\n\n    <c8y-help\n      src=\"/docs/device-management-application/registering-devices/#registering-devices\"\n    ></c8y-help>\n\n    <ng-container *ngIf=\"deviceRequestList.data.length > 0; else noData\">\n      <div\n        class=\"card-group\"\n        [ngClass]=\"gridOrList\"\n      >\n        <!-- START interact-list sticky header START -->\n        <div\n          class=\"page-sticky-header hidden-xs\"\n          *ngIf=\"gridOrList === 'interact-list'\"\n        >\n          <div class=\"d-flex\">\n            <div class=\"card-header p-l-40\">\n              <p translate>Device</p>\n            </div>\n            <div class=\"card-block card-column-30 p-l-0 m-l-8\">\n              <p translate>Status</p>\n            </div>\n            <div\n              class=\"card-block card-column-30 p-0\"\n              *ngIf=\"showTokenInputBasedOnSecurityMode()\"\n            >\n              <p translate>Security token</p>\n              <button\n                class=\"btn-help\"\n                [attr.aria-label]=\"'Help' | translate\"\n                popover=\"{{\n                  'Security token is required if the connected device uses it.' | translate\n                }}\"\n                placement=\"right\"\n                triggers=\"focus\"\n                container=\"body\"\n                type=\"button\"\n              ></button>\n            </div>\n            <div class=\"card-footer card-column-50\">\n              <div\n                class=\"d-contents\"\n                *ngIf=\"isManagementTenant; else noManagement\"\n              >\n                <div class=\"card-column-50\">\n                  {{ 'Created' | translate }}\n                </div>\n                <div class=\"card-column-30\">\n                  {{ 'By`user`' | translate }}\n                </div>\n                <div class=\"card-column-20\">\n                  {{ 'Tenant ID' | translate }}\n                </div>\n              </div>\n              <ng-template #noManagement>\n                <div class=\"d-contents\">\n                  <div class=\"card-column-50\">\n                    {{ 'Created' | translate }}\n                  </div>\n                  <div class=\"card-column-50\">\n                    {{ 'By`user`' | translate }}\n                  </div>\n                </div>\n              </ng-template>\n            </div>\n            <div\n              class=\"card-actions-group\"\n              style=\"min-width: 176px\"\n            >\n              <div class=\"btn btn-xs invisible\">\n                <!--EMPTY by design-->\n              </div>\n            </div>\n          </div>\n        </div>\n        <!-- END interact-list sticky header END -->\n\n        <div\n          class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3\"\n          *ngIf=\"limitStatus?.isReached\"\n        >\n          <p\n            class=\"alert alert-warning center-block\"\n            role=\"alert\"\n          >\n            <strong>\n              {{ limitReachedInfo$ | async }}\n            </strong>\n            <br />\n            <span translate>Please contact your platform administrator.</span>\n          </p>\n        </div>\n\n        <ng-container *ngFor=\"let singleRequest of deviceRequestList.data\">\n          <div class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3\">\n            <div class=\"card\">\n              <div class=\"card-header separator\">\n                <div class=\"card-icon\">\n                  <i\n                    [class]=\"statusProps[singleRequest.status].cls\"\n                    [c8yIcon]=\"statusProps[singleRequest.status].icon\"\n                  ></i>\n                </div>\n                <p\n                  class=\"card-title text-truncate\"\n                  title=\"{{ singleRequest.id }}\"\n                >\n                  {{ singleRequest.id }}\n                </p>\n              </div>\n\n              <div class=\"card-block text-center card-column-30\">\n                <span\n                  class=\"text-label-small\"\n                  translate\n                >\n                  Status\n                </span>\n                <p>\n                  <i\n                    class=\"icon-spin text-primary\"\n                    c8yIcon=\"refresh\"\n                    *ngIf=\"singleRequest.status === status.WAITING_FOR_CONNECTION\"\n                  ></i>\n                  {{ statusProps[singleRequest.status].label | translate }}\n                </p>\n              </div>\n\n              <ng-container *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\">\n                <div\n                  class=\"card-block text-center card-column-30 p-t-0\"\n                  [ngClass]=\"{ 'p-b-0': !shouldShowSecurityTokenInput(singleRequest) }\"\n                  *ngIf=\"showTokenInputBasedOnSecurityMode()\"\n                >\n                  <ng-container *ngIf=\"shouldShowSecurityTokenInput(singleRequest)\">\n                    <span\n                      class=\"text-label-small\"\n                      *ngIf=\"gridOrList !== 'interact-list'\"\n                      translate\n                    >\n                      Security token\n                    </span>\n                    <input\n                      class=\"form-control\"\n                      type=\"text\"\n                      [(ngModel)]=\"singleRequest.securityToken\"\n                      [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'A1e3gh5ds' }\"\n                      [required]=\"requireSecurityToken\"\n                    />\n                  </ng-container>\n                </div>\n\n                <div\n                  class=\"card-actions-group d-flex a-i-center j-c-center\"\n                  style=\"min-width: 176px\"\n                >\n                  <button\n                    class=\"btn btn-sm\"\n                    title=\"{{\n                      singleRequest.status === status.PENDING_ACCEPTANCE\n                        ? ('Remove' | translate)\n                        : ('Cancel' | translate)\n                    }}\"\n                    type=\"button\"\n                    [ngClass]=\"{\n                      'btn-danger': singleRequest.status === status.PENDING_ACCEPTANCE,\n                      'btn-default': singleRequest.status !== status.PENDING_ACCEPTANCE\n                    }\"\n                    (click)=\"delete(singleRequest.id)\"\n                    [disabled]=\"isLoading\"\n                  >\n                    <span *ngIf=\"singleRequest.status === status.PENDING_ACCEPTANCE\">\n                      {{ 'Remove' | translate }}\n                    </span>\n                    <span *ngIf=\"singleRequest.status !== status.PENDING_ACCEPTANCE\">\n                      {{ 'Cancel' | translate }}\n                    </span>\n                  </button>\n                  <button\n                    class=\"btn btn-primary btn-sm\"\n                    title=\"{{ 'Accept' | translate }}\"\n                    type=\"button\"\n                    (click)=\"accept(singleRequest)\"\n                    *ngIf=\"singleRequest.status === status.PENDING_ACCEPTANCE\"\n                    [disabled]=\"\n                      isLoading ||\n                      limitStatus?.isReached ||\n                      (!singleRequest.securityToken && requireSecurityToken)\n                    \"\n                  >\n                    {{ 'Accept' | translate }}\n                  </button>\n                </div>\n              </ng-container>\n\n              <div class=\"card-footer separator text-center card-column-50\">\n                <small\n                  class=\"d-contents\"\n                  *ngIf=\"isManagementTenant; else noManagement\"\n                >\n                  <div\n                    class=\"d-contents\"\n                    *ngIf=\"singleRequest.creationTime && singleRequest.owner\"\n                  >\n                    <span class=\"card-column-50\">\n                      <span\n                        class=\"text-label-small m-l-4 m-r-4\"\n                        translate\n                      >\n                        Created on`date`\n                      </span>\n                      <span data-cy=\"device-registration--creation-date\">\n                        {{ singleRequest.creationTime | c8yDate }}\n                      </span>\n                    </span>\n                    <span class=\"card-column-30 text-truncate\">\n                      <span\n                        class=\"text-label-small m-l-4 m-r-4\"\n                        translate\n                      >\n                        by`user`\n                      </span>\n                      <span\n                        title=\"{{ singleRequest.owner }}\"\n                        data-cy=\"device-registration--created-by\"\n                      >\n                        {{ singleRequest.owner }}\n                      </span>\n                    </span>\n                    <span class=\"card-column-20\">\n                      <span\n                        class=\"text-label-small m-l-4 m-r-4\"\n                        translate\n                      >\n                        in`tenant`\n                      </span>\n                      <span>{{ singleRequest.tenantId }}</span>\n                    </span>\n                  </div>\n                  <div\n                    class=\"d-contents\"\n                    *ngIf=\"!singleRequest.creationTime || !singleRequest.owner\"\n                  >\n                    <div class=\"card-column-50\"></div>\n                    <div class=\"card-column-30\"></div>\n                    <span\n                      class=\"text-label-small\"\n                      translate\n                    >\n                      Created in`tenant`\n                    </span>\n                    <div class=\"card-column-20\">\n                      <span>\n                        {{ singleRequest.tenantId }}\n                      </span>\n                    </div>\n                  </div>\n                </small>\n                <ng-template #noManagement>\n                  <small class=\"d-contents\">\n                    <span class=\"card-column-50\">\n                      <span\n                        class=\"text-label-small m-l-4 m-r-4\"\n                        translate\n                      >\n                        Created on`date`\n                      </span>\n                      <span data-cy=\"device-registration--creation-date\">\n                        {{ singleRequest.creationTime | c8yDate }}\n                      </span>\n                    </span>\n                    <span class=\"card-column-50 text-truncate\">\n                      <span\n                        class=\"text-label-small m-l-4 m-r-4\"\n                        translate\n                      >\n                        by`user`\n                      </span>\n                      <span\n                        title=\"{{ singleRequest.owner }}\"\n                        data-cy=\"device-registration--created-by\"\n                      >\n                        {{ singleRequest.owner }}\n                      </span>\n                    </span>\n                  </small>\n                </ng-template>\n              </div>\n            </div>\n          </div>\n        </ng-container>\n      </div>\n      <c8y-load-more\n        [paging]=\"deviceRequestList.paging\"\n        [hidden]=\"true\"\n        (onLoad)=\"updateList($event)\"\n      ></c8y-load-more>\n    </ng-container>\n\n    <ng-template #noData>\n      <div class=\"c8y-empty-state m-t-40 text-center\">\n        <h1 class=\"c8y-icon c8y-icon-device-connect c8y-icon-duocolor\"></h1>\n        <ng-container *ngIf=\"limitStatus?.isReached; else limitNotReached\">\n          <h3>\n            {{ limitReachedInfo$ | async }}\n          </h3>\n          <p translate>Please contact your platform administrator.</p>\n        </ng-container>\n        <ng-template #limitNotReached>\n          <h3 translate>No pending registrations to display.</h3>\n          <p\n            *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\n            translate\n          >\n            Use the \"Register device\" dropdown in the top right corner.\n          </p>\n        </ng-template>\n      </div>\n    </ng-template>\n  </ng-container>\n</ng-container>\n" }]
+        }], ctorParameters: () => [{ type: RegisterDeviceService }, { type: i1$2.DeviceBootstrapRealtimeService }, { type: i1$2.TenantUiService }, { type: i1$2.ModalService }, { type: i3.TranslateService }, { type: i1$2.OptionsService }, { type: i1.ActivatedRoute }, { type: GeneralDeviceRegistrationService }] });
 
 class RegisterDeviceNavigationFactory {
     constructor(permissions) {
@@ -925,12 +801,12 @@ class RegisterDeviceNavigationFactory {
         }
         return nav;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: RegisterDeviceNavigationFactory, deps: [{ token: i1$1.Permissions }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: RegisterDeviceNavigationFactory, deps: [{ token: i1$2.Permissions }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: RegisterDeviceNavigationFactory }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: RegisterDeviceNavigationFactory, decorators: [{
             type: Injectable
-        }], ctorParameters: () => [{ type: i1$1.Permissions }] });
+        }], ctorParameters: () => [{ type: i1$2.Permissions }] });
 
 class BaseExtensibleDeviceRegistrationService {
     constructor(applicationService, stateService) {
@@ -1022,12 +898,22 @@ class ExtensibleDeviceRegistrationService extends BaseExtensibleDeviceRegistrati
         const data = await res.json();
         return { res, data };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ExtensibleDeviceRegistrationService, deps: [{ token: i2.ApplicationService }, { token: i1$1.AppStateService }, { token: i2.FetchClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ExtensibleDeviceRegistrationService, deps: [{ token: i1$1.ApplicationService }, { token: i1$2.AppStateService }, { token: i1$1.FetchClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ExtensibleDeviceRegistrationService }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ExtensibleDeviceRegistrationService, decorators: [{
             type: Injectable
-        }], ctorParameters: () => [{ type: i2.ApplicationService }, { type: i1$1.AppStateService }, { type: i2.FetchClient }] });
+        }], ctorParameters: () => [{ type: i1$1.ApplicationService }, { type: i1$2.AppStateService }, { type: i1$1.FetchClient }] });
+
+const PRODUCT_EXPERIENCE_BASE_REGISTRATION = {
+    EVENT: 'deviceRegistration',
+    COMPONENT: {
+        BULK: 'bulk-registration',
+        EXTENSIBLE_BULK: 'bulk-extensible-registration',
+        EXTENSIBLE_SINGLE: 'single-extensible-registration'
+    },
+    RESULT: { SUCCESS: 'registrationSuccess', FAILURE: 'registrationFailure' }
+};
 
 class ExtensibleDeviceRegistrationStepperComponent {
     constructor(customProviderService, registerDeviceService, bsModalRef, gainsightService) {
@@ -1112,13 +998,23 @@ class ExtensibleDeviceRegistrationStepperComponent {
         });
         this.errorMessage = message;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ExtensibleDeviceRegistrationStepperComponent, deps: [{ token: ExtensibleDeviceRegistrationService }, { token: RegisterDeviceService }, { token: i4.BsModalRef }, { token: i1$1.GainsightService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ExtensibleDeviceRegistrationStepperComponent, isStandalone: false, selector: "c8y-extensible-device-registration-stepper", inputs: { contextPath: "contextPath", labels: "labels", steps: "steps" }, viewQueries: [{ propertyName: "stepper", first: true, predicate: C8yStepper, descendants: true, static: true }], ngImport: i0, template: "<c8y-stepper\n  [disableProgressButtons]=\"true\"\n  [disableDefaultIcons]=\"{ edit: true, done: false }\"\n  [customClasses]=\"['m-40', 'm-t-8', 'm-b-16']\"\n>\n  <cdk-step *ngFor=\"let step of steps; let i = index\" [stepControl]=\"forms[i]\" [label]=\"labels[i]\">\n    <c8y-form-group class=\"form-group p-24 p-b-0 p-t-16\">\n      <formly-form [form]=\"forms[i]\" [fields]=\"step\" [model]=\"model\"></formly-form>\n    </c8y-form-group>\n    <c8y-stepper-buttons\n      class=\"sticky-bottom d-block modal-footer separator-top bg-component\"\n      *ngIf=\"isRegistrationStep()\"\n      [showButtons]=\"{ cancel: true, back: true, next: true }\"\n      [labels]=\"{ next: 'Register' }\"\n      (onCancel)=\"close()\"\n      (onNext)=\"save()\"\n      [pending]=\"pendingStatus\"\n      [disabled]=\"forms[i].invalid\"\n    ></c8y-stepper-buttons>\n    <c8y-stepper-buttons\n      class=\"sticky-bottom d-block modal-footer separator-top bg-component\"\n      *ngIf=\"!isRegistrationStep()\"\n      [showButtons]=\"{ cancel: true, back: i !== 0, next: true }\"\n      [disabled]=\"forms[i].invalid\"\n      (onCancel)=\"close()\"\n    ></c8y-stepper-buttons>\n  </cdk-step>\n  <cdk-step [state]=\"finalStepStatus()\" label=\"{{ 'Summary' | translate }}\">\n    <c8y-operation-result\n      *ngIf=\"!errorMessage; else errorInfo\"\n      text=\"{{ message | translate }}\"\n      [size]=\"84\"\n      [vertical]=\"true\"\n      type=\"success\"\n      class=\"lead\"\n      data-cy=\"success\"\n    ></c8y-operation-result>\n    <ng-template #errorInfo>\n      <c8y-operation-result\n        text=\"{{ errorMessage | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n        type=\"error\"\n        class=\"lead\"\n        data-cy=\"error\"\n      ></c8y-operation-result>\n    </ng-template>\n    <c8y-stepper-buttons\n      class=\"sticky-bottom d-block modal-footer separator-top bg-component\"\n      [showButtons]=\"{ cancel: errorMessage, back: errorMessage, next: !errorMessage }\"\n      [labels]=\"{ back: 'Fix issue', next: 'Close' }\"\n      (onCancel)=\"close()\"\n      (onNext)=\"complete()\"\n      (onBack)=\"goToFirstStep()\"\n    ></c8y-stepper-buttons>\n  </cdk-step>\n</c8y-stepper>\n", dependencies: [{ kind: "directive", type: i5$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$1.OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "component", type: i1$1.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "component", type: i1$1.C8yStepper, selector: "c8y-stepper", inputs: ["disableDefaultIcons", "disableProgressButtons", "customClasses", "hideStepProgress", "useStepLabelsAsTitlesOnly"], outputs: ["onStepChange"] }, { kind: "component", type: i6.CdkStep, selector: "cdk-step", inputs: ["stepControl", "label", "errorMessage", "aria-label", "aria-labelledby", "state", "editable", "optional", "completed", "hasError"], outputs: ["interacted"], exportAs: ["cdkStep"] }, { kind: "component", type: i1$1.C8yStepperButtons, selector: "c8y-stepper-buttons", inputs: ["labels", "pending", "disabled", "showButtons"], outputs: ["onCancel", "onNext", "onBack", "onCustom"] }, { kind: "component", type: i7.FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "pipe", type: i1$1.C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ExtensibleDeviceRegistrationStepperComponent, deps: [{ token: ExtensibleDeviceRegistrationService }, { token: RegisterDeviceService }, { token: i4.BsModalRef }, { token: i1$2.GainsightService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ExtensibleDeviceRegistrationStepperComponent, isStandalone: true, selector: "c8y-extensible-device-registration-stepper", inputs: { contextPath: "contextPath", labels: "labels", steps: "steps" }, viewQueries: [{ propertyName: "stepper", first: true, predicate: C8yStepper, descendants: true, static: true }], ngImport: i0, template: "<c8y-stepper\n  [disableProgressButtons]=\"true\"\n  [disableDefaultIcons]=\"{ edit: true, done: false }\"\n  [customClasses]=\"['m-40', 'm-t-8', 'm-b-16']\"\n>\n  <cdk-step *ngFor=\"let step of steps; let i = index\" [stepControl]=\"forms[i]\" [label]=\"labels[i]\">\n    <c8y-form-group class=\"form-group p-24 p-b-0 p-t-16\">\n      <formly-form [form]=\"forms[i]\" [fields]=\"step\" [model]=\"model\"></formly-form>\n    </c8y-form-group>\n    <c8y-stepper-buttons\n      class=\"sticky-bottom d-block modal-footer separator-top bg-component\"\n      *ngIf=\"isRegistrationStep()\"\n      [showButtons]=\"{ cancel: true, back: true, next: true }\"\n      [labels]=\"{ next: 'Register' }\"\n      (onCancel)=\"close()\"\n      (onNext)=\"save()\"\n      [pending]=\"pendingStatus\"\n      [disabled]=\"forms[i].invalid\"\n    ></c8y-stepper-buttons>\n    <c8y-stepper-buttons\n      class=\"sticky-bottom d-block modal-footer separator-top bg-component\"\n      *ngIf=\"!isRegistrationStep()\"\n      [showButtons]=\"{ cancel: true, back: i !== 0, next: true }\"\n      [disabled]=\"forms[i].invalid\"\n      (onCancel)=\"close()\"\n    ></c8y-stepper-buttons>\n  </cdk-step>\n  <cdk-step [state]=\"finalStepStatus()\" label=\"{{ 'Summary' | translate }}\">\n    <c8y-operation-result\n      *ngIf=\"!errorMessage; else errorInfo\"\n      text=\"{{ message | translate }}\"\n      [size]=\"84\"\n      [vertical]=\"true\"\n      type=\"success\"\n      class=\"lead\"\n      data-cy=\"success\"\n    ></c8y-operation-result>\n    <ng-template #errorInfo>\n      <c8y-operation-result\n        text=\"{{ errorMessage | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n        type=\"error\"\n        class=\"lead\"\n        data-cy=\"error\"\n      ></c8y-operation-result>\n    </ng-template>\n    <c8y-stepper-buttons\n      class=\"sticky-bottom d-block modal-footer separator-top bg-component\"\n      [showButtons]=\"{ cancel: errorMessage, back: errorMessage, next: !errorMessage }\"\n      [labels]=\"{ back: 'Fix issue', next: 'Close' }\"\n      (onCancel)=\"close()\"\n      (onNext)=\"complete()\"\n      (onBack)=\"goToFirstStep()\"\n    ></c8y-stepper-buttons>\n  </cdk-step>\n</c8y-stepper>\n", dependencies: [{ kind: "component", type: C8yStepper, selector: "c8y-stepper", inputs: ["disableDefaultIcons", "disableProgressButtons", "customClasses", "hideStepProgress", "useStepLabelsAsTitlesOnly"], outputs: ["onStepChange"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: CdkStep, selector: "cdk-step", inputs: ["stepControl", "label", "errorMessage", "aria-label", "aria-labelledby", "state", "editable", "optional", "completed", "hasError"], outputs: ["interacted"], exportAs: ["cdkStep"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i5.FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: C8yStepperButtons, selector: "c8y-stepper-buttons", inputs: ["labels", "pending", "disabled", "showButtons"], outputs: ["onCancel", "onNext", "onBack", "onCustom"] }, { kind: "component", type: OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ExtensibleDeviceRegistrationStepperComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-extensible-device-registration-stepper', standalone: false, template: "<c8y-stepper\n  [disableProgressButtons]=\"true\"\n  [disableDefaultIcons]=\"{ edit: true, done: false }\"\n  [customClasses]=\"['m-40', 'm-t-8', 'm-b-16']\"\n>\n  <cdk-step *ngFor=\"let step of steps; let i = index\" [stepControl]=\"forms[i]\" [label]=\"labels[i]\">\n    <c8y-form-group class=\"form-group p-24 p-b-0 p-t-16\">\n      <formly-form [form]=\"forms[i]\" [fields]=\"step\" [model]=\"model\"></formly-form>\n    </c8y-form-group>\n    <c8y-stepper-buttons\n      class=\"sticky-bottom d-block modal-footer separator-top bg-component\"\n      *ngIf=\"isRegistrationStep()\"\n      [showButtons]=\"{ cancel: true, back: true, next: true }\"\n      [labels]=\"{ next: 'Register' }\"\n      (onCancel)=\"close()\"\n      (onNext)=\"save()\"\n      [pending]=\"pendingStatus\"\n      [disabled]=\"forms[i].invalid\"\n    ></c8y-stepper-buttons>\n    <c8y-stepper-buttons\n      class=\"sticky-bottom d-block modal-footer separator-top bg-component\"\n      *ngIf=\"!isRegistrationStep()\"\n      [showButtons]=\"{ cancel: true, back: i !== 0, next: true }\"\n      [disabled]=\"forms[i].invalid\"\n      (onCancel)=\"close()\"\n    ></c8y-stepper-buttons>\n  </cdk-step>\n  <cdk-step [state]=\"finalStepStatus()\" label=\"{{ 'Summary' | translate }}\">\n    <c8y-operation-result\n      *ngIf=\"!errorMessage; else errorInfo\"\n      text=\"{{ message | translate }}\"\n      [size]=\"84\"\n      [vertical]=\"true\"\n      type=\"success\"\n      class=\"lead\"\n      data-cy=\"success\"\n    ></c8y-operation-result>\n    <ng-template #errorInfo>\n      <c8y-operation-result\n        text=\"{{ errorMessage | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n        type=\"error\"\n        class=\"lead\"\n        data-cy=\"error\"\n      ></c8y-operation-result>\n    </ng-template>\n    <c8y-stepper-buttons\n      class=\"sticky-bottom d-block modal-footer separator-top bg-component\"\n      [showButtons]=\"{ cancel: errorMessage, back: errorMessage, next: !errorMessage }\"\n      [labels]=\"{ back: 'Fix issue', next: 'Close' }\"\n      (onCancel)=\"close()\"\n      (onNext)=\"complete()\"\n      (onBack)=\"goToFirstStep()\"\n    ></c8y-stepper-buttons>\n  </cdk-step>\n</c8y-stepper>\n" }]
-        }], ctorParameters: () => [{ type: ExtensibleDeviceRegistrationService }, { type: RegisterDeviceService }, { type: i4.BsModalRef }, { type: i1$1.GainsightService }], propDecorators: { stepper: [{
+            args: [{ selector: 'c8y-extensible-device-registration-stepper', imports: [
+                        C8yStepper,
+                        NgFor,
+                        CdkStep,
+                        FormGroupComponent,
+                        FormlyModule,
+                        NgIf,
+                        C8yStepperButtons,
+                        OperationResultComponent,
+                        C8yTranslatePipe
+                    ], template: "<c8y-stepper\n  [disableProgressButtons]=\"true\"\n  [disableDefaultIcons]=\"{ edit: true, done: false }\"\n  [customClasses]=\"['m-40', 'm-t-8', 'm-b-16']\"\n>\n  <cdk-step *ngFor=\"let step of steps; let i = index\" [stepControl]=\"forms[i]\" [label]=\"labels[i]\">\n    <c8y-form-group class=\"form-group p-24 p-b-0 p-t-16\">\n      <formly-form [form]=\"forms[i]\" [fields]=\"step\" [model]=\"model\"></formly-form>\n    </c8y-form-group>\n    <c8y-stepper-buttons\n      class=\"sticky-bottom d-block modal-footer separator-top bg-component\"\n      *ngIf=\"isRegistrationStep()\"\n      [showButtons]=\"{ cancel: true, back: true, next: true }\"\n      [labels]=\"{ next: 'Register' }\"\n      (onCancel)=\"close()\"\n      (onNext)=\"save()\"\n      [pending]=\"pendingStatus\"\n      [disabled]=\"forms[i].invalid\"\n    ></c8y-stepper-buttons>\n    <c8y-stepper-buttons\n      class=\"sticky-bottom d-block modal-footer separator-top bg-component\"\n      *ngIf=\"!isRegistrationStep()\"\n      [showButtons]=\"{ cancel: true, back: i !== 0, next: true }\"\n      [disabled]=\"forms[i].invalid\"\n      (onCancel)=\"close()\"\n    ></c8y-stepper-buttons>\n  </cdk-step>\n  <cdk-step [state]=\"finalStepStatus()\" label=\"{{ 'Summary' | translate }}\">\n    <c8y-operation-result\n      *ngIf=\"!errorMessage; else errorInfo\"\n      text=\"{{ message | translate }}\"\n      [size]=\"84\"\n      [vertical]=\"true\"\n      type=\"success\"\n      class=\"lead\"\n      data-cy=\"success\"\n    ></c8y-operation-result>\n    <ng-template #errorInfo>\n      <c8y-operation-result\n        text=\"{{ errorMessage | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n        type=\"error\"\n        class=\"lead\"\n        data-cy=\"error\"\n      ></c8y-operation-result>\n    </ng-template>\n    <c8y-stepper-buttons\n      class=\"sticky-bottom d-block modal-footer separator-top bg-component\"\n      [showButtons]=\"{ cancel: errorMessage, back: errorMessage, next: !errorMessage }\"\n      [labels]=\"{ back: 'Fix issue', next: 'Close' }\"\n      (onCancel)=\"close()\"\n      (onNext)=\"complete()\"\n      (onBack)=\"goToFirstStep()\"\n    ></c8y-stepper-buttons>\n  </cdk-step>\n</c8y-stepper>\n" }]
+        }], ctorParameters: () => [{ type: ExtensibleDeviceRegistrationService }, { type: RegisterDeviceService }, { type: i4.BsModalRef }, { type: i1$2.GainsightService }], propDecorators: { stepper: [{
                 type: ViewChild,
                 args: [C8yStepper, { static: true }]
             }], contextPath: [{
@@ -1152,13 +1048,20 @@ class ExtensibleDeviceRegistrationModalComponent {
             return [this.jsonschema.toFieldConfig(step)];
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ExtensibleDeviceRegistrationModalComponent, deps: [{ token: i4.BsModalRef }, { token: i1$1.C8yJSONSchema }, { token: ExtensibleDeviceRegistrationService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ExtensibleDeviceRegistrationModalComponent, isStandalone: false, selector: "extensible-device-registration-modal", ngImport: i0, template: "<c8y-modal\n  [title]=\"title | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <span class=\"c8y-icon c8y-icon-device-connect\"></span>\n  </ng-container>\n  <ng-container *ngIf=\"pages as steps; else loadingOrError\">\n    <c8y-extensible-device-registration-stepper\n      c8y-modal-body\n      [steps]=\"steps\"\n      [labels]=\"labels\"\n      [contextPath]=\"contextPath\"\n    ></c8y-extensible-device-registration-stepper>\n  </ng-container>\n  <ng-template #loadingOrError>\n    <ng-container *ngIf=\"loadingErrorMessage; else loading\">\n      <c8y-operation-result\n        class=\"lead text-regular\"\n        type=\"error\"\n        text=\"{{ loadingErrorMessage | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n        data-cy=\"error\"\n      ></c8y-operation-result>\n      <div class=\"modal-footer\">\n        <button\n          class=\"btn btn-default\"\n          title=\"{{ 'Close' | translate }}\"\n          type=\"button\"\n          (click)=\"bsModalRef.hide()\"\n        >\n          {{ 'Close' | translate }}\n        </button>\n      </div>\n    </ng-container>\n    <ng-template #loading>\n      <div class=\"modal-header modal-header-info text-center\">\n        <c8y-loading\n          class=\"text-center\"\n          layout=\"application\"\n          [message]=\"'Loading the registration form definition\u2026' | translate\"\n        ></c8y-loading>\n      </div>\n    </ng-template>\n  </ng-template>\n</c8y-modal>\n", dependencies: [{ kind: "directive", type: i5$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$1.LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "component", type: i1$1.OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "component", type: i1$1.ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "component", type: ExtensibleDeviceRegistrationStepperComponent, selector: "c8y-extensible-device-registration-stepper", inputs: ["contextPath", "labels", "steps"] }, { kind: "pipe", type: i1$1.C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ExtensibleDeviceRegistrationModalComponent, deps: [{ token: i4.BsModalRef }, { token: i1$2.C8yJSONSchema }, { token: ExtensibleDeviceRegistrationService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ExtensibleDeviceRegistrationModalComponent, isStandalone: true, selector: "extensible-device-registration-modal", ngImport: i0, template: "<c8y-modal\n  [title]=\"title | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <span class=\"c8y-icon c8y-icon-device-connect\"></span>\n  </ng-container>\n  <ng-container *ngIf=\"pages as steps; else loadingOrError\">\n    <c8y-extensible-device-registration-stepper\n      c8y-modal-body\n      [steps]=\"steps\"\n      [labels]=\"labels\"\n      [contextPath]=\"contextPath\"\n    ></c8y-extensible-device-registration-stepper>\n  </ng-container>\n  <ng-template #loadingOrError>\n    <ng-container *ngIf=\"loadingErrorMessage; else loading\">\n      <c8y-operation-result\n        class=\"lead text-regular\"\n        type=\"error\"\n        text=\"{{ loadingErrorMessage | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n        data-cy=\"error\"\n      ></c8y-operation-result>\n      <div class=\"modal-footer\">\n        <button\n          class=\"btn btn-default\"\n          title=\"{{ 'Close' | translate }}\"\n          type=\"button\"\n          (click)=\"bsModalRef.hide()\"\n        >\n          {{ 'Close' | translate }}\n        </button>\n      </div>\n    </ng-container>\n    <ng-template #loading>\n      <div class=\"modal-header modal-header-info text-center\">\n        <c8y-loading\n          class=\"text-center\"\n          layout=\"application\"\n          [message]=\"'Loading the registration form definition\u2026' | translate\"\n        ></c8y-loading>\n      </div>\n    </ng-template>\n  </ng-template>\n</c8y-modal>\n", dependencies: [{ kind: "component", type: ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ExtensibleDeviceRegistrationStepperComponent, selector: "c8y-extensible-device-registration-stepper", inputs: ["contextPath", "labels", "steps"] }, { kind: "component", type: OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ExtensibleDeviceRegistrationModalComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'extensible-device-registration-modal', standalone: false, template: "<c8y-modal\n  [title]=\"title | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <span class=\"c8y-icon c8y-icon-device-connect\"></span>\n  </ng-container>\n  <ng-container *ngIf=\"pages as steps; else loadingOrError\">\n    <c8y-extensible-device-registration-stepper\n      c8y-modal-body\n      [steps]=\"steps\"\n      [labels]=\"labels\"\n      [contextPath]=\"contextPath\"\n    ></c8y-extensible-device-registration-stepper>\n  </ng-container>\n  <ng-template #loadingOrError>\n    <ng-container *ngIf=\"loadingErrorMessage; else loading\">\n      <c8y-operation-result\n        class=\"lead text-regular\"\n        type=\"error\"\n        text=\"{{ loadingErrorMessage | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n        data-cy=\"error\"\n      ></c8y-operation-result>\n      <div class=\"modal-footer\">\n        <button\n          class=\"btn btn-default\"\n          title=\"{{ 'Close' | translate }}\"\n          type=\"button\"\n          (click)=\"bsModalRef.hide()\"\n        >\n          {{ 'Close' | translate }}\n        </button>\n      </div>\n    </ng-container>\n    <ng-template #loading>\n      <div class=\"modal-header modal-header-info text-center\">\n        <c8y-loading\n          class=\"text-center\"\n          layout=\"application\"\n          [message]=\"'Loading the registration form definition\u2026' | translate\"\n        ></c8y-loading>\n      </div>\n    </ng-template>\n  </ng-template>\n</c8y-modal>\n" }]
-        }], ctorParameters: () => [{ type: i4.BsModalRef }, { type: i1$1.C8yJSONSchema }, { type: ExtensibleDeviceRegistrationService }] });
+            args: [{ selector: 'extensible-device-registration-modal', imports: [
+                        ModalComponent,
+                        NgIf,
+                        ExtensibleDeviceRegistrationStepperComponent,
+                        OperationResultComponent,
+                        LoadingComponent,
+                        C8yTranslatePipe
+                    ], template: "<c8y-modal\n  [title]=\"title | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <span class=\"c8y-icon c8y-icon-device-connect\"></span>\n  </ng-container>\n  <ng-container *ngIf=\"pages as steps; else loadingOrError\">\n    <c8y-extensible-device-registration-stepper\n      c8y-modal-body\n      [steps]=\"steps\"\n      [labels]=\"labels\"\n      [contextPath]=\"contextPath\"\n    ></c8y-extensible-device-registration-stepper>\n  </ng-container>\n  <ng-template #loadingOrError>\n    <ng-container *ngIf=\"loadingErrorMessage; else loading\">\n      <c8y-operation-result\n        class=\"lead text-regular\"\n        type=\"error\"\n        text=\"{{ loadingErrorMessage | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n        data-cy=\"error\"\n      ></c8y-operation-result>\n      <div class=\"modal-footer\">\n        <button\n          class=\"btn btn-default\"\n          title=\"{{ 'Close' | translate }}\"\n          type=\"button\"\n          (click)=\"bsModalRef.hide()\"\n        >\n          {{ 'Close' | translate }}\n        </button>\n      </div>\n    </ng-container>\n    <ng-template #loading>\n      <div class=\"modal-header modal-header-info text-center\">\n        <c8y-loading\n          class=\"text-center\"\n          layout=\"application\"\n          [message]=\"'Loading the registration form definition\u2026' | translate\"\n        ></c8y-loading>\n      </div>\n    </ng-template>\n  </ng-template>\n</c8y-modal>\n" }]
+        }], ctorParameters: () => [{ type: i4.BsModalRef }, { type: i1$2.C8yJSONSchema }, { type: ExtensibleDeviceRegistrationService }] });
 
 class ExtensibleDeviceRegistrationButtonComponent {
     constructor(deviceRegistrationService, modalService) {
@@ -1179,11 +1082,11 @@ class ExtensibleDeviceRegistrationButtonComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ExtensibleDeviceRegistrationButtonComponent, deps: [{ token: ExtensibleDeviceRegistrationService }, { token: i4.BsModalService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ExtensibleDeviceRegistrationButtonComponent, isStandalone: false, selector: "extensible-device-registration-provider", ngImport: i0, template: "<div *ngFor=\"let provider of providersMetaData | async\">\n  <button title=\"{{ provider.name | translate }}\" type=\"button\" (click)=\"click(provider)\">\n    <i c8yIcon=\"c8y-device-connect\"></i>\n    {{ provider.name | translate }}\n  </button>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i5$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: i1$1.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i5$1.AsyncPipe, name: "async" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ExtensibleDeviceRegistrationButtonComponent, isStandalone: true, selector: "extensible-device-registration-provider", ngImport: i0, template: "<div *ngFor=\"let provider of providersMetaData | async\">\n  <button title=\"{{ provider.name | translate }}\" type=\"button\" (click)=\"click(provider)\">\n    <i c8yIcon=\"c8y-device-connect\"></i>\n    {{ provider.name | translate }}\n  </button>\n</div>\n", dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ExtensibleDeviceRegistrationButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'extensible-device-registration-provider', standalone: false, template: "<div *ngFor=\"let provider of providersMetaData | async\">\n  <button title=\"{{ provider.name | translate }}\" type=\"button\" (click)=\"click(provider)\">\n    <i c8yIcon=\"c8y-device-connect\"></i>\n    {{ provider.name | translate }}\n  </button>\n</div>\n" }]
+            args: [{ selector: 'extensible-device-registration-provider', imports: [NgFor, IconDirective, C8yTranslatePipe, AsyncPipe], template: "<div *ngFor=\"let provider of providersMetaData | async\">\n  <button title=\"{{ provider.name | translate }}\" type=\"button\" (click)=\"click(provider)\">\n    <i c8yIcon=\"c8y-device-connect\"></i>\n    {{ provider.name | translate }}\n  </button>\n</div>\n" }]
         }], ctorParameters: () => [{ type: ExtensibleDeviceRegistrationService }, { type: i4.BsModalService }] });
 
 class BulkExtensibleDeviceRegistrationService extends BaseExtensibleDeviceRegistrationService {
@@ -1222,12 +1125,12 @@ class BulkExtensibleDeviceRegistrationService extends BaseExtensibleDeviceRegist
         body.append('file', newFile, newFile.name);
         return body;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: BulkExtensibleDeviceRegistrationService, deps: [{ token: i2.ApplicationService }, { token: i1$1.AppStateService }, { token: i2.FetchClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: BulkExtensibleDeviceRegistrationService, deps: [{ token: i1$1.ApplicationService }, { token: i1$2.AppStateService }, { token: i1$1.FetchClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: BulkExtensibleDeviceRegistrationService }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: BulkExtensibleDeviceRegistrationService, decorators: [{
             type: Injectable
-        }], ctorParameters: () => [{ type: i2.ApplicationService }, { type: i1$1.AppStateService }, { type: i2.FetchClient }] });
+        }], ctorParameters: () => [{ type: i1$1.ApplicationService }, { type: i1$2.AppStateService }, { type: i1$1.FetchClient }] });
 
 const extensibleDeviceRegistrationBulkSchema = {
     $schema: 'https://json-schema.org/draft/2019-09/schema',
@@ -1325,13 +1228,171 @@ class ExtensibleBulkDeviceRegistrationModalComponent {
     cancel() {
         this.bsModalRef.hide();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ExtensibleBulkDeviceRegistrationModalComponent, deps: [{ token: i1$1.C8yJSONSchema }, { token: BulkExtensibleDeviceRegistrationService }, { token: RegisterDeviceService }, { token: i4.BsModalRef }, { token: i1$1.GainsightService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ExtensibleBulkDeviceRegistrationModalComponent, isStandalone: false, selector: "extensible-device-registration-modal-component", viewQueries: [{ propertyName: "stepper", first: true, predicate: C8yStepper, descendants: true, static: true }], ngImport: i0, template: "<c8y-modal\n  [title]=\"title | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <i c8yIcon=\"c8y-device-connect\"></i>\n  </ng-container>\n  <c8y-stepper [hideStepProgress]=\"true\" linear class=\"p-t-16\" c8y-modal-body>\n    <ng-container *ngIf=\"!loadingError\">\n      <cdk-step>\n        <div class=\"sticky-top bg-component separator-bottom\">\n          <p\n            class=\"p-l-24 p-r-24 p-t-16 p-b-16 m-b-0 separator-bottom text-16 text-medium text-center bg-component\"\n            translate\n          >\n            Register devices in bulk\n          </p>\n          <c8y-form-group class=\"p-24 p-t-16 p-b-8 m-b-0\">\n            <formly-form [form]=\"form\" [fields]=\"template\" [model]=\"model\"></formly-form>\n          </c8y-form-group>\n        </div>\n        <div\n          *ngFor=\"let example of examples\"\n          class=\"bg-gray-white separator-bottom p-t-16 p-b-16 p-l-24 p-r-24\"\n        >\n          <p class=\"m-b-8 text-medium\">\n            {{ example.title | translate }}\n          </p>\n          <p class=\"small m-b-8\">{{ example.description | translate }}</p>\n          <a\n            title=\"{{ 'Download template' | translate }}\"\n            class=\"btn btn-default btn-sm\"\n            target=\"_self\"\n            [href]=\"example.url\"\n            download=\"{{ 'Example bulk registration - template.csv' | translate }}\"\n          >\n            <i c8yIcon=\"download\"></i>\n            <span translate>Download template</span>\n          </a>\n        </div>\n        <c8y-stepper-buttons\n          class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n          [showButtons]=\"{ cancel: true, next: true }\"\n          [disabled]=\"form.invalid\"\n          [pending]=\"pending\"\n          (onCancel)=\"cancel()\"\n          (onNext)=\"upload()\"\n          [labels]=\"{ next: 'Upload' }\"\n        ></c8y-stepper-buttons>\n      </cdk-step>\n    </ng-container>\n    <cdk-step state=\"final\">\n      <div class=\"p-24\">\n        <div *ngIf=\"success; else fail\">\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"success\"\n            class=\"lead\"\n            data-cy=\"success\"\n          ></c8y-operation-result>\n          <c8y-list-group class=\"separator-top m-t-16\">\n            <c8y-li>\n              <c8y-li-icon class=\"text-success\" [icon]=\"'check-circle'\"></c8y-li-icon>\n              <p translate>File successfully uploaded.</p>\n              <c8y-li-collapse>\n                <pre><code>{{ result | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n          </c8y-list-group>\n        </div>\n        <ng-template #fail>\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"error\"\n            class=\"lead\"\n            data-cy=\"error\"\n          ></c8y-operation-result>\n          <c8y-list-group *ngIf=\"result\" class=\"separator-top m-t-16\">\n            <c8y-li>\n              <c8y-li-icon class=\"text-danger\" [icon]=\"'ban'\"></c8y-li-icon>\n              <p translate>Bulk operation failed.</p>\n              <c8y-li-collapse>\n                <pre><code>{{ result | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n          </c8y-list-group>\n        </ng-template>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-component\"\n        [showButtons]=\"{ next: true }\"\n        (onNext)=\"complete()\"\n        [labels]=\"{ next: success ? 'Complete' : 'Cancel' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n  </c8y-stepper>\n</c8y-modal>\n", dependencies: [{ kind: "directive", type: i1$1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i1$1.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i5$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$1.OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "component", type: i1$1.ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "component", type: i1$1.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "component", type: i1$1.C8yStepper, selector: "c8y-stepper", inputs: ["disableDefaultIcons", "disableProgressButtons", "customClasses", "hideStepProgress", "useStepLabelsAsTitlesOnly"], outputs: ["onStepChange"] }, { kind: "component", type: i6.CdkStep, selector: "cdk-step", inputs: ["stepControl", "label", "errorMessage", "aria-label", "aria-labelledby", "state", "editable", "optional", "completed", "hasError"], outputs: ["interacted"], exportAs: ["cdkStep"] }, { kind: "component", type: i1$1.C8yStepperButtons, selector: "c8y-stepper-buttons", inputs: ["labels", "pending", "disabled", "showButtons"], outputs: ["onCancel", "onNext", "onBack", "onCustom"] }, { kind: "component", type: i1$1.ListGroupComponent, selector: "c8y-list-group" }, { kind: "component", type: i1$1.ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: i1$1.ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: i1$1.ListItemCollapseComponent, selector: "c8y-list-item-collapse, c8y-li-collapse", inputs: ["collapseWay"] }, { kind: "component", type: i7.FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "pipe", type: i1$1.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i5$1.JsonPipe, name: "json" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ExtensibleBulkDeviceRegistrationModalComponent, deps: [{ token: i1$2.C8yJSONSchema }, { token: BulkExtensibleDeviceRegistrationService }, { token: RegisterDeviceService }, { token: i4.BsModalRef }, { token: i1$2.GainsightService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ExtensibleBulkDeviceRegistrationModalComponent, isStandalone: true, selector: "extensible-device-registration-modal-component", viewQueries: [{ propertyName: "stepper", first: true, predicate: C8yStepper, descendants: true, static: true }], ngImport: i0, template: "<c8y-modal\n  [title]=\"title | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <i c8yIcon=\"c8y-device-connect\"></i>\n  </ng-container>\n  <c8y-stepper [hideStepProgress]=\"true\" linear class=\"p-t-16\" c8y-modal-body>\n    <ng-container *ngIf=\"!loadingError\">\n      <cdk-step>\n        <div class=\"sticky-top bg-component separator-bottom\">\n          <p\n            class=\"p-l-24 p-r-24 p-t-16 p-b-16 m-b-0 separator-bottom text-16 text-medium text-center bg-component\"\n            translate\n          >\n            Register devices in bulk\n          </p>\n          <c8y-form-group class=\"p-24 p-t-16 p-b-8 m-b-0\">\n            <formly-form [form]=\"form\" [fields]=\"template\" [model]=\"model\"></formly-form>\n          </c8y-form-group>\n        </div>\n        <div\n          *ngFor=\"let example of examples\"\n          class=\"bg-gray-white separator-bottom p-t-16 p-b-16 p-l-24 p-r-24\"\n        >\n          <p class=\"m-b-8 text-medium\">\n            {{ example.title | translate }}\n          </p>\n          <p class=\"small m-b-8\">{{ example.description | translate }}</p>\n          <a\n            title=\"{{ 'Download template' | translate }}\"\n            class=\"btn btn-default btn-sm\"\n            target=\"_self\"\n            [href]=\"example.url\"\n            download=\"{{ 'Example bulk registration - template.csv' | translate }}\"\n          >\n            <i c8yIcon=\"download\"></i>\n            <span translate>Download template</span>\n          </a>\n        </div>\n        <c8y-stepper-buttons\n          class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n          [showButtons]=\"{ cancel: true, next: true }\"\n          [disabled]=\"form.invalid\"\n          [pending]=\"pending\"\n          (onCancel)=\"cancel()\"\n          (onNext)=\"upload()\"\n          [labels]=\"{ next: 'Upload' }\"\n        ></c8y-stepper-buttons>\n      </cdk-step>\n    </ng-container>\n    <cdk-step state=\"final\">\n      <div class=\"p-24\">\n        <div *ngIf=\"success; else fail\">\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"success\"\n            class=\"lead\"\n            data-cy=\"success\"\n          ></c8y-operation-result>\n          <c8y-list-group class=\"separator-top m-t-16\">\n            <c8y-li>\n              <c8y-li-icon class=\"text-success\" [icon]=\"'check-circle'\"></c8y-li-icon>\n              <p translate>File successfully uploaded.</p>\n              <c8y-li-collapse>\n                <pre><code>{{ result | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n          </c8y-list-group>\n        </div>\n        <ng-template #fail>\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"error\"\n            class=\"lead\"\n            data-cy=\"error\"\n          ></c8y-operation-result>\n          <c8y-list-group *ngIf=\"result\" class=\"separator-top m-t-16\">\n            <c8y-li>\n              <c8y-li-icon class=\"text-danger\" [icon]=\"'ban'\"></c8y-li-icon>\n              <p translate>Bulk operation failed.</p>\n              <c8y-li-collapse>\n                <pre><code>{{ result | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n          </c8y-list-group>\n        </ng-template>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-component\"\n        [showButtons]=\"{ next: true }\"\n        (onNext)=\"complete()\"\n        [labels]=\"{ next: success ? 'Complete' : 'Cancel' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n  </c8y-stepper>\n</c8y-modal>\n", dependencies: [{ kind: "component", type: ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: C8yStepper, selector: "c8y-stepper", inputs: ["disableDefaultIcons", "disableProgressButtons", "customClasses", "hideStepProgress", "useStepLabelsAsTitlesOnly"], outputs: ["onStepChange"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: CdkStep, selector: "cdk-step", inputs: ["stepControl", "label", "errorMessage", "aria-label", "aria-labelledby", "state", "editable", "optional", "completed", "hasError"], outputs: ["interacted"], exportAs: ["cdkStep"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i5.FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: C8yStepperButtons, selector: "c8y-stepper-buttons", inputs: ["labels", "pending", "disabled", "showButtons"], outputs: ["onCancel", "onNext", "onBack", "onCustom"] }, { kind: "component", type: OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "component", type: ListGroupComponent, selector: "c8y-list-group" }, { kind: "component", type: ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: ListItemCollapseComponent, selector: "c8y-list-item-collapse, c8y-li-collapse", inputs: ["collapseWay"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: JsonPipe, name: "json" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ExtensibleBulkDeviceRegistrationModalComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'extensible-device-registration-modal-component', standalone: false, template: "<c8y-modal\n  [title]=\"title | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <i c8yIcon=\"c8y-device-connect\"></i>\n  </ng-container>\n  <c8y-stepper [hideStepProgress]=\"true\" linear class=\"p-t-16\" c8y-modal-body>\n    <ng-container *ngIf=\"!loadingError\">\n      <cdk-step>\n        <div class=\"sticky-top bg-component separator-bottom\">\n          <p\n            class=\"p-l-24 p-r-24 p-t-16 p-b-16 m-b-0 separator-bottom text-16 text-medium text-center bg-component\"\n            translate\n          >\n            Register devices in bulk\n          </p>\n          <c8y-form-group class=\"p-24 p-t-16 p-b-8 m-b-0\">\n            <formly-form [form]=\"form\" [fields]=\"template\" [model]=\"model\"></formly-form>\n          </c8y-form-group>\n        </div>\n        <div\n          *ngFor=\"let example of examples\"\n          class=\"bg-gray-white separator-bottom p-t-16 p-b-16 p-l-24 p-r-24\"\n        >\n          <p class=\"m-b-8 text-medium\">\n            {{ example.title | translate }}\n          </p>\n          <p class=\"small m-b-8\">{{ example.description | translate }}</p>\n          <a\n            title=\"{{ 'Download template' | translate }}\"\n            class=\"btn btn-default btn-sm\"\n            target=\"_self\"\n            [href]=\"example.url\"\n            download=\"{{ 'Example bulk registration - template.csv' | translate }}\"\n          >\n            <i c8yIcon=\"download\"></i>\n            <span translate>Download template</span>\n          </a>\n        </div>\n        <c8y-stepper-buttons\n          class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n          [showButtons]=\"{ cancel: true, next: true }\"\n          [disabled]=\"form.invalid\"\n          [pending]=\"pending\"\n          (onCancel)=\"cancel()\"\n          (onNext)=\"upload()\"\n          [labels]=\"{ next: 'Upload' }\"\n        ></c8y-stepper-buttons>\n      </cdk-step>\n    </ng-container>\n    <cdk-step state=\"final\">\n      <div class=\"p-24\">\n        <div *ngIf=\"success; else fail\">\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"success\"\n            class=\"lead\"\n            data-cy=\"success\"\n          ></c8y-operation-result>\n          <c8y-list-group class=\"separator-top m-t-16\">\n            <c8y-li>\n              <c8y-li-icon class=\"text-success\" [icon]=\"'check-circle'\"></c8y-li-icon>\n              <p translate>File successfully uploaded.</p>\n              <c8y-li-collapse>\n                <pre><code>{{ result | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n          </c8y-list-group>\n        </div>\n        <ng-template #fail>\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"error\"\n            class=\"lead\"\n            data-cy=\"error\"\n          ></c8y-operation-result>\n          <c8y-list-group *ngIf=\"result\" class=\"separator-top m-t-16\">\n            <c8y-li>\n              <c8y-li-icon class=\"text-danger\" [icon]=\"'ban'\"></c8y-li-icon>\n              <p translate>Bulk operation failed.</p>\n              <c8y-li-collapse>\n                <pre><code>{{ result | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n          </c8y-list-group>\n        </ng-template>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-component\"\n        [showButtons]=\"{ next: true }\"\n        (onNext)=\"complete()\"\n        [labels]=\"{ next: success ? 'Complete' : 'Cancel' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n  </c8y-stepper>\n</c8y-modal>\n" }]
-        }], ctorParameters: () => [{ type: i1$1.C8yJSONSchema }, { type: BulkExtensibleDeviceRegistrationService }, { type: RegisterDeviceService }, { type: i4.BsModalRef }, { type: i1$1.GainsightService }], propDecorators: { stepper: [{
+            args: [{ selector: 'extensible-device-registration-modal-component', imports: [
+                        ModalComponent,
+                        IconDirective,
+                        C8yStepper,
+                        NgIf,
+                        CdkStep,
+                        C8yTranslateDirective,
+                        FormGroupComponent,
+                        FormlyModule,
+                        NgFor,
+                        C8yStepperButtons,
+                        OperationResultComponent,
+                        ListGroupComponent,
+                        ListItemComponent,
+                        ListItemIconComponent,
+                        ListItemCollapseComponent,
+                        C8yTranslatePipe,
+                        JsonPipe
+                    ], template: "<c8y-modal\n  [title]=\"title | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <i c8yIcon=\"c8y-device-connect\"></i>\n  </ng-container>\n  <c8y-stepper [hideStepProgress]=\"true\" linear class=\"p-t-16\" c8y-modal-body>\n    <ng-container *ngIf=\"!loadingError\">\n      <cdk-step>\n        <div class=\"sticky-top bg-component separator-bottom\">\n          <p\n            class=\"p-l-24 p-r-24 p-t-16 p-b-16 m-b-0 separator-bottom text-16 text-medium text-center bg-component\"\n            translate\n          >\n            Register devices in bulk\n          </p>\n          <c8y-form-group class=\"p-24 p-t-16 p-b-8 m-b-0\">\n            <formly-form [form]=\"form\" [fields]=\"template\" [model]=\"model\"></formly-form>\n          </c8y-form-group>\n        </div>\n        <div\n          *ngFor=\"let example of examples\"\n          class=\"bg-gray-white separator-bottom p-t-16 p-b-16 p-l-24 p-r-24\"\n        >\n          <p class=\"m-b-8 text-medium\">\n            {{ example.title | translate }}\n          </p>\n          <p class=\"small m-b-8\">{{ example.description | translate }}</p>\n          <a\n            title=\"{{ 'Download template' | translate }}\"\n            class=\"btn btn-default btn-sm\"\n            target=\"_self\"\n            [href]=\"example.url\"\n            download=\"{{ 'Example bulk registration - template.csv' | translate }}\"\n          >\n            <i c8yIcon=\"download\"></i>\n            <span translate>Download template</span>\n          </a>\n        </div>\n        <c8y-stepper-buttons\n          class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n          [showButtons]=\"{ cancel: true, next: true }\"\n          [disabled]=\"form.invalid\"\n          [pending]=\"pending\"\n          (onCancel)=\"cancel()\"\n          (onNext)=\"upload()\"\n          [labels]=\"{ next: 'Upload' }\"\n        ></c8y-stepper-buttons>\n      </cdk-step>\n    </ng-container>\n    <cdk-step state=\"final\">\n      <div class=\"p-24\">\n        <div *ngIf=\"success; else fail\">\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"success\"\n            class=\"lead\"\n            data-cy=\"success\"\n          ></c8y-operation-result>\n          <c8y-list-group class=\"separator-top m-t-16\">\n            <c8y-li>\n              <c8y-li-icon class=\"text-success\" [icon]=\"'check-circle'\"></c8y-li-icon>\n              <p translate>File successfully uploaded.</p>\n              <c8y-li-collapse>\n                <pre><code>{{ result | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n          </c8y-list-group>\n        </div>\n        <ng-template #fail>\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"error\"\n            class=\"lead\"\n            data-cy=\"error\"\n          ></c8y-operation-result>\n          <c8y-list-group *ngIf=\"result\" class=\"separator-top m-t-16\">\n            <c8y-li>\n              <c8y-li-icon class=\"text-danger\" [icon]=\"'ban'\"></c8y-li-icon>\n              <p translate>Bulk operation failed.</p>\n              <c8y-li-collapse>\n                <pre><code>{{ result | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n          </c8y-list-group>\n        </ng-template>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-component\"\n        [showButtons]=\"{ next: true }\"\n        (onNext)=\"complete()\"\n        [labels]=\"{ next: success ? 'Complete' : 'Cancel' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n  </c8y-stepper>\n</c8y-modal>\n" }]
+        }], ctorParameters: () => [{ type: i1$2.C8yJSONSchema }, { type: BulkExtensibleDeviceRegistrationService }, { type: RegisterDeviceService }, { type: i4.BsModalRef }, { type: i1$2.GainsightService }], propDecorators: { stepper: [{
+                type: ViewChild,
+                args: [C8yStepper, { static: true }]
+            }] } });
+
+const registerDeviceBulkSchema = {
+    $schema: 'https://json-schema.org/draft/2019-09/schema',
+    type: 'object',
+    properties: {
+        csvBulkFile: {
+            type: 'array',
+            title: gettext('CSV file upload'),
+            description: gettext('You can use file upload component to let users send files. This input accepts only a single CSV file.'),
+            contentMediaType: 'csv'
+        }
+    },
+    required: ['csvBulkFile'],
+    additionalProperties: false
+};
+const simpleCsvHeaders = ['ID', 'PATH'];
+const csvHeaders = [
+    'ID',
+    'TYPE',
+    'NAME',
+    'ICCID',
+    'IDTYPE',
+    'PATH',
+    'SHELL',
+    'AUTH_TYPE'
+];
+const fullCsvHeaders = [...csvHeaders, 'CREDENTIALS'];
+const ESTCsvHeaders = [...csvHeaders, 'ENROLLMENT_OTP'];
+class BulkDeviceRegistrationModalComponent {
+    constructor(jsonschema, deviceRegistrationService, registerDeviceService, bsModalRef, gainsightService, featureCacheService, translateService) {
+        this.jsonschema = jsonschema;
+        this.deviceRegistrationService = deviceRegistrationService;
+        this.registerDeviceService = registerDeviceService;
+        this.bsModalRef = bsModalRef;
+        this.gainsightService = gainsightService;
+        this.featureCacheService = featureCacheService;
+        this.translateService = translateService;
+        this.form = new FormGroup({});
+        this.model = {};
+        this.certificateAuthorityFeatureEnabled = this.featureCacheService.getFeatureState('certificate-authority');
+    }
+    ngOnInit() {
+        this.template = [this.jsonschema.toFieldConfig(registerDeviceBulkSchema)];
+    }
+    upload() {
+        this.pending = true;
+        const file = this.getFile(this.model);
+        this.deviceRegistrationService
+            .create(file)
+            .then(({ res, data }) => {
+            if (res.status < 400) {
+                this.result = data;
+                this.success = data.numberOfFailed === 0 && data.numberOfSuccessful === data.numberOfAll;
+                this.message = this.success
+                    ? gettext('Device registration created.')
+                    : (this.message = gettext('Device registration failed.'));
+                if (this.success) {
+                    this.gainsightService.triggerEvent(PRODUCT_EXPERIENCE_BASE_REGISTRATION.EVENT, {
+                        result: PRODUCT_EXPERIENCE_BASE_REGISTRATION.RESULT.SUCCESS,
+                        component: PRODUCT_EXPERIENCE_BASE_REGISTRATION.COMPONENT.BULK
+                    });
+                }
+                else {
+                    this.gainsightService.triggerEvent(PRODUCT_EXPERIENCE_BASE_REGISTRATION.EVENT, {
+                        result: PRODUCT_EXPERIENCE_BASE_REGISTRATION.RESULT.FAILURE,
+                        component: PRODUCT_EXPERIENCE_BASE_REGISTRATION.COMPONENT.BULK
+                    });
+                }
+            }
+            else {
+                this.failedResult = data;
+                this.message = gettext('Device registration failed.');
+                this.gainsightService.triggerEvent(PRODUCT_EXPERIENCE_BASE_REGISTRATION.EVENT, {
+                    result: PRODUCT_EXPERIENCE_BASE_REGISTRATION.RESULT.FAILURE,
+                    component: PRODUCT_EXPERIENCE_BASE_REGISTRATION.COMPONENT.BULK
+                });
+            }
+            this.model = {};
+            this.pending = false;
+            this.stepper.next();
+        })
+            .catch(() => {
+            this.message = gettext('Error occurred while processing the uploaded file.');
+            this.pending = false;
+            this.stepper.next();
+        });
+    }
+    downloadSimple() {
+        return this.download(simpleCsvHeaders, gettext('Simple bulk registration - template.csv'));
+    }
+    downloadFull() {
+        return this.download(fullCsvHeaders, gettext('Full bulk registration - template.csv'));
+    }
+    downloadEst() {
+        return this.download(ESTCsvHeaders, gettext('EST registration - template.csv'));
+    }
+    download(headers, fileName) {
+        const headerRaw = headers.map(header => `"${header}"`).join(';');
+        const binaryFile = new Blob([headerRaw], { type: 'text/csv' });
+        saveAs(binaryFile, this.translateService.instant(fileName));
+    }
+    complete() {
+        this.registerDeviceService.list();
+        this.bsModalRef.hide();
+    }
+    cancel() {
+        this.bsModalRef.hide();
+    }
+    getFile(model) {
+        const csvBulkFile = model?.csvBulkFile;
+        return csvBulkFile ? csvBulkFile[0]?.file : undefined;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: BulkDeviceRegistrationModalComponent, deps: [{ token: i1$2.C8yJSONSchema }, { token: i1$1.DeviceRegistrationBulkService }, { token: RegisterDeviceService }, { token: i4.BsModalRef }, { token: i1$2.GainsightService }, { token: i1$2.FeatureCacheService }, { token: i3.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: BulkDeviceRegistrationModalComponent, isStandalone: true, selector: "bulk-device-registration", viewQueries: [{ propertyName: "stepper", first: true, predicate: C8yStepper, descendants: true, static: true }], ngImport: i0, template: "<c8y-modal\n  [title]=\"'Bulk device registration' | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <i c8yIcon=\"upload\"></i>\n  </ng-container>\n\n  <c8y-stepper [hideStepProgress]=\"true\" linear id=\"modal-body\">\n    <cdk-step>\n      <p class=\"modal-subtitle sticky-top\" translate>Register devices in bulk</p>\n\n      <c8y-form-group class=\"d-block p-24 p-t-16 p-b-0 m-b-0\">\n        <formly-form [form]=\"form\" [fields]=\"template\" [model]=\"model\"></formly-form>\n      </c8y-form-group>\n\n      <div class=\"p-24 m-t-0 bg-level-1\">\n          <div class=\"bg-gray-white separator-bottom p-t-16 p-b-16 p-l-24 p-r-24\">\n            <div>\n              <p class=\"m-b-8 text-medium\">\n                <strong translate>Simple registration</strong>\n              </p>\n              <small class=\"text-muted\" translate>\n                Creates all registration requests at once, then each one needs to go through regular\n                acceptance process.\n              </small>\n            </div>\n            <div class=\"m-b-16 m-t-16\">\n              <a\n                title=\"{{ 'Download template' | translate }}\"\n                class=\"btn btn-default btn-sm\"\n                target=\"_self\"\n                (click)=\"downloadSimple()\"\n              >\n                <i c8yIcon=\"download\" translate></i>\n                {{ 'Download template' | translate }}\n              </a>\n            </div>\n          </div>\n          <div class=\"bg-gray-white separator-bottom p-t-16 p-b-16 p-l-24 p-r-24\">\n            <div>\n              <p class=\"m-b-8 text-medium\">\n                <strong translate>Full registration</strong>\n              </p>\n              <small class=\"text-muted\" translate>\n                Creates all device credentials and devices using provided list of property values.\n                Devices can start communicating with the platform immediately.\n              </small>\n            </div>\n            <div class=\"m-b-16 m-t-16\">\n              <a\n                title=\"{{ 'Download template' | translate }}\"\n                class=\"btn btn-default btn-sm\"\n                target=\"_self\"\n                (click)=\"downloadFull()\"\n              >\n                <i c8yIcon=\"download\" translate></i>\n                {{ 'Download template' | translate }}\n              </a>\n            </div>\n          </div>\n          <div class=\"bg-gray-white separator-bottom p-t-16 p-b-16 p-l-24 p-r-24\" *ngIf=\"certificateAuthorityFeatureEnabled | async\">\n            <div>\n              <p class=\"m-b-8 text-medium\">\n                <strong translate>Full registration with device certificate creation</strong>\n              </p>\n              <small class=\"text-muted\" translate>\n                Creates device certificates and devices using the provided list of property values. Once the certificates are provisioned, the devices can immediately start communicating with the platform\n              </small>\n            </div>\n            <div class=\"m-b-16 m-t-16\">\n              <a\n                title=\"{{ 'Download template' | translate }}\"\n                class=\"btn btn-default btn-sm\"\n                target=\"_self\"\n                (click)=\"downloadEst()\"\n              >\n                <i c8yIcon=\"download\"></i>\n                {{ 'Download template' | translate }}\n              </a>\n            </div>\n          </div>\n      </div>\n\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        [showButtons]=\"{ cancel: true, next: true }\"\n        [disabled]=\"form.invalid\"\n        [pending]=\"pending\"\n        (onCancel)=\"cancel()\"\n        (onNext)=\"upload()\"\n        [labels]=\"{ next: 'Upload' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n\n    <cdk-step state=\"final\">\n      <div class=\"m-24\">\n        <div *ngIf=\"success; else warning\">\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"success\"\n            class=\"lead\"\n          ></c8y-operation-result>\n        </div>\n        <ng-template #warning>\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"error\"\n            class=\"lead\"\n          ></c8y-operation-result>\n        </ng-template>\n        <c8y-list-group class=\"separator-top m-t-16\">\n          <ng-container *ngIf=\"result; else failedResponse\">\n            <c8y-li *ngIf=\"success; else fail\">\n              <c8y-li-icon class=\"text-success\" icon=\"check-circle\"></c8y-li-icon>\n              <p>{{ 'All devices have been processed.' | translate }}</p>\n              <c8y-li-collapse>\n                <pre><code>{{ result | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n            <ng-template #fail>\n              <c8y-li>\n                <c8y-li-icon class=\"text-danger\" icon=\"ban\"></c8y-li-icon>\n                <p\n                  ngNonBindable\n                  [translateParams]=\"{ count: result?.numberOfFailed, total: result?.numberOfAll }\"\n                  translate\n                >\n                  Failed to process {{ count }} out of {{ total }}.\n                </p>\n                <c8y-li-collapse>\n                  <pre><code>{{ result | json }}</code></pre>\n                </c8y-li-collapse>\n              </c8y-li>\n            </ng-template>\n          </ng-container>\n          <ng-template #failedResponse>\n            <c8y-li>\n              <c8y-li-icon class=\"text-danger\" [icon]=\"'ban'\"></c8y-li-icon>\n              <small>{{ failedResult?.message | translate }}</small>\n              <c8y-li-collapse>\n                <pre><code>{{ failedResult | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n          </ng-template>\n        </c8y-list-group>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        [showButtons]=\"{ next: true }\"\n        (onNext)=\"complete()\"\n        [labels]=\"{ next: success ? 'Close' : 'Cancel' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n  </c8y-stepper>\n</c8y-modal>\n", dependencies: [{ kind: "component", type: ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: C8yStepper, selector: "c8y-stepper", inputs: ["disableDefaultIcons", "disableProgressButtons", "customClasses", "hideStepProgress", "useStepLabelsAsTitlesOnly"], outputs: ["onStepChange"] }, { kind: "component", type: CdkStep, selector: "cdk-step", inputs: ["stepControl", "label", "errorMessage", "aria-label", "aria-labelledby", "state", "editable", "optional", "completed", "hasError"], outputs: ["interacted"], exportAs: ["cdkStep"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i5.FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: C8yStepperButtons, selector: "c8y-stepper-buttons", inputs: ["labels", "pending", "disabled", "showButtons"], outputs: ["onCancel", "onNext", "onBack", "onCustom"] }, { kind: "component", type: OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "component", type: ListGroupComponent, selector: "c8y-list-group" }, { kind: "component", type: ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: ListItemCollapseComponent, selector: "c8y-list-item-collapse, c8y-li-collapse", inputs: ["collapseWay"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: JsonPipe, name: "json" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: BulkDeviceRegistrationModalComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'bulk-device-registration', imports: [
+                        ModalComponent,
+                        IconDirective,
+                        C8yStepper,
+                        CdkStep,
+                        C8yTranslateDirective,
+                        FormGroupComponent,
+                        FormlyModule,
+                        NgIf,
+                        C8yStepperButtons,
+                        OperationResultComponent,
+                        ListGroupComponent,
+                        ListItemComponent,
+                        ListItemIconComponent,
+                        ListItemCollapseComponent,
+                        C8yTranslatePipe,
+                        AsyncPipe,
+                        JsonPipe
+                    ], template: "<c8y-modal\n  [title]=\"'Bulk device registration' | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <i c8yIcon=\"upload\"></i>\n  </ng-container>\n\n  <c8y-stepper [hideStepProgress]=\"true\" linear id=\"modal-body\">\n    <cdk-step>\n      <p class=\"modal-subtitle sticky-top\" translate>Register devices in bulk</p>\n\n      <c8y-form-group class=\"d-block p-24 p-t-16 p-b-0 m-b-0\">\n        <formly-form [form]=\"form\" [fields]=\"template\" [model]=\"model\"></formly-form>\n      </c8y-form-group>\n\n      <div class=\"p-24 m-t-0 bg-level-1\">\n          <div class=\"bg-gray-white separator-bottom p-t-16 p-b-16 p-l-24 p-r-24\">\n            <div>\n              <p class=\"m-b-8 text-medium\">\n                <strong translate>Simple registration</strong>\n              </p>\n              <small class=\"text-muted\" translate>\n                Creates all registration requests at once, then each one needs to go through regular\n                acceptance process.\n              </small>\n            </div>\n            <div class=\"m-b-16 m-t-16\">\n              <a\n                title=\"{{ 'Download template' | translate }}\"\n                class=\"btn btn-default btn-sm\"\n                target=\"_self\"\n                (click)=\"downloadSimple()\"\n              >\n                <i c8yIcon=\"download\" translate></i>\n                {{ 'Download template' | translate }}\n              </a>\n            </div>\n          </div>\n          <div class=\"bg-gray-white separator-bottom p-t-16 p-b-16 p-l-24 p-r-24\">\n            <div>\n              <p class=\"m-b-8 text-medium\">\n                <strong translate>Full registration</strong>\n              </p>\n              <small class=\"text-muted\" translate>\n                Creates all device credentials and devices using provided list of property values.\n                Devices can start communicating with the platform immediately.\n              </small>\n            </div>\n            <div class=\"m-b-16 m-t-16\">\n              <a\n                title=\"{{ 'Download template' | translate }}\"\n                class=\"btn btn-default btn-sm\"\n                target=\"_self\"\n                (click)=\"downloadFull()\"\n              >\n                <i c8yIcon=\"download\" translate></i>\n                {{ 'Download template' | translate }}\n              </a>\n            </div>\n          </div>\n          <div class=\"bg-gray-white separator-bottom p-t-16 p-b-16 p-l-24 p-r-24\" *ngIf=\"certificateAuthorityFeatureEnabled | async\">\n            <div>\n              <p class=\"m-b-8 text-medium\">\n                <strong translate>Full registration with device certificate creation</strong>\n              </p>\n              <small class=\"text-muted\" translate>\n                Creates device certificates and devices using the provided list of property values. Once the certificates are provisioned, the devices can immediately start communicating with the platform\n              </small>\n            </div>\n            <div class=\"m-b-16 m-t-16\">\n              <a\n                title=\"{{ 'Download template' | translate }}\"\n                class=\"btn btn-default btn-sm\"\n                target=\"_self\"\n                (click)=\"downloadEst()\"\n              >\n                <i c8yIcon=\"download\"></i>\n                {{ 'Download template' | translate }}\n              </a>\n            </div>\n          </div>\n      </div>\n\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        [showButtons]=\"{ cancel: true, next: true }\"\n        [disabled]=\"form.invalid\"\n        [pending]=\"pending\"\n        (onCancel)=\"cancel()\"\n        (onNext)=\"upload()\"\n        [labels]=\"{ next: 'Upload' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n\n    <cdk-step state=\"final\">\n      <div class=\"m-24\">\n        <div *ngIf=\"success; else warning\">\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"success\"\n            class=\"lead\"\n          ></c8y-operation-result>\n        </div>\n        <ng-template #warning>\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"error\"\n            class=\"lead\"\n          ></c8y-operation-result>\n        </ng-template>\n        <c8y-list-group class=\"separator-top m-t-16\">\n          <ng-container *ngIf=\"result; else failedResponse\">\n            <c8y-li *ngIf=\"success; else fail\">\n              <c8y-li-icon class=\"text-success\" icon=\"check-circle\"></c8y-li-icon>\n              <p>{{ 'All devices have been processed.' | translate }}</p>\n              <c8y-li-collapse>\n                <pre><code>{{ result | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n            <ng-template #fail>\n              <c8y-li>\n                <c8y-li-icon class=\"text-danger\" icon=\"ban\"></c8y-li-icon>\n                <p\n                  ngNonBindable\n                  [translateParams]=\"{ count: result?.numberOfFailed, total: result?.numberOfAll }\"\n                  translate\n                >\n                  Failed to process {{ count }} out of {{ total }}.\n                </p>\n                <c8y-li-collapse>\n                  <pre><code>{{ result | json }}</code></pre>\n                </c8y-li-collapse>\n              </c8y-li>\n            </ng-template>\n          </ng-container>\n          <ng-template #failedResponse>\n            <c8y-li>\n              <c8y-li-icon class=\"text-danger\" [icon]=\"'ban'\"></c8y-li-icon>\n              <small>{{ failedResult?.message | translate }}</small>\n              <c8y-li-collapse>\n                <pre><code>{{ failedResult | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n          </ng-template>\n        </c8y-list-group>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        [showButtons]=\"{ next: true }\"\n        (onNext)=\"complete()\"\n        [labels]=\"{ next: success ? 'Close' : 'Cancel' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n  </c8y-stepper>\n</c8y-modal>\n" }]
+        }], ctorParameters: () => [{ type: i1$2.C8yJSONSchema }, { type: i1$1.DeviceRegistrationBulkService }, { type: RegisterDeviceService }, { type: i4.BsModalRef }, { type: i1$2.GainsightService }, { type: i1$2.FeatureCacheService }, { type: i3.TranslateService }], propDecorators: { stepper: [{
                 type: ViewChild,
                 args: [C8yStepper, { static: true }]
             }] } });
@@ -1355,11 +1416,11 @@ class ExtensibleBulkDeviceRegistrationButtonComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ExtensibleBulkDeviceRegistrationButtonComponent, deps: [{ token: BulkExtensibleDeviceRegistrationService }, { token: i4.BsModalService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ExtensibleBulkDeviceRegistrationButtonComponent, isStandalone: false, selector: "extensible-device-registration-component", ngImport: i0, template: "<div *ngFor=\"let provider of bulkProvidersMetaData | async\">\n  <button\n    title=\"{{ provider.name | translate }}\"\n    type=\"button\"\n    (click)=\"click(provider.contextPath)\"\n  >\n    <i c8yIcon=\"upload\"></i>\n    {{ provider.name | translate }}\n  </button>\n</div>\n", dependencies: [{ kind: "directive", type: i1$1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i5$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: i1$1.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i5$1.AsyncPipe, name: "async" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ExtensibleBulkDeviceRegistrationButtonComponent, isStandalone: true, selector: "extensible-device-registration-component", ngImport: i0, template: "<div *ngFor=\"let provider of bulkProvidersMetaData | async\">\n  <button\n    title=\"{{ provider.name | translate }}\"\n    type=\"button\"\n    (click)=\"click(provider.contextPath)\"\n  >\n    <i c8yIcon=\"upload\"></i>\n    {{ provider.name | translate }}\n  </button>\n</div>\n", dependencies: [{ kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ExtensibleBulkDeviceRegistrationButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'extensible-device-registration-component', standalone: false, template: "<div *ngFor=\"let provider of bulkProvidersMetaData | async\">\n  <button\n    title=\"{{ provider.name | translate }}\"\n    type=\"button\"\n    (click)=\"click(provider.contextPath)\"\n  >\n    <i c8yIcon=\"upload\"></i>\n    {{ provider.name | translate }}\n  </button>\n</div>\n" }]
+            args: [{ selector: 'extensible-device-registration-component', imports: [NgFor, IconDirective, C8yTranslatePipe, AsyncPipe], template: "<div *ngFor=\"let provider of bulkProvidersMetaData | async\">\n  <button\n    title=\"{{ provider.name | translate }}\"\n    type=\"button\"\n    (click)=\"click(provider.contextPath)\"\n  >\n    <i c8yIcon=\"upload\"></i>\n    {{ provider.name | translate }}\n  </button>\n</div>\n" }]
         }], ctorParameters: () => [{ type: BulkExtensibleDeviceRegistrationService }, { type: i4.BsModalService }] });
 
 class BulkDeviceRegistrationButtonComponent {
@@ -1375,11 +1436,11 @@ class BulkDeviceRegistrationButtonComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: BulkDeviceRegistrationButtonComponent, deps: [{ token: i4.BsModalService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: BulkDeviceRegistrationButtonComponent, isStandalone: false, selector: "extensible-device-registration-component", ngImport: i0, template: "<button title=\"{{ 'General' | translate }}\" type=\"button\" (click)=\"click()\">\n  <i c8yIcon=\"upload\"></i>\n  {{ 'General' | translate }}\n</button>\n", dependencies: [{ kind: "directive", type: i1$1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "pipe", type: i1$1.C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: BulkDeviceRegistrationButtonComponent, isStandalone: true, selector: "extensible-device-registration-component", ngImport: i0, template: "<button title=\"{{ 'General' | translate }}\" type=\"button\" (click)=\"click()\">\n  <i c8yIcon=\"upload\"></i>\n  {{ 'General' | translate }}\n</button>\n", dependencies: [{ 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: BulkDeviceRegistrationButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'extensible-device-registration-component', standalone: false, template: "<button title=\"{{ 'General' | translate }}\" type=\"button\" (click)=\"click()\">\n  <i c8yIcon=\"upload\"></i>\n  {{ 'General' | translate }}\n</button>\n" }]
+            args: [{ selector: 'extensible-device-registration-component', imports: [IconDirective, C8yTranslatePipe], template: "<button title=\"{{ 'General' | translate }}\" type=\"button\" (click)=\"click()\">\n  <i c8yIcon=\"upload\"></i>\n  {{ 'General' | translate }}\n</button>\n" }]
         }], ctorParameters: () => [{ type: i4.BsModalService }] });
 
 class DeviceRegistrationFactory {
@@ -1422,7 +1483,12 @@ const deviceRegistrationRoutes = [
 ];
 class RegisterDeviceModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: RegisterDeviceModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: RegisterDeviceModule, declarations: [DeviceRegistrationViewComponent,
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: RegisterDeviceModule, imports: [BsDropdownModule,
+            PopoverModule,
+            CommonModule,
+            CoreModule,
+            StepperModule,
+            DynamicFormsModule, i1.RouterModule, DeviceRegistrationViewComponent,
             GeneralDeviceRegistrationComponent,
             GeneralDeviceRegistrationButtonComponent,
             BulkDeviceRegistrationModalComponent,
@@ -1432,12 +1498,7 @@ class RegisterDeviceModule {
             ExtensibleDeviceRegistrationStepperComponent,
             ExtensibleBulkDeviceRegistrationModalComponent,
             ExtensibleBulkDeviceRegistrationButtonComponent,
-            RegisterDeviceDropdownComponent], imports: [BsDropdownModule,
-            PopoverModule,
-            CommonModule,
-            CoreModule,
-            StepperModule,
-            DynamicFormsModule, i1.RouterModule] }); }
+            RegisterDeviceDropdownComponent] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: RegisterDeviceModule, providers: [
             hookDeviceRegistration(DeviceRegistrationFactory),
             hookNavigator(RegisterDeviceNavigationFactory),
@@ -1450,7 +1511,13 @@ class RegisterDeviceModule {
             CoreModule,
             StepperModule,
             DynamicFormsModule,
-            RouterModule.forChild(deviceRegistrationRoutes)] }); }
+            RouterModule.forChild(deviceRegistrationRoutes),
+            DeviceRegistrationViewComponent,
+            GeneralDeviceRegistrationComponent,
+            BulkDeviceRegistrationModalComponent,
+            ExtensibleDeviceRegistrationModalComponent,
+            ExtensibleDeviceRegistrationStepperComponent,
+            ExtensibleBulkDeviceRegistrationModalComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: RegisterDeviceModule, decorators: [{
             type: NgModule,
@@ -1462,9 +1529,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
                         CoreModule,
                         StepperModule,
                         DynamicFormsModule,
-                        RouterModule.forChild(deviceRegistrationRoutes)
-                    ],
-                    declarations: [
+                        RouterModule.forChild(deviceRegistrationRoutes),
                         DeviceRegistrationViewComponent,
                         GeneralDeviceRegistrationComponent,
                         GeneralDeviceRegistrationButtonComponent,