@c8y/ngx-components 1024.20.1 → 1024.21.3

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

@@ -616,7 +616,7 @@ class DeviceProfileComponent {
                 provide: PRODUCT_EXPERIENCE_EVENT_SOURCE,
                 useExisting: forwardRef(() => DeviceProfileComponent)
             }
-        ], ngImport: i0, template: "<c8y-title>{{ profileName }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    icon=\"c8y-management\"\n    label=\"{{ 'Management' | translate }}\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-device-profile'\"\n    [label]=\"'Device profiles' | translate\"\n    [path]=\"'device-profiles'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    icon=\"c8y-device-profile\"\n    label=\"{{ profileName }}\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n@if (deviceProfile) {\n  <div class=\"row\">\n    <div class=\"col-lg-12 col-lg-max\">\n      <div class=\"card card--fullpage\">\n        <div class=\"card-block bg-level-1 flex-no-shrink p-t-24 p-b-24 overflow-visible\">\n          <div class=\"content-flex-70\">\n            <div class=\"text-center\">\n              <i class=\"c8y-icon-duocolor icon-48 c8y-icon c8y-icon-device-profile\"></i>\n              <p>\n                <small class=\"label label-info\">{{ 'Device profile' | translate }}</small>\n              </p>\n            </div>\n            <div class=\"flex-grow col-10\">\n              <div class=\"row\">\n                <div class=\"col-md-4\">\n                  <c8y-form-group>\n                    <label\n                      class=\"control-label\"\n                      translate\n                    >\n                      Name\n                    </label>\n                    <c8y-input-group-editable\n                      required\n                      formGroupClass=\"m-b-0\"\n                      [ariaLabel]=\"'Device profile name' | translate\"\n                      [placeholder]=\"'e.g. My device profile' | translate\"\n                      data-cy=\"device-profile--add-device-profile-name\"\n                      [ngModel]=\"deviceProfile.name\"\n                      (ngModelChange)=\"onNameSaved($event)\"\n                    ></c8y-input-group-editable>\n                  </c8y-form-group>\n                </div>\n                <div class=\"col-md-4\">\n                  <c8y-form-group>\n                    <label class=\"control-label\">\n                      {{ 'Device type' | translate }}\n                      <button\n                        class=\"btn-help\"\n                        [attr.aria-label]=\"'Help' | translate\"\n                        [popover]=\"\n                          (DEVICE_TYPE_POPOVER | translate) +\n                          (isDeviceProfileEmpty\n                            ? ' ' + (DEVICE_TYPE_DISABLED_POPOVER | translate)\n                            : '')\n                        \"\n                        placement=\"right\"\n                        triggers=\"focus\"\n                        container=\"body\"\n                        type=\"button\"\n                      ></button>\n                    </label>\n                    <c8y-input-group-editable\n                      formGroupClass=\"m-b-0\"\n                      [ariaLabel]=\"'Device type' | translate\"\n                      [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'c8y_Linux' }\"\n                      data-cy=\"device-profile--device-type\"\n                      [ngModel]=\"deviceProfile.c8y_Filter.type\"\n                      [disabled]=\"isDeviceProfileEmpty\"\n                      (ngModelChange)=\"onDeviceTypeSaved($event)\"\n                    ></c8y-input-group-editable>\n                  </c8y-form-group>\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n        <div class=\"inner-scroll\">\n          <div class=\"card-header separator-top-bottom bg-content sticky-top\">\n            <div class=\"card-icon\">\n              <i\n                class=\"c8y-icon-duocolor\"\n                [c8yIcon]=\"'c8y-firmware'\"\n              ></i>\n            </div>\n            <div\n              class=\"card-title\"\n              translate\n            >\n              Firmware\n            </div>\n          </div>\n          @if (deviceProfile.c8y_DeviceProfile.firmware) {\n            <div class=\"card-block p-t-0\">\n              <c8y-list-group>\n                <c8y-li>\n                  <c8y-li-icon>\n                    <i [c8yIcon]=\"'c8y-firmware'\"></i>\n                  </c8y-li-icon>\n                  <c8y-li-body class=\"content-flex-50 m-l-4\">\n                    <div class=\"col-4\">\n                      <span\n                        class=\"text-truncate\"\n                        title=\"{{ deviceProfile.c8y_DeviceProfile.firmware.name }}\"\n                      >\n                        <span\n                          class=\"text-label-small m-r-8\"\n                          translate\n                        >\n                          Name\n                        </span>\n                        {{ deviceProfile.c8y_DeviceProfile.firmware.name }}\n                      </span>\n                    </div>\n                    <div class=\"col-4\"></div>\n                    <div class=\"col-3 d-flex a-i-center\">\n                      <span\n                        class=\"text-truncate\"\n                        title=\"{{ deviceProfile.c8y_DeviceProfile.firmware.version }}\"\n                      >\n                        <span\n                          class=\"text-label-small m-r-4\"\n                          translate\n                        >\n                          Version\n                        </span>\n                        {{ deviceProfile.c8y_DeviceProfile.firmware.version }}\n                      </span>\n                      <button\n                        class=\"btn btn-danger btn-xs visible-xs m-l-auto m-r-8 m-t-8\"\n                        title=\"{{ 'Remove`firmware`' | translate }}\"\n                        type=\"button\"\n                        (click)=\"removeFirmware()\"\n                        c8yProductExperience\n                        inherit\n                        [actionData]=\"{\n                          action: PRODUCT_EXPERIENCE.ACTIONS.REMOVE,\n                          fragment: PRODUCT_EXPERIENCE.FRAGMENTS.FIRMWARE\n                        }\"\n                      >\n                        <i c8yIcon=\"minus-circle\"></i>\n                        {{ 'Remove`firmware`' | translate }}\n                      </button>\n                    </div>\n                    <div class=\"m-l-auto p-r-8 hidden-xs\">\n                      <button\n                        class=\"btn btn-dot showOnHover text-danger\"\n                        [attr.aria-label]=\"'Remove`firmware`' | translate\"\n                        tooltip=\"{{ 'Remove`firmware`' | translate }}\"\n                        placement=\"right\"\n                        type=\"button\"\n                        [delay]=\"500\"\n                        (click)=\"removeFirmware()\"\n                        c8yProductExperience\n                        inherit\n                        [actionData]=\"{\n                          action: PRODUCT_EXPERIENCE.ACTIONS.REMOVE,\n                          fragment: PRODUCT_EXPERIENCE.FRAGMENTS.FIRMWARE\n                        }\"\n                      >\n                        <i c8yIcon=\"minus-circle\"></i>\n                      </button>\n                    </div>\n                  </c8y-li-body>\n                </c8y-li>\n              </c8y-list-group>\n            </div>\n          } @else {\n            <div class=\"card-block p-t-16\">\n              <c8y-ui-empty-state\n                class=\"p-t-16 d-block\"\n                icon=\"c8y-firmware\"\n                [title]=\"'No firmware defined.' | translate\"\n                [horizontal]=\"true\"\n              ></c8y-ui-empty-state>\n            </div>\n            <div class=\"card-footer p-t-0\">\n              <button\n                class=\"btn btn-default\"\n                title=\"{{ 'Add firmware' | translate }}\"\n                type=\"button\"\n                data-cy=\"device-profile--Add-firmware-button\"\n                (click)=\"addFirmware()\"\n                c8yProductExperience\n                inherit\n                [actionData]=\"{\n                  action: PRODUCT_EXPERIENCE.ACTIONS.ADD,\n                  fragment: PRODUCT_EXPERIENCE.FRAGMENTS.FIRMWARE\n                }\"\n              >\n                <i c8yIcon=\"plus-circle\"></i>\n                {{ 'Add firmware' | translate }}\n              </button>\n            </div>\n          }\n\n          <div class=\"card-header separator-top-bottom sticky-top bg-component\">\n            <div class=\"card-icon\">\n              <i\n                class=\"c8y-icon-duocolor\"\n                [c8yIcon]=\"'c8y-tools'\"\n              ></i>\n            </div>\n            <div\n              class=\"card-title\"\n              translate\n            >\n              Software\n            </div>\n          </div>\n          @if (deviceProfile.c8y_DeviceProfile.software?.length > 0) {\n            <div class=\"card-block p-t-0\">\n              <c8y-list-group>\n                @for (software of deviceProfile.c8y_DeviceProfile.software; track software) {\n                  <c8y-li>\n                    <c8y-li-icon>\n                      <i [c8yIcon]=\"'c8y-tools'\"></i>\n                    </c8y-li-icon>\n                    <c8y-li-body class=\"content-flex-50 m-l-4\">\n                      <div class=\"col-4\">\n                        <span\n                          class=\"text-truncate-wrap\"\n                          title=\"{{ software.name }}\"\n                        >\n                          <span\n                            class=\"text-label-small m-r-8\"\n                            translate\n                          >\n                            Name\n                          </span>\n                          {{ software.name }}\n                        </span>\n                      </div>\n                      <div class=\"col-4\">\n                        <span\n                          class=\"text-truncate-wrap\"\n                          title=\"{{ software.name }}\"\n                        >\n                          <span\n                            class=\"text-label-small m-r-8\"\n                            translate\n                          >\n                            Type\n                          </span>\n                          @if (!!software.softwareType) {\n                            <span class=\"label label-info m-l-4\">\n                              {{ software.softwareType }}\n                            </span>\n                          }\n                        </span>\n                      </div>\n                      <div class=\"col-3 d-flex a-i-center\">\n                        <span\n                          class=\"text-truncate-wrap\"\n                          title=\"{{ software.version }}\"\n                        >\n                          <span\n                            class=\"text-label-small m-r-8\"\n                            translate\n                          >\n                            Version\n                          </span>\n                          {{ software.version }}\n                        </span>\n                        <button\n                          class=\"btn btn-danger btn-xs visible-xs m-l-auto m-r-8 m-t-8\"\n                          title=\"{{ 'Remove`software`' | translate }}\"\n                          type=\"button\"\n                          ((click)=\"removeItem(software, 'software')\"\n                          c8yProductExperience\n                          inherit\n                          [actionData]=\"{\n                            action: PRODUCT_EXPERIENCE.ACTIONS.REMOVE,\n                            fragment: PRODUCT_EXPERIENCE.FRAGMENTS.SOFTWARE\n                          }\"\n                        >\n                          <i c8yIcon=\"minus-circle\"></i>\n                          {{ 'Remove`software`' | translate }}\n                        </button>\n                      </div>\n                      <div class=\"m-l-auto p-r-8 hidden-xs\">\n                        <button\n                          class=\"btn btn-dot showOnHover text-danger\"\n                          [attr.aria-label]=\"'Remove`software`' | translate\"\n                          tooltip=\"{{ 'Remove`software`' | translate }}\"\n                          placement=\"right\"\n                          type=\"button\"\n                          [delay]=\"500\"\n                          (click)=\"removeItem(software, 'software')\"\n                          c8yProductExperience\n                          inherit\n                          [actionData]=\"{\n                            action: PRODUCT_EXPERIENCE.ACTIONS.REMOVE,\n                            fragment: PRODUCT_EXPERIENCE.FRAGMENTS.SOFTWARE\n                          }\"\n                        >\n                          <i\n                            c8yIcon=\"minus-circle\"\n                            data-cy=\"device-profile--Remove-icon\"\n                          ></i>\n                        </button>\n                      </div>\n                    </c8y-li-body>\n                  </c8y-li>\n                }\n              </c8y-list-group>\n            </div>\n          }\n          @if (deviceProfile.c8y_DeviceProfile.software?.length === 0) {\n            <div class=\"card-block p-t-16\">\n              <c8y-ui-empty-state\n                icon=\"c8y-tools\"\n                [title]=\"'No software defined.' | translate\"\n                [horizontal]=\"true\"\n              ></c8y-ui-empty-state>\n            </div>\n          }\n          <div class=\"card-footer p-t-0\">\n            <button\n              class=\"btn btn-default m-b-0\"\n              title=\"{{ 'Add software' | translate }}\"\n              type=\"button\"\n              data-cy=\"device-profile--Add-software-button\"\n              (click)=\"addSoftware()\"\n              c8yProductExperience\n              inherit\n              [actionData]=\"{\n                action: PRODUCT_EXPERIENCE.ACTIONS.ADD,\n                fragment: PRODUCT_EXPERIENCE.FRAGMENTS.SOFTWARE\n              }\"\n            >\n              <i c8yIcon=\"plus-circle\"></i>\n              {{ 'Add software' | translate }}\n            </button>\n          </div>\n\n          <div class=\"card-header separator-top-bottom bg-component sticky-top\">\n            <div class=\"card-icon\">\n              <i\n                class=\"c8y-icon-duocolor\"\n                [c8yIcon]=\"'gears'\"\n              ></i>\n            </div>\n            <div\n              class=\"card-title\"\n              translate\n            >\n              Configuration\n            </div>\n          </div>\n          @if (deviceProfile.c8y_DeviceProfile.configuration?.length > 0) {\n            <div class=\"card-block p-t-0\">\n              <c8y-list-group>\n                @for (\n                  configuration of deviceProfile.c8y_DeviceProfile.configuration;\n                  track configuration\n                ) {\n                  <c8y-li>\n                    <c8y-li-icon>\n                      <i [c8yIcon]=\"'gears'\"></i>\n                    </c8y-li-icon>\n                    <c8y-li-body class=\"content-flex-50\">\n                      <div class=\"col-4\">\n                        <span\n                          class=\"text-truncate\"\n                          title=\"{{ configuration.name }}\"\n                        >\n                          <span\n                            class=\"text-label-small m-r-8\"\n                            translate\n                          >\n                            Name\n                          </span>\n                          {{ configuration.name }}\n                        </span>\n                      </div>\n                      <div class=\"col-4\">\n                        <span\n                          class=\"text-label-small m-r-8\"\n                          translate\n                        >\n                          Type\n                        </span>\n                        <span class=\"label label-info\">{{ configuration.type }}</span>\n                        <button\n                          class=\"btn btn-danger btn-xs visible-xs m-l-auto m-r-8 m-t-8\"\n                          title=\"{{ 'Remove`configuration`' | translate }}\"\n                          type=\"button\"\n                          (click)=\"removeItem(configuration, 'configuration')\"\n                          c8yProductExperience\n                          inherit\n                          [actionData]=\"{\n                            action: PRODUCT_EXPERIENCE.ACTIONS.REMOVE,\n                            fragment: PRODUCT_EXPERIENCE.FRAGMENTS.CONFGIURATION\n                          }\"\n                        >\n                          <i c8yIcon=\"minus-circle\"></i>\n                          {{ 'Remove`configuration`' | translate }}\n                        </button>\n                      </div>\n                      <div class=\"col-3 d-flex a-i-center\"></div>\n                      <div class=\"m-l-auto p-r-8 hidden-xs\">\n                        <button\n                          class=\"btn btn-dot showOnHover text-danger\"\n                          [attr.aria-label]=\"'Remove`configuration`' | translate\"\n                          tooltip=\"{{ 'Remove`configuration`' | translate }}\"\n                          placement=\"top\"\n                          type=\"button\"\n                          (click)=\"removeItem(configuration, 'configuration')\"\n                          [delay]=\"500\"\n                          c8yProductExperience\n                          inherit\n                          [actionData]=\"{\n                            action: PRODUCT_EXPERIENCE.ACTIONS.REMOVE,\n                            fragment: PRODUCT_EXPERIENCE.FRAGMENTS.CONFGIURATION\n                          }\"\n                        >\n                          <i\n                            c8yIcon=\"minus-circle\"\n                            data-cy=\"device-profile--Remove-icon\"\n                          ></i>\n                        </button>\n                      </div>\n                    </c8y-li-body>\n                  </c8y-li>\n                }\n              </c8y-list-group>\n            </div>\n          }\n          @if (deviceProfile.c8y_DeviceProfile.configuration?.length === 0) {\n            <div class=\"card-block p-t-16\">\n              <c8y-ui-empty-state\n                icon=\"gears\"\n                [title]=\"'No configuration defined.' | translate\"\n                [horizontal]=\"true\"\n              ></c8y-ui-empty-state>\n            </div>\n          }\n          <div class=\"card-footer p-t-0\">\n            <div class=\"p-t-8\">\n              <button\n                class=\"btn btn-default m-b-0\"\n                title=\"{{ 'Add configuration' | translate }}\"\n                type=\"button\"\n                data-cy=\"device-profile--Add-configuration-button\"\n                (click)=\"addConfiguration()\"\n                c8yProductExperience\n                inherit\n                [actionData]=\"{\n                  action: PRODUCT_EXPERIENCE.ACTIONS.ADD,\n                  fragment: PRODUCT_EXPERIENCE.FRAGMENTS.CONFGIURATION\n                }\"\n              >\n                <i c8yIcon=\"plus-circle\"></i>\n                {{ 'Add configuration' | translate }}\n              </button>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n}\n", dependencies: [{ kind: "component", type: TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "component", type: BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: ProductExperienceDirective, selector: "[c8yProductExperience]", inputs: ["actionName", "actionData", "inherit", "suppressDataOverriding"] }, { 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: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: ListGroupComponent, selector: "c8y-list-group" }, { kind: "component", type: ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: ListItemBodyComponent, selector: "c8y-list-item-body, c8y-li-body", inputs: ["body"] }, { kind: "directive", type: TooltipDirective, selector: "[tooltip], [tooltipHtml]", inputs: ["adaptivePosition", "tooltip", "placement", "triggers", "container", "containerClass", "boundariesElement", "isOpen", "isDisabled", "delay", "tooltipHtml", "tooltipPlacement", "tooltipIsOpen", "tooltipEnable", "tooltipAppendToBody", "tooltipAnimation", "tooltipClass", "tooltipContext", "tooltipPopupDelay", "tooltipFadeDuration", "tooltipTrigger"], outputs: ["tooltipChange", "onShown", "onHidden", "tooltipStateChanged"], exportAs: ["bs-tooltip"] }, { kind: "component", type: InputGroupEditableComponent, selector: "c8y-input-group-editable", inputs: ["ariaLabel", "name", "size", "placeholder", "title", "multiline", "maxHeight", "maxLength", "noSaveButton", "formGroupClass", "validators", "asyncValidators", "autocomplete", "required"], outputs: ["save", "cancel"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
+        ], ngImport: i0, template: "<c8y-title>{{ profileName }}</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    icon=\"c8y-management\"\n    label=\"{{ 'Management' | translate }}\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-device-profile'\"\n    [label]=\"'Device profiles' | translate\"\n    [path]=\"'device-profiles'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    icon=\"c8y-device-profile\"\n    label=\"{{ profileName }}\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n@if (deviceProfile) {\n  <div class=\"row\">\n    <div class=\"col-lg-12 col-lg-max\">\n      <div class=\"card card--fullpage\">\n        <div class=\"card-block bg-level-1 flex-no-shrink p-t-24 p-b-24 overflow-visible\">\n          <div class=\"content-flex-70\">\n            <div class=\"text-center\">\n              <i class=\"c8y-icon-duocolor icon-48 c8y-icon c8y-icon-device-profile\"></i>\n              <p>\n                <small class=\"label label-info\">{{ 'Device profile' | translate }}</small>\n              </p>\n            </div>\n            <div class=\"flex-grow col-10\">\n              <div class=\"row\">\n                <div class=\"col-md-4\">\n                  <c8y-form-group>\n                    <label\n                      class=\"control-label\"\n                      translate\n                    >\n                      Name\n                    </label>\n                    <c8y-input-group-editable\n                      required\n                      formGroupClass=\"m-b-0\"\n                      [ariaLabel]=\"'Device profile name' | translate\"\n                      [placeholder]=\"'e.g. My device profile' | translate\"\n                      data-cy=\"device-profile--add-device-profile-name\"\n                      [ngModel]=\"deviceProfile.name\"\n                      (ngModelChange)=\"onNameSaved($event)\"\n                    ></c8y-input-group-editable>\n                  </c8y-form-group>\n                </div>\n                <div class=\"col-md-4\">\n                  <c8y-form-group>\n                    <label class=\"control-label\">\n                      {{ 'Device type' | translate }}\n                      <button\n                        class=\"btn-help\"\n                        [attr.aria-label]=\"'Help' | translate\"\n                        [popover]=\"\n                          (DEVICE_TYPE_POPOVER | translate) +\n                          (isDeviceProfileEmpty\n                            ? ' ' + (DEVICE_TYPE_DISABLED_POPOVER | translate)\n                            : '')\n                        \"\n                        placement=\"right\"\n                        triggers=\"focus\"\n                        container=\"body\"\n                        type=\"button\"\n                      ></button>\n                    </label>\n                    <c8y-input-group-editable\n                      formGroupClass=\"m-b-0\"\n                      [ariaLabel]=\"'Device type' | translate\"\n                      [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'c8y_Linux' }\"\n                      data-cy=\"device-profile--device-type\"\n                      [ngModel]=\"deviceProfile.c8y_Filter.type\"\n                      [disabled]=\"isDeviceProfileEmpty\"\n                      (ngModelChange)=\"onDeviceTypeSaved($event)\"\n                    ></c8y-input-group-editable>\n                  </c8y-form-group>\n                </div>\n              </div>\n            </div>\n          </div>\n        </div>\n        <div class=\"inner-scroll\">\n          <div class=\"card-header separator-top-bottom bg-content sticky-top\">\n            <div class=\"card-icon\">\n              <i\n                class=\"c8y-icon-duocolor\"\n                [c8yIcon]=\"'c8y-firmware'\"\n              ></i>\n            </div>\n            <div\n              class=\"card-title\"\n              translate\n            >\n              Firmware\n            </div>\n          </div>\n          @if (deviceProfile.c8y_DeviceProfile.firmware) {\n            <div class=\"card-block p-t-0\">\n              <c8y-list-group>\n                <c8y-li>\n                  <c8y-li-icon>\n                    <i [c8yIcon]=\"'c8y-firmware'\"></i>\n                  </c8y-li-icon>\n                  <c8y-li-body class=\"content-flex-50 m-l-4\">\n                    <div class=\"col-4\">\n                      <span\n                        class=\"text-truncate\"\n                        title=\"{{ deviceProfile.c8y_DeviceProfile.firmware.name }}\"\n                      >\n                        <span\n                          class=\"text-label-small m-r-8\"\n                          translate\n                        >\n                          Name\n                        </span>\n                        {{ deviceProfile.c8y_DeviceProfile.firmware.name }}\n                      </span>\n                    </div>\n                    <div class=\"col-4\"></div>\n                    <div class=\"col-3 d-flex a-i-center\">\n                      <span\n                        class=\"text-truncate\"\n                        title=\"{{ deviceProfile.c8y_DeviceProfile.firmware.version }}\"\n                      >\n                        <span\n                          class=\"text-label-small m-r-4\"\n                          translate\n                        >\n                          Version\n                        </span>\n                        {{ deviceProfile.c8y_DeviceProfile.firmware.version }}\n                      </span>\n                      <button\n                        class=\"btn btn-danger btn-xs visible-xs m-l-auto m-r-8 m-t-8\"\n                        title=\"{{ 'Remove`firmware`' | translate }}\"\n                        type=\"button\"\n                        (click)=\"removeFirmware()\"\n                        c8yProductExperience\n                        inherit\n                        [actionData]=\"{\n                          action: PRODUCT_EXPERIENCE.ACTIONS.REMOVE,\n                          fragment: PRODUCT_EXPERIENCE.FRAGMENTS.FIRMWARE\n                        }\"\n                      >\n                        <i c8yIcon=\"minus-circle\"></i>\n                        {{ 'Remove`firmware`' | translate }}\n                      </button>\n                    </div>\n                    <div class=\"m-l-auto p-r-8 hidden-xs\">\n                      <button\n                        class=\"btn btn-dot showOnHover text-danger\"\n                        [attr.aria-label]=\"'Remove`firmware`' | translate\"\n                        tooltip=\"{{ 'Remove`firmware`' | translate }}\"\n                        placement=\"right\"\n                        type=\"button\"\n                        [delay]=\"500\"\n                        (click)=\"removeFirmware()\"\n                        c8yProductExperience\n                        inherit\n                        [actionData]=\"{\n                          action: PRODUCT_EXPERIENCE.ACTIONS.REMOVE,\n                          fragment: PRODUCT_EXPERIENCE.FRAGMENTS.FIRMWARE\n                        }\"\n                      >\n                        <i c8yIcon=\"minus-circle\"></i>\n                      </button>\n                    </div>\n                  </c8y-li-body>\n                </c8y-li>\n              </c8y-list-group>\n            </div>\n          } @else {\n            <div class=\"card-block p-t-16\">\n              <c8y-ui-empty-state\n                class=\"p-t-16 d-block\"\n                icon=\"c8y-firmware\"\n                [title]=\"'No firmware defined.' | translate\"\n                [horizontal]=\"true\"\n              ></c8y-ui-empty-state>\n            </div>\n            <div class=\"card-footer p-t-0\">\n              <button\n                class=\"btn btn-default\"\n                title=\"{{ 'Add firmware' | translate }}\"\n                type=\"button\"\n                data-cy=\"device-profile--Add-firmware-button\"\n                (click)=\"addFirmware()\"\n                c8yProductExperience\n                inherit\n                [actionData]=\"{\n                  action: PRODUCT_EXPERIENCE.ACTIONS.ADD,\n                  fragment: PRODUCT_EXPERIENCE.FRAGMENTS.FIRMWARE\n                }\"\n              >\n                <i c8yIcon=\"plus-circle\"></i>\n                {{ 'Add firmware' | translate }}\n              </button>\n            </div>\n          }\n\n          <div class=\"card-header separator-top-bottom sticky-top bg-component\">\n            <div class=\"card-icon\">\n              <i\n                class=\"c8y-icon-duocolor\"\n                [c8yIcon]=\"'c8y-tools'\"\n              ></i>\n            </div>\n            <div\n              class=\"card-title\"\n              translate\n            >\n              Software\n            </div>\n          </div>\n          @if (deviceProfile.c8y_DeviceProfile.software?.length > 0) {\n            <div class=\"card-block p-t-0\">\n              <c8y-list-group>\n                @for (software of deviceProfile.c8y_DeviceProfile.software; track software) {\n                  <c8y-li>\n                    <c8y-li-icon>\n                      <i [c8yIcon]=\"'c8y-tools'\"></i>\n                    </c8y-li-icon>\n                    <c8y-li-body class=\"content-flex-50 m-l-4\">\n                      <div class=\"col-4\">\n                        <span\n                          class=\"text-truncate-wrap\"\n                          title=\"{{ software.name }}\"\n                        >\n                          <span\n                            class=\"text-label-small m-r-8\"\n                            translate\n                          >\n                            Name\n                          </span>\n                          {{ software.name }}\n                        </span>\n                      </div>\n                      <div class=\"col-4\">\n                        <span\n                          class=\"text-truncate-wrap\"\n                          title=\"{{ software.name }}\"\n                        >\n                          <span\n                            class=\"text-label-small m-r-8\"\n                            translate\n                          >\n                            Type\n                          </span>\n                          @if (!!software.softwareType) {\n                            <span class=\"label label-info m-l-4\">\n                              {{ software.softwareType }}\n                            </span>\n                          }\n                        </span>\n                      </div>\n                      <div class=\"col-3 d-flex a-i-center\">\n                        <span\n                          class=\"text-truncate-wrap\"\n                          title=\"{{ software.version }}\"\n                        >\n                          <span\n                            class=\"text-label-small m-r-8\"\n                            translate\n                          >\n                            Version\n                          </span>\n                          {{ software.version }}\n                        </span>\n                        <button\n                          class=\"btn btn-danger btn-xs visible-xs m-l-auto m-r-8 m-t-8\"\n                          title=\"{{ 'Remove`software`' | translate }}\"\n                          type=\"button\"\n                          ((click)=\"removeItem(software, 'software')\"\n                          c8yProductExperience\n                          inherit\n                          [actionData]=\"{\n                            action: PRODUCT_EXPERIENCE.ACTIONS.REMOVE,\n                            fragment: PRODUCT_EXPERIENCE.FRAGMENTS.SOFTWARE\n                          }\"\n                        >\n                          <i c8yIcon=\"minus-circle\"></i>\n                          {{ 'Remove`software`' | translate }}\n                        </button>\n                      </div>\n                      <div class=\"m-l-auto p-r-8 hidden-xs\">\n                        <button\n                          class=\"btn btn-dot showOnHover text-danger\"\n                          [attr.aria-label]=\"'Remove`software`' | translate\"\n                          tooltip=\"{{ 'Remove`software`' | translate }}\"\n                          placement=\"right\"\n                          type=\"button\"\n                          [delay]=\"500\"\n                          (click)=\"removeItem(software, 'software')\"\n                          c8yProductExperience\n                          inherit\n                          [actionData]=\"{\n                            action: PRODUCT_EXPERIENCE.ACTIONS.REMOVE,\n                            fragment: PRODUCT_EXPERIENCE.FRAGMENTS.SOFTWARE\n                          }\"\n                        >\n                          <i\n                            c8yIcon=\"minus-circle\"\n                            data-cy=\"device-profile--Remove-icon\"\n                          ></i>\n                        </button>\n                      </div>\n                    </c8y-li-body>\n                  </c8y-li>\n                }\n              </c8y-list-group>\n            </div>\n          }\n          @if (deviceProfile.c8y_DeviceProfile.software?.length === 0) {\n            <div class=\"card-block p-t-16\">\n              <c8y-ui-empty-state\n                icon=\"c8y-tools\"\n                [title]=\"'No software defined.' | translate\"\n                [horizontal]=\"true\"\n              ></c8y-ui-empty-state>\n            </div>\n          }\n          <div class=\"card-footer p-t-0\">\n            <button\n              class=\"btn btn-default m-b-0\"\n              title=\"{{ 'Add software' | translate }}\"\n              type=\"button\"\n              data-cy=\"device-profile--Add-software-button\"\n              (click)=\"addSoftware()\"\n              c8yProductExperience\n              inherit\n              [actionData]=\"{\n                action: PRODUCT_EXPERIENCE.ACTIONS.ADD,\n                fragment: PRODUCT_EXPERIENCE.FRAGMENTS.SOFTWARE\n              }\"\n            >\n              <i c8yIcon=\"plus-circle\"></i>\n              {{ 'Add software' | translate }}\n            </button>\n          </div>\n\n          <div class=\"card-header separator-top-bottom bg-component sticky-top\">\n            <div class=\"card-icon\">\n              <i\n                class=\"c8y-icon-duocolor\"\n                [c8yIcon]=\"'gears'\"\n              ></i>\n            </div>\n            <div\n              class=\"card-title\"\n              translate\n            >\n              Configuration\n            </div>\n          </div>\n          @if (deviceProfile.c8y_DeviceProfile.configuration?.length > 0) {\n            <div class=\"card-block p-t-0\">\n              <c8y-list-group>\n                @for (\n                  configuration of deviceProfile.c8y_DeviceProfile.configuration;\n                  track configuration\n                ) {\n                  <c8y-li>\n                    <c8y-li-icon>\n                      <i [c8yIcon]=\"'gears'\"></i>\n                    </c8y-li-icon>\n                    <c8y-li-body class=\"content-flex-50\">\n                      <div class=\"col-4\">\n                        <span\n                          class=\"text-truncate\"\n                          title=\"{{ configuration.name }}\"\n                        >\n                          <span\n                            class=\"text-label-small m-r-8\"\n                            translate\n                          >\n                            Name\n                          </span>\n                          {{ configuration.name }}\n                        </span>\n                      </div>\n                      <div class=\"col-4\">\n                        <span\n                          class=\"text-label-small m-r-8\"\n                          translate\n                        >\n                          Type\n                        </span>\n                        <span class=\"label label-info\">{{ configuration.type }}</span>\n                        <button\n                          class=\"btn btn-danger btn-xs visible-xs m-l-auto m-r-8 m-t-8\"\n                          title=\"{{ 'Remove`configuration`' | translate }}\"\n                          type=\"button\"\n                          (click)=\"removeItem(configuration, 'configuration')\"\n                          c8yProductExperience\n                          inherit\n                          [actionData]=\"{\n                            action: PRODUCT_EXPERIENCE.ACTIONS.REMOVE,\n                            fragment: PRODUCT_EXPERIENCE.FRAGMENTS.CONFGIURATION\n                          }\"\n                        >\n                          <i c8yIcon=\"minus-circle\"></i>\n                          {{ 'Remove`configuration`' | translate }}\n                        </button>\n                      </div>\n                      <div class=\"col-3 d-flex a-i-center\"></div>\n                      <div class=\"m-l-auto p-r-8 hidden-xs\">\n                        <button\n                          class=\"btn btn-dot showOnHover text-danger\"\n                          [attr.aria-label]=\"'Remove`configuration`' | translate\"\n                          tooltip=\"{{ 'Remove`configuration`' | translate }}\"\n                          placement=\"top\"\n                          type=\"button\"\n                          (click)=\"removeItem(configuration, 'configuration')\"\n                          [delay]=\"500\"\n                          c8yProductExperience\n                          inherit\n                          [actionData]=\"{\n                            action: PRODUCT_EXPERIENCE.ACTIONS.REMOVE,\n                            fragment: PRODUCT_EXPERIENCE.FRAGMENTS.CONFGIURATION\n                          }\"\n                        >\n                          <i\n                            c8yIcon=\"minus-circle\"\n                            data-cy=\"device-profile--Remove-icon\"\n                          ></i>\n                        </button>\n                      </div>\n                    </c8y-li-body>\n                  </c8y-li>\n                }\n              </c8y-list-group>\n            </div>\n          }\n          @if (deviceProfile.c8y_DeviceProfile.configuration?.length === 0) {\n            <div class=\"card-block p-t-16\">\n              <c8y-ui-empty-state\n                icon=\"gears\"\n                [title]=\"'No configuration defined.' | translate\"\n                [horizontal]=\"true\"\n              ></c8y-ui-empty-state>\n            </div>\n          }\n          <div class=\"card-footer p-t-0\">\n            <div class=\"p-t-8\">\n              <button\n                class=\"btn btn-default m-b-0\"\n                title=\"{{ 'Add configuration' | translate }}\"\n                type=\"button\"\n                data-cy=\"device-profile--Add-configuration-button\"\n                (click)=\"addConfiguration()\"\n                c8yProductExperience\n                inherit\n                [actionData]=\"{\n                  action: PRODUCT_EXPERIENCE.ACTIONS.ADD,\n                  fragment: PRODUCT_EXPERIENCE.FRAGMENTS.CONFGIURATION\n                }\"\n              >\n                <i c8yIcon=\"plus-circle\"></i>\n                {{ 'Add configuration' | translate }}\n              </button>\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n}\n", dependencies: [{ kind: "component", type: TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "component", type: BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: ProductExperienceDirective, selector: "[c8yProductExperience]", inputs: ["actionName", "actionData", "inherit", "suppressDataOverriding"] }, { 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: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { 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", "selectOnClick"], outputs: ["collapsedChange"] }, { kind: "component", type: ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: ListItemBodyComponent, selector: "c8y-list-item-body, c8y-li-body", inputs: ["body"] }, { kind: "directive", type: TooltipDirective, selector: "[tooltip], [tooltipHtml]", inputs: ["adaptivePosition", "tooltip", "placement", "triggers", "container", "containerClass", "boundariesElement", "isOpen", "isDisabled", "delay", "tooltipHtml", "tooltipPlacement", "tooltipIsOpen", "tooltipEnable", "tooltipAppendToBody", "tooltipAnimation", "tooltipClass", "tooltipContext", "tooltipPopupDelay", "tooltipFadeDuration", "tooltipTrigger"], outputs: ["tooltipChange", "onShown", "onHidden", "tooltipStateChanged"], exportAs: ["bs-tooltip"] }, { kind: "component", type: InputGroupEditableComponent, selector: "c8y-input-group-editable", inputs: ["ariaLabel", "name", "size", "placeholder", "title", "multiline", "maxHeight", "maxLength", "noSaveButton", "formGroupClass", "validators", "asyncValidators", "autocomplete", "required"], outputs: ["save", "cancel"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: DeviceProfileComponent, decorators: [{
             type: Component,
@@ -1088,7 +1088,7 @@ class DeviceTabProfileComponent {
                 provide: PRODUCT_EXPERIENCE_EVENT_SOURCE,
                 useExisting: forwardRef(() => DeviceTabProfileComponent)
             }
-        ], ngImport: i0, template: "<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    type=\"button\"\n    (click)=\"reload()\"\n  >\n    <i\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': reload$.value }\"\n    ></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n<c8y-action-bar-item [placement]=\"'right'\">\n  <c8y-realtime-btn [service]=\"deviceRealtime\"></c8y-realtime-btn>\n</c8y-action-bar-item>\n\n<div class=\"card card--grid--fullpage card--grid--fullpage card--grid grid__row--2-10--md\">\n  <div class=\"card--grid grid__col--6-6--md\">\n    <!-- AVAILABLE PROFILES -->\n    <div class=\"bg-level-0\">\n      <div class=\"card-header separator\">\n        <div\n          class=\"card-title\"\n          translate\n        >\n          Device profile\n        </div>\n      </div>\n      <div class=\"p-16\">\n        <form #deviceProfileForm=\"ngForm\">\n          <div class=\"input-group\">\n            <c8y-typeahead\n              class=\"flex-grow\"\n              placeholder=\"{{ 'Select device profile' | translate }}\"\n              name=\"selectProfile\"\n              data-cy=\"device-tab-profile--select-device-profile\"\n              [(ngModel)]=\"selectedProfile\"\n              (onSearch)=\"pattern$.next($event)\"\n              [allowFreeEntries]=\"false\"\n            >\n              <c8y-li\n                class=\"p-l-8 p-r-8 c8y-list__item--link\"\n                *c8yFor=\"let profile of deviceProfiles$; pipe: filterPipe\"\n                (click)=\"selectProfile(profile); pattern$.next('')\"\n              >\n                <c8y-highlight\n                  [text]=\"profile.name || '&#45;&#45;'\"\n                  [pattern]=\"pattern$.value\"\n                ></c8y-highlight>\n              </c8y-li>\n            </c8y-typeahead>\n            <div class=\"input-group-btn\">\n              <button\n                class=\"btn btn-primary\"\n                title=\"{{ 'Assign device profile' | translate }}\"\n                type=\"button\"\n                (click)=\"createOperation()\"\n                data-cy=\"device-tab-profile--Assign-device-profile-button\"\n                [disabled]=\"!selectedProfile?.id\"\n                c8yProductExperience\n                inherit\n                [actionData]=\"{ action: PRODUCT_EXPERIENCE.ACTIONS.ASSIGN_DEVICE_PROFILE }\"\n              >\n                <span>{{ 'Assign device profile' | translate }}</span>\n              </button>\n            </div>\n          </div>\n        </form>\n      </div>\n    </div>\n\n    <!-- INSTALL PROFILE OPERATION -->\n    <div class=\"bg-level-1\">\n      <div class=\"card-header separator\">\n        <div\n          class=\"card-title\"\n          translate\n        >\n          Currently installed\n        </div>\n      </div>\n      <div class=\"card-block\">\n        <c8y-operation-details\n          [operation]=\"operation\"\n          c8yProductExperience\n          inherit\n          suppressDataOverriding\n        ></c8y-operation-details>\n      </div>\n    </div>\n  </div>\n  <div class=\"card--grid__inner-scroll d-col no-align-items\">\n    <div class=\"d-contents\">\n      <!-- FIRMWARE -->\n      <c8y-device-tab-profile-detail\n        class=\"d-contents\"\n        [sectionIcon]=\"'c8y-firmware'\"\n        [sectionTitle]=\"'Firmware' | translate\"\n        [emptyStateText]=\"'No firmware to display.' | translate\"\n        [emptyStateDetails]=\"'No firmware assigned.' | translate\"\n        [isProfileSelected]=\"!!selectedProfile\"\n        [items]=\"firmwareItems\"\n        [isEmpty]=\"!selectedProfile?.c8y_DeviceProfile?.firmware?.name\"\n      ></c8y-device-tab-profile-detail>\n    </div>\n    <div class=\"d-contents\">\n      <!-- SOFTWARE -->\n      <c8y-device-tab-profile-detail\n        class=\"d-contents\"\n        [sectionIcon]=\"'c8y-tools'\"\n        [sectionTitle]=\"'Software' | translate\"\n        [emptyStateText]=\"'No software to display.' | translate\"\n        [emptyStateDetails]=\"'No software assigned.' | translate\"\n        [isProfileSelected]=\"!!selectedProfile\"\n        [items]=\"softwareItems\"\n        [isEmpty]=\"\n          !selectedProfile?.c8y_DeviceProfile?.software ||\n          selectedProfile?.c8y_DeviceProfile?.software?.length === 0\n        \"\n      ></c8y-device-tab-profile-detail>\n    </div>\n    <div class=\"d-contents\">\n      <!-- CONFIGURATION -->\n      <c8y-device-tab-profile-detail\n        class=\"d-contents\"\n        [sectionIcon]=\"'gears'\"\n        [sectionTitle]=\"'Configuration' | translate\"\n        [emptyStateText]=\"'No configuration to display' | translate\"\n        [emptyStateDetails]=\"'No configuration assigned' | translate\"\n        [isProfileSelected]=\"!!selectedProfile\"\n        [items]=\"configurationItems\"\n        [isEmpty]=\"\n          !selectedProfile?.c8y_DeviceProfile?.configuration ||\n          selectedProfile?.c8y_DeviceProfile?.configuration?.length === 0\n        \"\n      ></c8y-device-tab-profile-detail>\n    </div>\n    <!-- fill in the remanining vertical space when empty -->\n    <div class=\"card--grid grid__col--6-6--md flex-grow\">\n      <div class=\"bg-level-0\"></div>\n      <div class=\"bg-level-1\"></div>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: RealtimeButtonComponent, selector: "c8y-realtime-btn", inputs: ["service", "label", "title", "disabled"], outputs: ["onToggle"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: TypeaheadComponent, selector: "c8y-typeahead", inputs: ["required", "maxlength", "disabled", "allowFreeEntries", "placeholder", "displayProperty", "icon", "name", "autoClose", "hideNew", "container", "selected", "title", "highlightFirstItem"], outputs: ["onSearch", "onIconClick"] }, { kind: "directive", type: ForOfDirective, selector: "[c8yFor]", inputs: ["c8yForOf", "c8yForLoadMore", "c8yForPipe", "c8yForNotFound", "c8yForMaxIterations", "c8yForLoadingTemplate", "c8yForLoadNextLabel", "c8yForLoadingLabel", "c8yForRealtime", "c8yForRealtimeOptions", "c8yForComparator", "c8yForEnableVirtualScroll", "c8yForVirtualScrollElementSize", "c8yForVirtualScrollStrategy", "c8yForVirtualScrollContainerHeight"], outputs: ["c8yForCount", "c8yForChange", "c8yForLoadMoreComponent"] }, { kind: "component", type: ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: HighlightComponent, selector: "c8y-highlight", inputs: ["pattern", "text", "elementClass", "shouldTrimPattern"] }, { kind: "directive", type: ProductExperienceDirective, selector: "[c8yProductExperience]", inputs: ["actionName", "actionData", "inherit", "suppressDataOverriding"] }, { kind: "component", type: OperationDetailsComponent, selector: "c8y-operation-details", inputs: ["operation"] }, { kind: "component", type: DeviceTabProfileDetailComponent, selector: "c8y-device-tab-profile-detail", inputs: ["sectionTitle", "sectionIcon", "emptyStateText", "emptyStateDetails", "isProfileSelected", "isEmpty", "items", "showTextLabel"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
+        ], ngImport: i0, template: "<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    type=\"button\"\n    (click)=\"reload()\"\n  >\n    <i\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': reload$.value }\"\n    ></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n<c8y-action-bar-item [placement]=\"'right'\">\n  <c8y-realtime-btn [service]=\"deviceRealtime\"></c8y-realtime-btn>\n</c8y-action-bar-item>\n\n<div class=\"card card--grid--fullpage card--grid--fullpage card--grid grid__row--2-10--md\">\n  <div class=\"card--grid grid__col--6-6--md\">\n    <!-- AVAILABLE PROFILES -->\n    <div class=\"bg-level-0\">\n      <div class=\"card-header separator\">\n        <div\n          class=\"card-title\"\n          translate\n        >\n          Device profile\n        </div>\n      </div>\n      <div class=\"p-16\">\n        <form #deviceProfileForm=\"ngForm\">\n          <div class=\"input-group\">\n            <c8y-typeahead\n              class=\"flex-grow\"\n              placeholder=\"{{ 'Select device profile' | translate }}\"\n              name=\"selectProfile\"\n              data-cy=\"device-tab-profile--select-device-profile\"\n              [(ngModel)]=\"selectedProfile\"\n              (onSearch)=\"pattern$.next($event)\"\n              [allowFreeEntries]=\"false\"\n            >\n              <c8y-li\n                class=\"p-l-8 p-r-8 c8y-list__item--link\"\n                *c8yFor=\"let profile of deviceProfiles$; pipe: filterPipe\"\n                (click)=\"selectProfile(profile); pattern$.next('')\"\n              >\n                <c8y-highlight\n                  [text]=\"profile.name || '&#45;&#45;'\"\n                  [pattern]=\"pattern$.value\"\n                ></c8y-highlight>\n              </c8y-li>\n            </c8y-typeahead>\n            <div class=\"input-group-btn\">\n              <button\n                class=\"btn btn-primary\"\n                title=\"{{ 'Assign device profile' | translate }}\"\n                type=\"button\"\n                (click)=\"createOperation()\"\n                data-cy=\"device-tab-profile--Assign-device-profile-button\"\n                [disabled]=\"!selectedProfile?.id\"\n                c8yProductExperience\n                inherit\n                [actionData]=\"{ action: PRODUCT_EXPERIENCE.ACTIONS.ASSIGN_DEVICE_PROFILE }\"\n              >\n                <span>{{ 'Assign device profile' | translate }}</span>\n              </button>\n            </div>\n          </div>\n        </form>\n      </div>\n    </div>\n\n    <!-- INSTALL PROFILE OPERATION -->\n    <div class=\"bg-level-1\">\n      <div class=\"card-header separator\">\n        <div\n          class=\"card-title\"\n          translate\n        >\n          Currently installed\n        </div>\n      </div>\n      <div class=\"card-block\">\n        <c8y-operation-details\n          [operation]=\"operation\"\n          c8yProductExperience\n          inherit\n          suppressDataOverriding\n        ></c8y-operation-details>\n      </div>\n    </div>\n  </div>\n  <div class=\"card--grid__inner-scroll d-col no-align-items\">\n    <div class=\"d-contents\">\n      <!-- FIRMWARE -->\n      <c8y-device-tab-profile-detail\n        class=\"d-contents\"\n        [sectionIcon]=\"'c8y-firmware'\"\n        [sectionTitle]=\"'Firmware' | translate\"\n        [emptyStateText]=\"'No firmware to display.' | translate\"\n        [emptyStateDetails]=\"'No firmware assigned.' | translate\"\n        [isProfileSelected]=\"!!selectedProfile\"\n        [items]=\"firmwareItems\"\n        [isEmpty]=\"!selectedProfile?.c8y_DeviceProfile?.firmware?.name\"\n      ></c8y-device-tab-profile-detail>\n    </div>\n    <div class=\"d-contents\">\n      <!-- SOFTWARE -->\n      <c8y-device-tab-profile-detail\n        class=\"d-contents\"\n        [sectionIcon]=\"'c8y-tools'\"\n        [sectionTitle]=\"'Software' | translate\"\n        [emptyStateText]=\"'No software to display.' | translate\"\n        [emptyStateDetails]=\"'No software assigned.' | translate\"\n        [isProfileSelected]=\"!!selectedProfile\"\n        [items]=\"softwareItems\"\n        [isEmpty]=\"\n          !selectedProfile?.c8y_DeviceProfile?.software ||\n          selectedProfile?.c8y_DeviceProfile?.software?.length === 0\n        \"\n      ></c8y-device-tab-profile-detail>\n    </div>\n    <div class=\"d-contents\">\n      <!-- CONFIGURATION -->\n      <c8y-device-tab-profile-detail\n        class=\"d-contents\"\n        [sectionIcon]=\"'gears'\"\n        [sectionTitle]=\"'Configuration' | translate\"\n        [emptyStateText]=\"'No configuration to display' | translate\"\n        [emptyStateDetails]=\"'No configuration assigned' | translate\"\n        [isProfileSelected]=\"!!selectedProfile\"\n        [items]=\"configurationItems\"\n        [isEmpty]=\"\n          !selectedProfile?.c8y_DeviceProfile?.configuration ||\n          selectedProfile?.c8y_DeviceProfile?.configuration?.length === 0\n        \"\n      ></c8y-device-tab-profile-detail>\n    </div>\n    <!-- fill in the remanining vertical space when empty -->\n    <div class=\"card--grid grid__col--6-6--md flex-grow\">\n      <div class=\"bg-level-0\"></div>\n      <div class=\"bg-level-1\"></div>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: RealtimeButtonComponent, selector: "c8y-realtime-btn", inputs: ["service", "label", "title", "disabled"], outputs: ["onToggle"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: TypeaheadComponent, selector: "c8y-typeahead", inputs: ["required", "maxlength", "disabled", "allowFreeEntries", "placeholder", "displayProperty", "icon", "name", "autoClose", "hideNew", "container", "selected", "title", "ariaLabel", "ariaLabelledby", "highlightFirstItem"], outputs: ["onSearch", "onIconClick"] }, { kind: "directive", type: ForOfDirective, selector: "[c8yFor]", inputs: ["c8yForOf", "c8yForLoadMore", "c8yForPipe", "c8yForNotFound", "c8yForMaxIterations", "c8yForLoadingTemplate", "c8yForLoadNextLabel", "c8yForLoadingLabel", "c8yForRealtime", "c8yForRealtimeOptions", "c8yForComparator", "c8yForEnableVirtualScroll", "c8yForVirtualScrollElementSize", "c8yForVirtualScrollStrategy", "c8yForVirtualScrollContainerHeight"], outputs: ["c8yForCount", "c8yForChange", "c8yForLoadMoreComponent"] }, { kind: "component", type: ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable", "selectOnClick"], outputs: ["collapsedChange"] }, { kind: "component", type: HighlightComponent, selector: "c8y-highlight", inputs: ["pattern", "text", "elementClass", "shouldTrimPattern"] }, { kind: "directive", type: ProductExperienceDirective, selector: "[c8yProductExperience]", inputs: ["actionName", "actionData", "inherit", "suppressDataOverriding"] }, { kind: "component", type: OperationDetailsComponent, selector: "c8y-operation-details", inputs: ["operation"] }, { kind: "component", type: DeviceTabProfileDetailComponent, selector: "c8y-device-tab-profile-detail", inputs: ["sectionTitle", "sectionIcon", "emptyStateText", "emptyStateDetails", "isProfileSelected", "isEmpty", "items", "showTextLabel"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: DeviceTabProfileComponent, decorators: [{
             type: Component,