@c8y/ngx-components 1024.18.1 → 1024.18.10

package/fesm2022/c8y-ngx-components.mjs

@@ -16901,6 +16901,12 @@ class ModalComponent {
          * CSS classes for modal header.
          */
         this.headerClasses = '';
+        /**
+         * Lets the modal content reach the dialog edges, for lists, tables, steppers and previews.
+         * By default the body is inset by the same amount as the header and the footer, so that its
+         * content lines up with the title.
+         */
+        this.flushBody = false;
         this._labels = { ok: gettext$1('OK'), cancel: gettext$1('Cancel') };
     }
     /**
@@ -16947,11 +16953,11 @@ class ModalComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: ModalComponent, deps: [{ token: i1$6.BsModalRef, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: ModalComponent, isStandalone: true, selector: "c8y-modal", inputs: { disabled: "disabled", close: "close", dismiss: "dismiss", title: "title", body: "body", customFooter: "customFooter", headerClasses: "headerClasses", labels: "labels" }, outputs: { onDismiss: "onDismiss", onClose: "onClose" }, host: { listeners: { "document:keydown.enter": "onEnterKeyDown($event)" } }, ngImport: i0, template: "<div class=\"viewport-modal\">\n  <div\n    class=\"modal-header {{ headerClasses }}\"\n    [ngClass]=\"{ separator: title }\"\n  >\n    <ng-content select=\"[c8y-modal-title]\"></ng-content>\n\n    @if (title) {\n      <div\n        class=\"modal-title\"\n        id=\"modal-title\"\n      >\n        {{ title | translate }}\n      </div>\n    }\n  </div>\n\n  <div\n    class=\"modal-inner-scroll\"\n    id=\"modal-body\"\n  >\n    <div [ngClass]=\"{ 'modal-body': !customFooter, 'd-contents': customFooter }\">\n      @if (title) {\n        <p class=\"text-center text-break-word\">\n          {{ body }}\n        </p>\n      }\n\n      <ng-content></ng-content>\n    </div>\n  </div>\n\n  <ng-content select=\"[c8y-modal-footer-custom]\"></ng-content>\n\n  @if (!customFooter) {\n    <div class=\"modal-footer\">\n      <ng-content select=\"[c8y-modal-footer]\"></ng-content>\n\n      @if (labels.cancel) {\n        <button\n          class=\"btn btn-default\"\n          title=\"{{ labels.cancel | translate }}\"\n          type=\"button\"\n          data-cy=\"c8y-modal--dismiss\"\n          (click)=\"_dismiss()\"\n        >\n          {{ labels.cancel | translate }}\n        </button>\n      }\n\n      @if (labels.ok) {\n        <button\n          class=\"btn btn-primary\"\n          title=\"{{ labels.ok | translate }}\"\n          type=\"button\"\n          data-cy=\"c8y-modal--confirm\"\n          (click)=\"_close()\"\n          [disabled]=\"disabled\"\n        >\n          {{ labels.ok | translate }}\n        </button>\n      }\n    </div>\n  }\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: ModalComponent, isStandalone: true, selector: "c8y-modal", inputs: { disabled: "disabled", close: "close", dismiss: "dismiss", title: "title", body: "body", customFooter: "customFooter", headerClasses: "headerClasses", flushBody: "flushBody", labels: "labels" }, outputs: { onDismiss: "onDismiss", onClose: "onClose" }, host: { listeners: { "document:keydown.enter": "onEnterKeyDown($event)" } }, ngImport: i0, template: "<div class=\"viewport-modal\">\n  <div\n    class=\"modal-header {{ headerClasses }}\"\n    [ngClass]=\"{ separator: title }\"\n  >\n    <ng-content select=\"[c8y-modal-title]\"></ng-content>\n\n    @if (title) {\n      <div\n        class=\"modal-title\"\n        id=\"modal-title\"\n      >\n        {{ title | translate }}\n      </div>\n    }\n  </div>\n\n  <div\n    class=\"modal-inner-scroll\"\n    id=\"modal-body\"\n  >\n    <div\n      [ngClass]=\"{\n        'modal-body': !customFooter,\n        'modal-body--flush': !customFooter && flushBody,\n        'd-contents': customFooter\n      }\"\n    >\n      @if (title) {\n        <p class=\"text-center text-break-word\">\n          {{ body }}\n        </p>\n      }\n\n      <ng-content></ng-content>\n    </div>\n  </div>\n\n  <ng-content select=\"[c8y-modal-footer-custom]\"></ng-content>\n\n  @if (!customFooter) {\n    <div class=\"modal-footer\">\n      <ng-content select=\"[c8y-modal-footer]\"></ng-content>\n\n      @if (labels.cancel) {\n        <button\n          class=\"btn btn-default\"\n          title=\"{{ labels.cancel | translate }}\"\n          type=\"button\"\n          data-cy=\"c8y-modal--dismiss\"\n          (click)=\"_dismiss()\"\n        >\n          {{ labels.cancel | translate }}\n        </button>\n      }\n\n      @if (labels.ok) {\n        <button\n          class=\"btn btn-primary\"\n          title=\"{{ labels.ok | translate }}\"\n          type=\"button\"\n          data-cy=\"c8y-modal--confirm\"\n          (click)=\"_close()\"\n          [disabled]=\"disabled\"\n        >\n          {{ labels.ok | translate }}\n        </button>\n      }\n    </div>\n  }\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: ModalComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-modal', standalone: true, imports: [NgClass, NgIf, C8yTranslatePipe], changeDetection: ChangeDetectionStrategy.Eager, template: "<div class=\"viewport-modal\">\n  <div\n    class=\"modal-header {{ headerClasses }}\"\n    [ngClass]=\"{ separator: title }\"\n  >\n    <ng-content select=\"[c8y-modal-title]\"></ng-content>\n\n    @if (title) {\n      <div\n        class=\"modal-title\"\n        id=\"modal-title\"\n      >\n        {{ title | translate }}\n      </div>\n    }\n  </div>\n\n  <div\n    class=\"modal-inner-scroll\"\n    id=\"modal-body\"\n  >\n    <div [ngClass]=\"{ 'modal-body': !customFooter, 'd-contents': customFooter }\">\n      @if (title) {\n        <p class=\"text-center text-break-word\">\n          {{ body }}\n        </p>\n      }\n\n      <ng-content></ng-content>\n    </div>\n  </div>\n\n  <ng-content select=\"[c8y-modal-footer-custom]\"></ng-content>\n\n  @if (!customFooter) {\n    <div class=\"modal-footer\">\n      <ng-content select=\"[c8y-modal-footer]\"></ng-content>\n\n      @if (labels.cancel) {\n        <button\n          class=\"btn btn-default\"\n          title=\"{{ labels.cancel | translate }}\"\n          type=\"button\"\n          data-cy=\"c8y-modal--dismiss\"\n          (click)=\"_dismiss()\"\n        >\n          {{ labels.cancel | translate }}\n        </button>\n      }\n\n      @if (labels.ok) {\n        <button\n          class=\"btn btn-primary\"\n          title=\"{{ labels.ok | translate }}\"\n          type=\"button\"\n          data-cy=\"c8y-modal--confirm\"\n          (click)=\"_close()\"\n          [disabled]=\"disabled\"\n        >\n          {{ labels.ok | translate }}\n        </button>\n      }\n    </div>\n  }\n</div>\n" }]
+            args: [{ selector: 'c8y-modal', standalone: true, imports: [NgClass, C8yTranslatePipe], changeDetection: ChangeDetectionStrategy.Eager, template: "<div class=\"viewport-modal\">\n  <div\n    class=\"modal-header {{ headerClasses }}\"\n    [ngClass]=\"{ separator: title }\"\n  >\n    <ng-content select=\"[c8y-modal-title]\"></ng-content>\n\n    @if (title) {\n      <div\n        class=\"modal-title\"\n        id=\"modal-title\"\n      >\n        {{ title | translate }}\n      </div>\n    }\n  </div>\n\n  <div\n    class=\"modal-inner-scroll\"\n    id=\"modal-body\"\n  >\n    <div\n      [ngClass]=\"{\n        'modal-body': !customFooter,\n        'modal-body--flush': !customFooter && flushBody,\n        'd-contents': customFooter\n      }\"\n    >\n      @if (title) {\n        <p class=\"text-center text-break-word\">\n          {{ body }}\n        </p>\n      }\n\n      <ng-content></ng-content>\n    </div>\n  </div>\n\n  <ng-content select=\"[c8y-modal-footer-custom]\"></ng-content>\n\n  @if (!customFooter) {\n    <div class=\"modal-footer\">\n      <ng-content select=\"[c8y-modal-footer]\"></ng-content>\n\n      @if (labels.cancel) {\n        <button\n          class=\"btn btn-default\"\n          title=\"{{ labels.cancel | translate }}\"\n          type=\"button\"\n          data-cy=\"c8y-modal--dismiss\"\n          (click)=\"_dismiss()\"\n        >\n          {{ labels.cancel | translate }}\n        </button>\n      }\n\n      @if (labels.ok) {\n        <button\n          class=\"btn btn-primary\"\n          title=\"{{ labels.ok | translate }}\"\n          type=\"button\"\n          data-cy=\"c8y-modal--confirm\"\n          (click)=\"_close()\"\n          [disabled]=\"disabled\"\n        >\n          {{ labels.ok | translate }}\n        </button>\n      }\n    </div>\n  }\n</div>\n" }]
         }], ctorParameters: () => [{ type: i1$6.BsModalRef, decorators: [{
                     type: Optional
                 }] }], propDecorators: { onDismiss: [{
@@ -16972,6 +16978,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImpo
                 type: Input
             }], headerClasses: [{
                 type: Input
+            }], flushBody: [{
+                type: Input
             }], labels: [{
                 type: Input
             }], onEnterKeyDown: [{
@@ -21739,7 +21747,7 @@ class PasswordConfirmModalComponent {
         this.modal._dismiss();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: PasswordConfirmModalComponent, deps: [{ token: i1.UserService }, { token: AppStateService }, { token: i1.FetchClient }, { token: AlertService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: PasswordConfirmModalComponent, isStandalone: true, selector: "c8y-password-confirm-modal", outputs: { passwordConfirmedEmitter: "passwordConfirmedEmitter" }, viewQueries: [{ propertyName: "modal", first: true, predicate: ["modal"], descendants: true }], ngImport: i0, template: "<c8y-modal [customFooter]=\"true\" [title]=\"'Confirm your current password' | translate\" #modal>\r\n  <form #confirmForm=\"ngForm\" (ngSubmit)=\"confirmForm.form.valid && passwordConfirm()\">\r\n    <div class=\"d-block p-24 p-b-0\">\r\n      <c8y-form-group [hasWarning]=\"true\">\r\n        <label translate for=\"currentPassword\">Enter your password</label>\r\n        <input\r\n          id=\"currentPassword\"\r\n          [(ngModel)]=\"password\"\r\n          type=\"password\"\r\n          name=\"password\"\r\n          class=\"form-control\"\r\n          placeholder=\"{{ 'Enter your password' | translate }}\"\r\n          required\r\n        />\r\n        <c8y-messages>\r\n          <c8y-message translate>\r\n            Enter the password of the user that you are currently logged in with.\r\n          </c8y-message>\r\n        </c8y-messages>\r\n      </c8y-form-group>\r\n    </div>\r\n    <div class=\"modal-footer separator-top bg-level-0 sticky-bottom\">\r\n      <button\r\n        title=\"{{ 'Cancel' | translate }}\"\r\n        class=\"btn btn-default\"\r\n        type=\"button\"\r\n        (click)=\"cancel()\"\r\n      >\r\n        {{ 'Cancel' | translate }}\r\n      </button>\r\n      <button\r\n        title=\"{{ 'Confirm' | translate }}\"\r\n        class=\"btn btn-primary\"\r\n        type=\"submit\"\r\n        [disabled]=\"!confirmForm.form.valid || loading\"\r\n      >\r\n        {{ 'Confirm' | translate }}\r\n      </button>\r\n    </div>\r\n  </form>\r\n</c8y-modal>\r\n", dependencies: [{ kind: "component", type: ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "ngmodule", type: FormsModule$1 }, { kind: "directive", type: i1$7.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$7.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: i1$7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$7.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$7.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$7.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "component", type: MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage", "additionalMessages"] }, { kind: "directive", type: MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: PasswordConfirmModalComponent, isStandalone: true, selector: "c8y-password-confirm-modal", outputs: { passwordConfirmedEmitter: "passwordConfirmedEmitter" }, viewQueries: [{ propertyName: "modal", first: true, predicate: ["modal"], descendants: true }], ngImport: i0, template: "<c8y-modal [customFooter]=\"true\" [title]=\"'Confirm your current password' | translate\" #modal>\r\n  <form #confirmForm=\"ngForm\" (ngSubmit)=\"confirmForm.form.valid && passwordConfirm()\">\r\n    <div class=\"d-block p-24 p-b-0\">\r\n      <c8y-form-group [hasWarning]=\"true\">\r\n        <label translate for=\"currentPassword\">Enter your password</label>\r\n        <input\r\n          id=\"currentPassword\"\r\n          [(ngModel)]=\"password\"\r\n          type=\"password\"\r\n          name=\"password\"\r\n          class=\"form-control\"\r\n          placeholder=\"{{ 'Enter your password' | translate }}\"\r\n          required\r\n        />\r\n        <c8y-messages>\r\n          <c8y-message translate>\r\n            Enter the password of the user that you are currently logged in with.\r\n          </c8y-message>\r\n        </c8y-messages>\r\n      </c8y-form-group>\r\n    </div>\r\n    <div class=\"modal-footer separator-top bg-level-0 sticky-bottom\">\r\n      <button\r\n        title=\"{{ 'Cancel' | translate }}\"\r\n        class=\"btn btn-default\"\r\n        type=\"button\"\r\n        (click)=\"cancel()\"\r\n      >\r\n        {{ 'Cancel' | translate }}\r\n      </button>\r\n      <button\r\n        title=\"{{ 'Confirm' | translate }}\"\r\n        class=\"btn btn-primary\"\r\n        type=\"submit\"\r\n        [disabled]=\"!confirmForm.form.valid || loading\"\r\n      >\r\n        {{ 'Confirm' | translate }}\r\n      </button>\r\n    </div>\r\n  </form>\r\n</c8y-modal>\r\n", dependencies: [{ kind: "component", type: ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "flushBody", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "ngmodule", type: FormsModule$1 }, { kind: "directive", type: i1$7.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$7.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: i1$7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$7.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$7.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$7.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "component", type: MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage", "additionalMessages"] }, { kind: "directive", type: MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: PasswordConfirmModalComponent, decorators: [{
             type: Component,
@@ -21774,7 +21782,7 @@ class CurrentPasswordModalComponent {
         this.modal.hide();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: CurrentPasswordModalComponent, deps: [{ token: i1$6.BsModalRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: CurrentPasswordModalComponent, isStandalone: true, selector: "c8y-current-password-modal", outputs: { currentPasswordEmitter: "currentPasswordEmitter" }, ngImport: i0, template: "<c8y-modal [customFooter]=\"true\" [title]=\"'Confirm your current password' | translate\" #modal>\n  <form #confirmForm=\"ngForm\" (ngSubmit)=\"confirmForm.form.valid && passwordConfirm()\">\n    <div class=\"d-block p-24\">\n      <c8y-form-group [hasWarning]=\"true\">\n        <label translate for=\"currentPassword\">Enter your password</label>\n        <input\n          id=\"currentPassword\"\n          [(ngModel)]=\"password\"\n          type=\"password\"\n          name=\"password\"\n          class=\"form-control\"\n          required\n        />\n        <c8y-messages>\n          <c8y-message translate>\n            The password of the user that you are currently logged in with.\n          </c8y-message>\n        </c8y-messages>\n      </c8y-form-group>\n    </div>\n    <div class=\"modal-footer separator-top bg-level-0 sticky-bottom\">\n      <button\n        title=\"{{ 'Cancel' | translate }}\"\n        class=\"btn btn-default\"\n        type=\"button\"\n        (click)=\"cancel()\"\n      >\n        {{ 'Cancel' | translate }}\n      </button>\n      <button\n        title=\"{{ 'Confirm' | translate }}\"\n        class=\"btn btn-primary\"\n        [attr.data-cy]=\"'confirm-current-password-confirm-button'\"\n        type=\"submit\"\n        [disabled]=\"!confirmForm.form.valid\"\n      >\n        {{ 'Confirm' | translate }}\n      </button>\n    </div>\n  </form>\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: "ngmodule", type: FormsModule$1 }, { kind: "directive", type: i1$7.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$7.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: i1$7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$7.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$7.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$7.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "component", type: MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage", "additionalMessages"] }, { kind: "directive", type: MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: CurrentPasswordModalComponent, isStandalone: true, selector: "c8y-current-password-modal", outputs: { currentPasswordEmitter: "currentPasswordEmitter" }, ngImport: i0, template: "<c8y-modal [customFooter]=\"true\" [title]=\"'Confirm your current password' | translate\" #modal>\n  <form #confirmForm=\"ngForm\" (ngSubmit)=\"confirmForm.form.valid && passwordConfirm()\">\n    <div class=\"d-block p-24\">\n      <c8y-form-group [hasWarning]=\"true\">\n        <label translate for=\"currentPassword\">Enter your password</label>\n        <input\n          id=\"currentPassword\"\n          [(ngModel)]=\"password\"\n          type=\"password\"\n          name=\"password\"\n          class=\"form-control\"\n          required\n        />\n        <c8y-messages>\n          <c8y-message translate>\n            The password of the user that you are currently logged in with.\n          </c8y-message>\n        </c8y-messages>\n      </c8y-form-group>\n    </div>\n    <div class=\"modal-footer separator-top bg-level-0 sticky-bottom\">\n      <button\n        title=\"{{ 'Cancel' | translate }}\"\n        class=\"btn btn-default\"\n        type=\"button\"\n        (click)=\"cancel()\"\n      >\n        {{ 'Cancel' | translate }}\n      </button>\n      <button\n        title=\"{{ 'Confirm' | translate }}\"\n        class=\"btn btn-primary\"\n        [attr.data-cy]=\"'confirm-current-password-confirm-button'\"\n        type=\"submit\"\n        [disabled]=\"!confirmForm.form.valid\"\n      >\n        {{ 'Confirm' | translate }}\n      </button>\n    </div>\n  </form>\n</c8y-modal>\n", dependencies: [{ kind: "component", type: ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "flushBody", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "ngmodule", type: FormsModule$1 }, { kind: "directive", type: i1$7.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$7.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: i1$7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$7.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$7.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$7.NgForm, selector: "form:not([ngNoForm]):not([formGroup]):not([formArray]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "component", type: MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage", "additionalMessages"] }, { kind: "directive", type: MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: CurrentPasswordModalComponent, decorators: [{
             type: Component,
@@ -22013,7 +22021,7 @@ class UserTotpSetupComponent {
         this.modal.hide();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: UserTotpSetupComponent, deps: [{ token: i1.UserService }, { token: ModalService }, { token: i1$6.BsModalRef }, { token: SimplifiedAuthService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: UserTotpSetupComponent, isStandalone: true, selector: "c8y-user-totp-setup", ngImport: i0, template: "<c8y-modal\n  [title]=\"'Set up two-factor authentication' | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <span class=\"dlt-c8y-icon-phonelink-lock\"></span>\n  </ng-container>\n\n  <c8y-totp-setup></c8y-totp-setup>\n  <c8y-totp-challenge [isModal]=\"true\" (onSuccess)=\"totpSetupVerified()\" (totpUnconfirmedEmitter)=\"close()\"></c8y-totp-challenge>\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: "component", type: TotpSetupComponent, selector: "c8y-totp-setup" }, { kind: "component", type: TotpChallengeComponent, selector: "c8y-totp-challenge", inputs: ["verify", "loading", "hasError", "isModal"], outputs: ["onSuccess", "totpUnconfirmedEmitter"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: UserTotpSetupComponent, isStandalone: true, selector: "c8y-user-totp-setup", ngImport: i0, template: "<c8y-modal\n  [title]=\"'Set up two-factor authentication' | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <span class=\"dlt-c8y-icon-phonelink-lock\"></span>\n  </ng-container>\n\n  <c8y-totp-setup></c8y-totp-setup>\n  <c8y-totp-challenge [isModal]=\"true\" (onSuccess)=\"totpSetupVerified()\" (totpUnconfirmedEmitter)=\"close()\"></c8y-totp-challenge>\n</c8y-modal>\n", dependencies: [{ kind: "component", type: ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "flushBody", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "component", type: TotpSetupComponent, selector: "c8y-totp-setup" }, { kind: "component", type: TotpChallengeComponent, selector: "c8y-totp-challenge", inputs: ["verify", "loading", "hasError", "isModal"], outputs: ["onSuccess", "totpUnconfirmedEmitter"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: UserTotpSetupComponent, decorators: [{
             type: Component,
@@ -22863,7 +22871,7 @@ class UserEditModalComponent {
         this.auth.updateCredentials(newCredentials);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: UserEditModalComponent, deps: [{ token: i1$6.BsModalRef }, { token: i1.UserService }, { token: AppStateService }, { token: i1.BasicAuth }, { token: i1.FetchClient }, { token: AlertService }, { token: UserPreferencesService }, { token: ModalService }, { token: GainsightService }, { token: CookieBannerService }, { token: PasswordService }, { token: UserEngagementsService }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: UserEditModalComponent, isStandalone: true, selector: "c8y-user-edit-modal", ngImport: i0, template: "<c8y-modal\n  [title]=\"'Edit user' | translate\"\n  [customFooter]=\"true\"\n  (onDismiss)=\"onDismiss()\"\n>\n  <c8y-user-edit\n    [user]=\"ui.currentUser | async\"\n    [loading]=\"loading\"\n    [isUsageTrackingEnabled]=\"currentUsageTrackingState\"\n    [isUserEngagementPreferenceEnabled]=\"currentUserEngagementPreferenceInitialState\"\n    [showProductExperienceOptions]=\"showProductExperienceOptions\"\n    [focusOnNewPassword]=\"passwordChange\"\n    (onUsageTrackingChange)=\"onUsageTrackingChange($event)\"\n    (onUserEngagementPreferenceChange)=\"onUserEngagementPreferenceChange($event)\"\n    (onUser)=\"updateAndClose($event)\"\n    (onCancel)=\"onDismiss()\"\n  ></c8y-user-edit>\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: "component", type: UserEditComponent, selector: "c8y-user-edit", inputs: ["loading", "user", "showProductExperienceOptions", "isUsageTrackingEnabled", "isUserEngagementPreferenceEnabled", "focusOnNewPassword"], outputs: ["onUser", "onUsageTrackingChange", "onUserEngagementPreferenceChange", "onCancel"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: UserEditModalComponent, isStandalone: true, selector: "c8y-user-edit-modal", ngImport: i0, template: "<c8y-modal\n  [title]=\"'Edit user' | translate\"\n  [customFooter]=\"true\"\n  (onDismiss)=\"onDismiss()\"\n>\n  <c8y-user-edit\n    [user]=\"ui.currentUser | async\"\n    [loading]=\"loading\"\n    [isUsageTrackingEnabled]=\"currentUsageTrackingState\"\n    [isUserEngagementPreferenceEnabled]=\"currentUserEngagementPreferenceInitialState\"\n    [showProductExperienceOptions]=\"showProductExperienceOptions\"\n    [focusOnNewPassword]=\"passwordChange\"\n    (onUsageTrackingChange)=\"onUsageTrackingChange($event)\"\n    (onUserEngagementPreferenceChange)=\"onUserEngagementPreferenceChange($event)\"\n    (onUser)=\"updateAndClose($event)\"\n    (onCancel)=\"onDismiss()\"\n  ></c8y-user-edit>\n</c8y-modal>\n", dependencies: [{ kind: "component", type: ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "flushBody", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "component", type: UserEditComponent, selector: "c8y-user-edit", inputs: ["loading", "user", "showProductExperienceOptions", "isUsageTrackingEnabled", "isUserEngagementPreferenceEnabled", "focusOnNewPassword"], outputs: ["onUser", "onUsageTrackingChange", "onUserEngagementPreferenceChange", "onCancel"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: UserEditModalComponent, decorators: [{
             type: Component,
@@ -33478,6 +33486,7 @@ class HelpComponent {
          * @ignore
          */
         this.isInit = false;
+        this.isContextHelpAvailable$ = this.helpService.contextHelp.pipe(map(contextHelp => typeof contextHelp === 'string' ? !!contextHelp : contextHelp && docsService.isDocsEnabled()));
     }
     /**
      * The component is shown by default and therefore breaks e2e test. This is
@@ -33491,18 +33500,12 @@ class HelpComponent {
      * Builds the URL based on the src. The Base URL can be set in the application options docBaseUrl.
      * @param src The source of the help on the guide.
      * @param index This flag is used to call the index.json content of a guide. For example, "https://cumulocity.com/docs/cockpit/data-explorer/index.json".
+     * @returns The URL of the documentation page, or `null` if documentation links are switched off.
      */
     getUrl(src = '', index = false) {
-        let docsUrl;
-        try {
-            docsUrl =
-                typeof this.helpService.contextHelp.value === 'string'
-                    ? new URL(this.docsService.getUrlWithDocsVersion(this.helpService.contextHelp.value))
-                    : new URL(this.docsService.getBaseUrl());
-        }
-        catch (error) {
-            docsUrl = new URL(this.docsService.getBaseUrl());
-            console.warn(error);
+        const docsUrl = this.resolveBaseUrl();
+        if (!docsUrl) {
+            return null;
         }
         const [url, hashFragment] = src.split('#');
         this.sectionHeading = hashFragment;
@@ -33547,6 +33550,43 @@ class HelpComponent {
             this.icon = this.resolveIcon();
         }
     }
+    /**
+     * Resolves the base URL the help content is loaded from: either the one provided by the
+     * `contextHelp` option, or the documentation base URL. Returns `null` if neither of them
+     * yields a usable URL.
+     */
+    resolveBaseUrl() {
+        const contextHelp = this.helpService.contextHelp.value;
+        if (typeof contextHelp === 'string' && contextHelp) {
+            const contextHelpUrl = this.toAbsoluteUrl(this.docsService.getUrlWithDocsVersion(contextHelp));
+            if (contextHelpUrl) {
+                return contextHelpUrl;
+            }
+            console.warn(`Invalid contextHelp URL: "${contextHelp}", falling back to docsBaseUrl.`);
+        }
+        if (!this.docsService.isDocsEnabled()) {
+            return null;
+        }
+        return this.toAbsoluteUrl(this.docsService.getBaseUrl());
+    }
+    /**
+     * Turns a documentation base URL into an absolute one. A base URL relative to the host the
+     * application is served from (`docsBaseUrl: '/'`, which `DocsService.getBaseUrl` trims to an
+     * empty string) is resolved against that host. Returns `null` for anything that is not a valid
+     * URL.
+     */
+    toAbsoluteUrl(baseUrl) {
+        if (isNil(baseUrl)) {
+            return null;
+        }
+        const isRelativeToHost = baseUrl === '' || baseUrl.startsWith('/');
+        try {
+            return isRelativeToHost ? new URL(baseUrl, window.location.origin) : new URL(baseUrl);
+        }
+        catch {
+            return null;
+        }
+    }
     requestContent() {
         const req = new XMLHttpRequest();
         req.onreadystatechange = () => this.render(req);
@@ -33566,7 +33606,7 @@ class HelpComponent {
             const icon = Array.from(document.querySelector('nav .active i').classList).find(classes => classes.startsWith('c8y-icon-') || classes.startsWith('dlt-c8y-icon-'));
             return icon.replace('dlt-c8y-icon-', '').replace('c8y-icon-', 'c8y-');
         }
-        catch (ex) {
+        catch {
             return 'life-saver';
         }
     }
@@ -33587,7 +33627,7 @@ class HelpComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: HelpComponent, deps: [{ token: DocsService }, { token: HelpService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: HelpComponent, isStandalone: true, selector: "c8y-help", inputs: { src: "src", isCollapsed: "isCollapsed", priority: "priority", icon: "icon" }, ngImport: i0, template: "@if (!!(helpService.contextHelp | async)) {\n  <c8y-action-bar-item\n    [placement]=\"'right'\"\n    itemClass=\"pull-right m-l-md-8\"\n    [priority]=\"priority\"\n  >\n    <button\n      class=\"btn-help hidden-xs\"\n      [attr.aria-label]=\"'About this page' | translate\"\n      tooltip=\"{{ 'About this page' | translate }}\"\n      placement=\"left\"\n      container=\"body\"\n      aria-controls=\"collapseHelp\"\n      [attr.aria-expanded]=\"!isCollapsed\"\n      type=\"button\"\n      data-cy=\"help--help-btn\"\n      [delay]=\"750\"\n      (click)=\"toggle()\"\n      c8yProductExperience\n      [actionName]=\"isCollapsed ? 'helpOpened' : 'helpClosed'\"\n      [actionData]=\"{ src: src }\"\n    ></button>\n    <button\n      class=\"btn btn-link visible-xs\"\n      title=\"{{ 'About this page' | translate }}\"\n      aria-controls=\"collapseHelp\"\n      [attr.aria-expanded]=\"!isCollapsed\"\n      type=\"button\"\n      (click)=\"toggle()\"\n      c8yProductExperience\n      [actionName]=\"isCollapsed ? 'helpOpened' : 'helpClosed'\"\n      [actionData]=\"{ src: src }\"\n    >\n      <i\n        class=\"text-info\"\n        c8yIcon=\"help-outline\"\n      ></i>\n      {{ 'About this page' | translate }}\n    </button>\n  </c8y-action-bar-item>\n}\n\n<div\n  class=\"c8y-help-drawer\"\n  id=\"collapseHelp\"\n  [collapse]=\"isCollapsed\"\n  [isAnimated]=\"true\"\n  (collapsed)=\"onCollapsed()\"\n>\n  <div\n    [ngClass]=\"{ 'c8y-help-drawer-block': isInit }\"\n    #docOutlet\n    data-cy=\"c8y-help--c8y-help-drawer-block\"\n  >\n    @if (isLoading) {\n      <c8y-loading></c8y-loading>\n    } @else {\n      <div class=\"d-flex\">\n        <i\n          class=\"c8y-icon-duocolor icon-48\"\n          [c8yIcon]=\"!hasError ? icon : 'unlink'\"\n          [ngClass]=\"{ 'text-warning': hasError, 'text-muted': !hasError }\"\n        ></i>\n        @if (!hasError) {\n          <div class=\"p-l-16 flex-grow\">\n            @if (\n              !helpService.isSupportedLanguage() &&\n              !showLangWarning &&\n              !helpService.isWarningAlertViewed\n            ) {\n              <div class=\"alert alert-info m-b-16\">\n                <button\n                  class=\"close\"\n                  [attr.aria-label]=\"'Close' | translate\"\n                  type=\"button\"\n                  (click)=\"\n                    showLangWarning = !showLangWarning;\n                    helpService.isWarningAlertViewed = !helpService.isWarningAlertViewed\n                  \"\n                >\n                  <span aria-hidden=\"true\">\u00D7</span>\n                  <span class=\"sr-only\">Close</span>\n                </button>\n                <p>\n                  {{ 'Help content is only available in English.' | translate }}\n                </p>\n              </div>\n            }\n            <h4 class=\"text-bold text-primary p-t-16 m-b-16\">\n              {{ title }}\n            </h4>\n            <div\n              class=\"help-content\"\n              id=\"helpContent\"\n              [innerHTML]=\"sectionContent\"\n              data-cy=\"help--c8y-help-content\"\n            ></div>\n          </div>\n        }\n\n        @if (hasError) {\n          <div class=\"p-l-16 p-t-16 flex-grow\">\n            <h4\n              class=\"text-bold m-b-16\"\n              translate\n            >\n              Content couldn't be loaded.\n            </h4>\n            <div class=\"help-content\">\n              <p translate>Check internet connection or reload page.</p>\n            </div>\n          </div>\n        }\n      </div>\n    }\n  </div>\n  @if (!isLoading && !hasError) {\n    <div\n      class=\"c8y-help-drawer-footer animated fadeIn\"\n      style=\"animation-delay: 0.35s\"\n      data-cy=\"c8y-help--c8y-help-drawer-footer\"\n    >\n      <button\n        class=\"btn btn-default\"\n        [title]=\"'Close help' | translate\"\n        aria-controls=\"collapseHelp\"\n        [attr.aria-expanded]=\"!isCollapsed\"\n        type=\"button\"\n        data-cy=\"c8y-help--close-btn\"\n        (click)=\"toggle()\"\n        translate\n      >\n        Close\n      </button>\n      <a\n        class=\"btn btn-primary\"\n        href=\"{{ hasError ? getUrl() : getUrl(src) }}\"\n        target=\"_blank\"\n        data-cy=\"c8y-help--user-guide\"\n        rel=\"noopener noreferrer\"\n      >\n        @if (!hasError) {\n          <span translate>\n            Open the\n            <span>user documentation</span>\n          </span>\n        } @else {\n          <span translate>\n            Check the\n            <span>user documentation</span>\n          </span>\n        }\n      </a>\n    </div>\n  }\n</div>\n", dependencies: [{ kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "directive", type: ProductExperienceDirective, selector: "[c8yProductExperience]", inputs: ["actionName", "actionData", "inherit", "suppressDataOverriding"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i1$4.TooltipDirective, selector: "[tooltip], [tooltipHtml]", inputs: ["adaptivePosition", "tooltip", "placement", "triggers", "container", "containerClass", "boundariesElement", "isOpen", "isDisabled", "delay", "tooltipHtml", "tooltipPlacement", "tooltipIsOpen", "tooltipEnable", "tooltipAppendToBody", "tooltipAnimation", "tooltipClass", "tooltipContext", "tooltipPopupDelay", "tooltipFadeDuration", "tooltipTrigger"], outputs: ["tooltipChange", "onShown", "onHidden", "tooltipStateChanged"], exportAs: ["bs-tooltip"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "ngmodule", type: CollapseModule }, { kind: "directive", type: i2$3.CollapseDirective, selector: "[collapse]", inputs: ["display", "isAnimated", "collapse"], outputs: ["collapsed", "collapses", "expanded", "expands"], exportAs: ["bs-collapse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "progressLabel", "message"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: HelpComponent, isStandalone: true, selector: "c8y-help", inputs: { src: "src", isCollapsed: "isCollapsed", priority: "priority", icon: "icon" }, ngImport: i0, template: "@if (isContextHelpAvailable$ | async) {\n  <c8y-action-bar-item\n    [placement]=\"'right'\"\n    itemClass=\"pull-right m-l-md-8\"\n    [priority]=\"priority\"\n  >\n    <button\n      class=\"btn-help hidden-xs\"\n      [attr.aria-label]=\"'About this page' | translate\"\n      tooltip=\"{{ 'About this page' | translate }}\"\n      placement=\"left\"\n      container=\"body\"\n      aria-controls=\"collapseHelp\"\n      [attr.aria-expanded]=\"!isCollapsed\"\n      type=\"button\"\n      data-cy=\"help--help-btn\"\n      [delay]=\"750\"\n      (click)=\"toggle()\"\n      c8yProductExperience\n      [actionName]=\"isCollapsed ? 'helpOpened' : 'helpClosed'\"\n      [actionData]=\"{ src: src }\"\n    ></button>\n    <button\n      class=\"btn btn-link visible-xs\"\n      title=\"{{ 'About this page' | translate }}\"\n      aria-controls=\"collapseHelp\"\n      [attr.aria-expanded]=\"!isCollapsed\"\n      type=\"button\"\n      (click)=\"toggle()\"\n      c8yProductExperience\n      [actionName]=\"isCollapsed ? 'helpOpened' : 'helpClosed'\"\n      [actionData]=\"{ src: src }\"\n    >\n      <i\n        class=\"text-info\"\n        c8yIcon=\"help-outline\"\n      ></i>\n      {{ 'About this page' | translate }}\n    </button>\n  </c8y-action-bar-item>\n}\n\n<div\n  class=\"c8y-help-drawer\"\n  id=\"collapseHelp\"\n  [collapse]=\"isCollapsed\"\n  [isAnimated]=\"true\"\n  (collapsed)=\"onCollapsed()\"\n>\n  <div\n    [ngClass]=\"{ 'c8y-help-drawer-block': isInit }\"\n    #docOutlet\n    data-cy=\"c8y-help--c8y-help-drawer-block\"\n  >\n    @if (isLoading) {\n      <c8y-loading></c8y-loading>\n    } @else {\n      <div class=\"d-flex\">\n        <i\n          class=\"c8y-icon-duocolor icon-48\"\n          [c8yIcon]=\"!hasError ? icon : 'unlink'\"\n          [ngClass]=\"{ 'text-warning': hasError, 'text-muted': !hasError }\"\n        ></i>\n        @if (!hasError) {\n          <div class=\"p-l-16 flex-grow\">\n            @if (\n              !helpService.isSupportedLanguage() &&\n              !showLangWarning &&\n              !helpService.isWarningAlertViewed\n            ) {\n              <div class=\"alert alert-info m-b-16\">\n                <button\n                  class=\"close\"\n                  [attr.aria-label]=\"'Close' | translate\"\n                  type=\"button\"\n                  (click)=\"\n                    showLangWarning = !showLangWarning;\n                    helpService.isWarningAlertViewed = !helpService.isWarningAlertViewed\n                  \"\n                >\n                  <span aria-hidden=\"true\">\u00D7</span>\n                  <span class=\"sr-only\">Close</span>\n                </button>\n                <p>\n                  {{ 'Help content is only available in English.' | translate }}\n                </p>\n              </div>\n            }\n            <h4 class=\"text-bold text-primary p-t-16 m-b-16\">\n              {{ title }}\n            </h4>\n            <div\n              class=\"help-content\"\n              id=\"helpContent\"\n              [innerHTML]=\"sectionContent\"\n              data-cy=\"help--c8y-help-content\"\n            ></div>\n          </div>\n        }\n\n        @if (hasError) {\n          <div class=\"p-l-16 p-t-16 flex-grow\">\n            <h4\n              class=\"text-bold m-b-16\"\n              translate\n            >\n              Content couldn't be loaded.\n            </h4>\n            <div class=\"help-content\">\n              <p translate>Check internet connection or reload page.</p>\n            </div>\n          </div>\n        }\n      </div>\n    }\n  </div>\n  @if (!isLoading && !hasError) {\n    <div\n      class=\"c8y-help-drawer-footer animated fadeIn\"\n      style=\"animation-delay: 0.35s\"\n      data-cy=\"c8y-help--c8y-help-drawer-footer\"\n    >\n      <button\n        class=\"btn btn-default\"\n        [title]=\"'Close help' | translate\"\n        aria-controls=\"collapseHelp\"\n        [attr.aria-expanded]=\"!isCollapsed\"\n        type=\"button\"\n        data-cy=\"c8y-help--close-btn\"\n        (click)=\"toggle()\"\n        translate\n      >\n        Close\n      </button>\n      <a\n        class=\"btn btn-primary\"\n        href=\"{{ hasError ? getUrl() : getUrl(src) }}\"\n        target=\"_blank\"\n        data-cy=\"c8y-help--user-guide\"\n        rel=\"noopener noreferrer\"\n      >\n        @if (!hasError) {\n          <span translate>\n            Open the\n            <span>user documentation</span>\n          </span>\n        } @else {\n          <span translate>\n            Check the\n            <span>user documentation</span>\n          </span>\n        }\n      </a>\n    </div>\n  }\n</div>\n", dependencies: [{ kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "directive", type: ProductExperienceDirective, selector: "[c8yProductExperience]", inputs: ["actionName", "actionData", "inherit", "suppressDataOverriding"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i1$4.TooltipDirective, selector: "[tooltip], [tooltipHtml]", inputs: ["adaptivePosition", "tooltip", "placement", "triggers", "container", "containerClass", "boundariesElement", "isOpen", "isDisabled", "delay", "tooltipHtml", "tooltipPlacement", "tooltipIsOpen", "tooltipEnable", "tooltipAppendToBody", "tooltipAnimation", "tooltipClass", "tooltipContext", "tooltipPopupDelay", "tooltipFadeDuration", "tooltipTrigger"], outputs: ["tooltipChange", "onShown", "onHidden", "tooltipStateChanged"], exportAs: ["bs-tooltip"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "ngmodule", type: CollapseModule }, { kind: "directive", type: i2$3.CollapseDirective, selector: "[collapse]", inputs: ["display", "isAnimated", "collapse"], outputs: ["collapsed", "collapses", "expanded", "expands"], exportAs: ["bs-collapse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "progressLabel", "message"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: HelpComponent, decorators: [{
             type: Component,
@@ -33602,7 +33642,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImpo
                         C8yTranslateDirective,
                         C8yTranslatePipe,
                         AsyncPipe
-                    ], changeDetection: ChangeDetectionStrategy.Eager, template: "@if (!!(helpService.contextHelp | async)) {\n  <c8y-action-bar-item\n    [placement]=\"'right'\"\n    itemClass=\"pull-right m-l-md-8\"\n    [priority]=\"priority\"\n  >\n    <button\n      class=\"btn-help hidden-xs\"\n      [attr.aria-label]=\"'About this page' | translate\"\n      tooltip=\"{{ 'About this page' | translate }}\"\n      placement=\"left\"\n      container=\"body\"\n      aria-controls=\"collapseHelp\"\n      [attr.aria-expanded]=\"!isCollapsed\"\n      type=\"button\"\n      data-cy=\"help--help-btn\"\n      [delay]=\"750\"\n      (click)=\"toggle()\"\n      c8yProductExperience\n      [actionName]=\"isCollapsed ? 'helpOpened' : 'helpClosed'\"\n      [actionData]=\"{ src: src }\"\n    ></button>\n    <button\n      class=\"btn btn-link visible-xs\"\n      title=\"{{ 'About this page' | translate }}\"\n      aria-controls=\"collapseHelp\"\n      [attr.aria-expanded]=\"!isCollapsed\"\n      type=\"button\"\n      (click)=\"toggle()\"\n      c8yProductExperience\n      [actionName]=\"isCollapsed ? 'helpOpened' : 'helpClosed'\"\n      [actionData]=\"{ src: src }\"\n    >\n      <i\n        class=\"text-info\"\n        c8yIcon=\"help-outline\"\n      ></i>\n      {{ 'About this page' | translate }}\n    </button>\n  </c8y-action-bar-item>\n}\n\n<div\n  class=\"c8y-help-drawer\"\n  id=\"collapseHelp\"\n  [collapse]=\"isCollapsed\"\n  [isAnimated]=\"true\"\n  (collapsed)=\"onCollapsed()\"\n>\n  <div\n    [ngClass]=\"{ 'c8y-help-drawer-block': isInit }\"\n    #docOutlet\n    data-cy=\"c8y-help--c8y-help-drawer-block\"\n  >\n    @if (isLoading) {\n      <c8y-loading></c8y-loading>\n    } @else {\n      <div class=\"d-flex\">\n        <i\n          class=\"c8y-icon-duocolor icon-48\"\n          [c8yIcon]=\"!hasError ? icon : 'unlink'\"\n          [ngClass]=\"{ 'text-warning': hasError, 'text-muted': !hasError }\"\n        ></i>\n        @if (!hasError) {\n          <div class=\"p-l-16 flex-grow\">\n            @if (\n              !helpService.isSupportedLanguage() &&\n              !showLangWarning &&\n              !helpService.isWarningAlertViewed\n            ) {\n              <div class=\"alert alert-info m-b-16\">\n                <button\n                  class=\"close\"\n                  [attr.aria-label]=\"'Close' | translate\"\n                  type=\"button\"\n                  (click)=\"\n                    showLangWarning = !showLangWarning;\n                    helpService.isWarningAlertViewed = !helpService.isWarningAlertViewed\n                  \"\n                >\n                  <span aria-hidden=\"true\">\u00D7</span>\n                  <span class=\"sr-only\">Close</span>\n                </button>\n                <p>\n                  {{ 'Help content is only available in English.' | translate }}\n                </p>\n              </div>\n            }\n            <h4 class=\"text-bold text-primary p-t-16 m-b-16\">\n              {{ title }}\n            </h4>\n            <div\n              class=\"help-content\"\n              id=\"helpContent\"\n              [innerHTML]=\"sectionContent\"\n              data-cy=\"help--c8y-help-content\"\n            ></div>\n          </div>\n        }\n\n        @if (hasError) {\n          <div class=\"p-l-16 p-t-16 flex-grow\">\n            <h4\n              class=\"text-bold m-b-16\"\n              translate\n            >\n              Content couldn't be loaded.\n            </h4>\n            <div class=\"help-content\">\n              <p translate>Check internet connection or reload page.</p>\n            </div>\n          </div>\n        }\n      </div>\n    }\n  </div>\n  @if (!isLoading && !hasError) {\n    <div\n      class=\"c8y-help-drawer-footer animated fadeIn\"\n      style=\"animation-delay: 0.35s\"\n      data-cy=\"c8y-help--c8y-help-drawer-footer\"\n    >\n      <button\n        class=\"btn btn-default\"\n        [title]=\"'Close help' | translate\"\n        aria-controls=\"collapseHelp\"\n        [attr.aria-expanded]=\"!isCollapsed\"\n        type=\"button\"\n        data-cy=\"c8y-help--close-btn\"\n        (click)=\"toggle()\"\n        translate\n      >\n        Close\n      </button>\n      <a\n        class=\"btn btn-primary\"\n        href=\"{{ hasError ? getUrl() : getUrl(src) }}\"\n        target=\"_blank\"\n        data-cy=\"c8y-help--user-guide\"\n        rel=\"noopener noreferrer\"\n      >\n        @if (!hasError) {\n          <span translate>\n            Open the\n            <span>user documentation</span>\n          </span>\n        } @else {\n          <span translate>\n            Check the\n            <span>user documentation</span>\n          </span>\n        }\n      </a>\n    </div>\n  }\n</div>\n" }]
+                    ], changeDetection: ChangeDetectionStrategy.Eager, template: "@if (isContextHelpAvailable$ | async) {\n  <c8y-action-bar-item\n    [placement]=\"'right'\"\n    itemClass=\"pull-right m-l-md-8\"\n    [priority]=\"priority\"\n  >\n    <button\n      class=\"btn-help hidden-xs\"\n      [attr.aria-label]=\"'About this page' | translate\"\n      tooltip=\"{{ 'About this page' | translate }}\"\n      placement=\"left\"\n      container=\"body\"\n      aria-controls=\"collapseHelp\"\n      [attr.aria-expanded]=\"!isCollapsed\"\n      type=\"button\"\n      data-cy=\"help--help-btn\"\n      [delay]=\"750\"\n      (click)=\"toggle()\"\n      c8yProductExperience\n      [actionName]=\"isCollapsed ? 'helpOpened' : 'helpClosed'\"\n      [actionData]=\"{ src: src }\"\n    ></button>\n    <button\n      class=\"btn btn-link visible-xs\"\n      title=\"{{ 'About this page' | translate }}\"\n      aria-controls=\"collapseHelp\"\n      [attr.aria-expanded]=\"!isCollapsed\"\n      type=\"button\"\n      (click)=\"toggle()\"\n      c8yProductExperience\n      [actionName]=\"isCollapsed ? 'helpOpened' : 'helpClosed'\"\n      [actionData]=\"{ src: src }\"\n    >\n      <i\n        class=\"text-info\"\n        c8yIcon=\"help-outline\"\n      ></i>\n      {{ 'About this page' | translate }}\n    </button>\n  </c8y-action-bar-item>\n}\n\n<div\n  class=\"c8y-help-drawer\"\n  id=\"collapseHelp\"\n  [collapse]=\"isCollapsed\"\n  [isAnimated]=\"true\"\n  (collapsed)=\"onCollapsed()\"\n>\n  <div\n    [ngClass]=\"{ 'c8y-help-drawer-block': isInit }\"\n    #docOutlet\n    data-cy=\"c8y-help--c8y-help-drawer-block\"\n  >\n    @if (isLoading) {\n      <c8y-loading></c8y-loading>\n    } @else {\n      <div class=\"d-flex\">\n        <i\n          class=\"c8y-icon-duocolor icon-48\"\n          [c8yIcon]=\"!hasError ? icon : 'unlink'\"\n          [ngClass]=\"{ 'text-warning': hasError, 'text-muted': !hasError }\"\n        ></i>\n        @if (!hasError) {\n          <div class=\"p-l-16 flex-grow\">\n            @if (\n              !helpService.isSupportedLanguage() &&\n              !showLangWarning &&\n              !helpService.isWarningAlertViewed\n            ) {\n              <div class=\"alert alert-info m-b-16\">\n                <button\n                  class=\"close\"\n                  [attr.aria-label]=\"'Close' | translate\"\n                  type=\"button\"\n                  (click)=\"\n                    showLangWarning = !showLangWarning;\n                    helpService.isWarningAlertViewed = !helpService.isWarningAlertViewed\n                  \"\n                >\n                  <span aria-hidden=\"true\">\u00D7</span>\n                  <span class=\"sr-only\">Close</span>\n                </button>\n                <p>\n                  {{ 'Help content is only available in English.' | translate }}\n                </p>\n              </div>\n            }\n            <h4 class=\"text-bold text-primary p-t-16 m-b-16\">\n              {{ title }}\n            </h4>\n            <div\n              class=\"help-content\"\n              id=\"helpContent\"\n              [innerHTML]=\"sectionContent\"\n              data-cy=\"help--c8y-help-content\"\n            ></div>\n          </div>\n        }\n\n        @if (hasError) {\n          <div class=\"p-l-16 p-t-16 flex-grow\">\n            <h4\n              class=\"text-bold m-b-16\"\n              translate\n            >\n              Content couldn't be loaded.\n            </h4>\n            <div class=\"help-content\">\n              <p translate>Check internet connection or reload page.</p>\n            </div>\n          </div>\n        }\n      </div>\n    }\n  </div>\n  @if (!isLoading && !hasError) {\n    <div\n      class=\"c8y-help-drawer-footer animated fadeIn\"\n      style=\"animation-delay: 0.35s\"\n      data-cy=\"c8y-help--c8y-help-drawer-footer\"\n    >\n      <button\n        class=\"btn btn-default\"\n        [title]=\"'Close help' | translate\"\n        aria-controls=\"collapseHelp\"\n        [attr.aria-expanded]=\"!isCollapsed\"\n        type=\"button\"\n        data-cy=\"c8y-help--close-btn\"\n        (click)=\"toggle()\"\n        translate\n      >\n        Close\n      </button>\n      <a\n        class=\"btn btn-primary\"\n        href=\"{{ hasError ? getUrl() : getUrl(src) }}\"\n        target=\"_blank\"\n        data-cy=\"c8y-help--user-guide\"\n        rel=\"noopener noreferrer\"\n      >\n        @if (!hasError) {\n          <span translate>\n            Open the\n            <span>user documentation</span>\n          </span>\n        } @else {\n          <span translate>\n            Check the\n            <span>user documentation</span>\n          </span>\n        }\n      </a>\n    </div>\n  }\n</div>\n" }]
         }], ctorParameters: () => [{ type: DocsService }, { type: HelpService }], propDecorators: { src: [{
                 type: Input
             }], isCollapsed: [{