@c8y/ngx-components 1023.71.1 → 1023.75.1

package/fesm2022/c8y-ngx-components.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Input, Directive, Pipe, createEnvironmentInjector, InjectionToken, Optional, Inject, Injectable, EventEmitter, NgModule, LOCALE_ID, NgModuleRef, createNgModule, isDevMode, inject, DOCUMENT, EnvironmentInjector, Injector, HostListener, Component, HostBinding, Output, forwardRef, DestroyRef, ViewChild, SecurityContext, TemplateRef, provideAppInitializer, ElementRef, Self, SkipSelf, Attribute, ContentChild, ContentChildren, ViewContainerRef, ViewChildren, viewChild, effect, createComponent, runInInjectionContext, importProvidersFrom, ChangeDetectionStrategy, SimpleChange, reflectComponentType, signal, computed, Type, input, output } from '@angular/core';
+import { Input, Directive, Pipe, createEnvironmentInjector, InjectionToken, Optional, Inject, Injectable, EventEmitter, NgModule, LOCALE_ID, NgModuleRef, createNgModule, isDevMode, inject, DOCUMENT, EnvironmentInjector, Injector, HostListener, Component, HostBinding, Output, forwardRef, DestroyRef, ViewChild, SecurityContext, TemplateRef, provideAppInitializer, ElementRef, Self, SkipSelf, Attribute, ContentChild, ContentChildren, ViewContainerRef, input, output, ChangeDetectorRef, effect, ChangeDetectionStrategy, ViewChildren, viewChild, createComponent, runInInjectionContext, importProvidersFrom, SimpleChange, reflectComponentType, signal, computed, Type } from '@angular/core';
 import * as i1$3 from 'ngx-bootstrap/dropdown';
 import { BsDropdownDirective, BsDropdownModule } from 'ngx-bootstrap/dropdown';
 import { ConfigurableFocusTrapFactory, CdkTrapFocus, A11yModule } from '@angular/cdk/a11y';
@@ -39,7 +39,7 @@ import { CdkStepper, STEP_STATE, CdkStep, CdkStepperModule, STEPPER_GLOBAL_OPTIO
 import * as i1$7 from 'ngx-bootstrap/modal';
 import { ModalModule as ModalModule$1, BsModalRef } from 'ngx-bootstrap/modal';
 import * as i1$8 from '@angular/forms';
-import { FormsModule as FormsModule$1, Validators, NG_VALUE_ACCESSOR, NG_VALIDATORS, CheckboxControlValueAccessor, FormControl, NgModel, FormControlName, ReactiveFormsModule, NgForm, ControlContainer, FormArray, NgControl, FormGroup, FormBuilder } from '@angular/forms';
+import { FormsModule as FormsModule$1, Validators, NG_VALUE_ACCESSOR, NG_VALIDATORS, CheckboxControlValueAccessor, FormControl, NgModel, FormControlName, NgControl, ReactiveFormsModule, NgForm, ControlContainer, FormArray, FormGroup, FormBuilder } from '@angular/forms';
 import { TOKEN_KEY, TFATOKEN_KEY, getThemePreference, setThemePreference, applyTheme, mergeRemotes, removeRemotes } from '@c8y/bootstrap';
 import * as i1$9 from 'ngx-bootstrap/popover';
 import { PopoverModule, PopoverDirective } from 'ngx-bootstrap/popover';
@@ -4241,10 +4241,11 @@ class ManagedObjectRealtimeService extends RealtimeService {
         return '/managedobjects/*';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ManagedObjectRealtimeService, deps: [{ token: RealtimeSubjectService }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ManagedObjectRealtimeService }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ManagedObjectRealtimeService, providedIn: 'root' }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ManagedObjectRealtimeService, decorators: [{
-            type: Injectable
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [{ type: RealtimeSubjectService }] });
 
 /**
@@ -5018,7 +5019,14 @@ class C8yComponentOutlet {
                     injector,
                     environmentInjector: this._newEnvInjector
                 });
-                Object.assign(this._componentRef.instance, this.c8yComponentOutletInitialState || {});
+                for (const [key, value] of Object.entries(this.c8yComponentOutletInitialState || {})) {
+                    try {
+                        this._componentRef.setInput(key, value);
+                    }
+                    catch {
+                        this._componentRef.instance[key] = value;
+                    }
+                }
             }
         }
     }
@@ -18843,21 +18851,22 @@ class MessagesComponent {
         this.show = {};
         this.defaults = ValidationPattern.messages;
         this.helpMessage = '';
+        this.additionalMessages = null;
         this.messages = [];
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         this.messageMap = {};
     }
     ngAfterContentInit() {
-        this.messageMap = Object.assign({}, this.defaults, this.customMessages.reduce((messages, directive) => {
-            messages[directive.name] = directive.text;
-            return messages;
-        }, {}));
+        this.rebuildMessageMap();
     }
     changeVisibility(show) {
         this.show = show;
         this.ngOnChanges();
     }
-    ngOnChanges() {
+    ngOnChanges(changes) {
+        if (changes?.['additionalMessages']) {
+            this.rebuildMessageMap();
+        }
         if (this.show) {
             this.messages = Object.keys(this.show)
                 .map(key => this.toMessage(key, this.show[key]))
@@ -18868,10 +18877,22 @@ class MessagesComponent {
             this.messages = [];
         }
     }
+    rebuildMessageMap() {
+        this.messageMap = Object.assign({}, this.defaults, this.customMessages?.reduce((messages, directive) => {
+            messages[directive.name] = directive.text;
+            return messages;
+        }, {}), this.additionalMessages?.reduce((messages, msg) => {
+            messages[msg.name] = msg.text;
+            return messages;
+        }, {}));
+    }
     toMessage(key, value) {
-        // First check customMessages directly for the most up-to-date text
+        // First check additionalMessages and customMessages directly for the most up-to-date text
         // (handles async binding updates that occur after ngAfterContentInit)
-        const customMessage = this.customMessages?.find(({ name }) => name === key);
+        const additionalMessage = this.additionalMessages
+            ? Array.from(this.additionalMessages).find(({ name }) => name === key)
+            : null;
+        const customMessage = additionalMessage ?? this.customMessages?.find(({ name }) => name === key);
         let message = customMessage?.text || this.messageMap[key];
         if ((!message || message === ValidationPattern.messages.pattern) &&
             key === 'pattern' &&
@@ -18880,7 +18901,10 @@ class MessagesComponent {
             const foundPattern = Object.keys(ValidationPattern.rules).find(tmp => ValidationPattern.rules[tmp].pattern?.source === pattern);
             if (foundPattern) {
                 key = foundPattern;
-                const foundCustomMessage = this.customMessages?.find(({ name }) => name === key);
+                const foundAdditional = this.additionalMessages
+                    ? Array.from(this.additionalMessages).find(({ name }) => name === key)
+                    : null;
+                const foundCustomMessage = foundAdditional ?? this.customMessages?.find(({ name }) => name === key);
                 message = foundCustomMessage?.text || this.messageMap[key];
             }
         }
@@ -18890,7 +18914,7 @@ class MessagesComponent {
         return this.translateService.instant(message, value);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: MessagesComponent, deps: [{ token: i1$1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.18", type: MessagesComponent, isStandalone: true, selector: "c8y-messages", inputs: { show: "show", defaults: "defaults", helpMessage: "helpMessage" }, queries: [{ propertyName: "customMessages", predicate: MessageDirective }], usesOnChanges: true, ngImport: i0, template: "<small class=\"form-control-feedback-message\">\n  @for (msg of messages; track msg) {\n    <div class=\"d-block\">\n      {{ msg | translate }}\n    </div>\n  }\n  @if (!messages.length && helpMessage) {\n    <div class=\"help-block\">\n      {{ helpMessage | translate }}\n    </div>\n  }\n  <ng-content></ng-content>\n</small>\n", dependencies: [{ kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.18", type: MessagesComponent, isStandalone: true, selector: "c8y-messages", inputs: { show: "show", defaults: "defaults", helpMessage: "helpMessage", additionalMessages: "additionalMessages" }, queries: [{ propertyName: "customMessages", predicate: MessageDirective }], usesOnChanges: true, ngImport: i0, template: "<small class=\"form-control-feedback-message\">\n  @for (msg of messages; track msg) {\n    <div class=\"d-block\">\n      {{ msg | translate }}\n    </div>\n  }\n  @if (!messages.length && helpMessage) {\n    <div class=\"help-block\">\n      {{ helpMessage | translate }}\n    </div>\n  }\n  <ng-content></ng-content>\n</small>\n", dependencies: [{ kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: MessagesComponent, decorators: [{
             type: Component,
@@ -18901,6 +18925,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
                 type: Input
             }], helpMessage: [{
                 type: Input
+            }], additionalMessages: [{
+                type: Input
             }], customMessages: [{
                 type: ContentChildren,
                 args: [MessageDirective]
@@ -18998,7 +19024,7 @@ class FormGroupComponent {
         this.destroyed$.complete();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: FormGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: FormGroupComponent, isStandalone: true, selector: "c8y-form-group", inputs: { hasError: "hasError", hasWarning: "hasWarning", hasSuccess: "hasSuccess", novalidation: "novalidation", status: "status" }, host: { properties: { "class.has-error": "this.error", "class.has-warning": "this.warning", "class.has-success": "this.success" }, classAttribute: "form-group" }, queries: [{ propertyName: "customErrorMessage", first: true, predicate: MessagesComponent, descendants: true }, { propertyName: "model", first: true, predicate: NgModel, descendants: true, static: true }, { propertyName: "formControlName", first: true, predicate: FormControlName, descendants: true, static: true }], ngImport: i0, template: "<ng-content></ng-content>\n<c8y-messages *ngIf=\"!customErrorMessage\" [show]=\"errors\"></c8y-messages>\n", dependencies: [{ kind: "component", type: MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: FormGroupComponent, isStandalone: true, selector: "c8y-form-group", inputs: { hasError: "hasError", hasWarning: "hasWarning", hasSuccess: "hasSuccess", novalidation: "novalidation", status: "status" }, host: { properties: { "class.has-error": "this.error", "class.has-warning": "this.warning", "class.has-success": "this.success" }, classAttribute: "form-group" }, queries: [{ propertyName: "customErrorMessage", first: true, predicate: MessagesComponent, descendants: true }, { propertyName: "model", first: true, predicate: NgModel, descendants: true, static: true }, { propertyName: "formControlName", first: true, predicate: FormControlName, descendants: true, static: true }], ngImport: i0, template: "<ng-content></ng-content>\n<c8y-messages *ngIf=\"!customErrorMessage\" [show]=\"errors\"></c8y-messages>\n", dependencies: [{ kind: "component", type: MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage", "additionalMessages"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: FormGroupComponent, decorators: [{
             type: Component,
@@ -19035,6 +19061,195 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
                 args: [FormControlName, { static: true }]
             }] } });
 
+/**
+ * Inline editable input field that displays a value as plain text and switches
+ * to an edit mode with save and cancel actions.
+ *
+ * Use this component when a value should be editable in place without navigating
+ * away from the current view. Supports small and large size variants and
+ * announces state changes to screen readers via an `aria-live` region.
+ *
+ * Implements `ControlValueAccessor` so it can be used with `ngModel`,
+ * `formControl`, or `formControlName`. The value is propagated to the form
+ * control only when the user confirms an edit (save), not on every keystroke.
+ *
+ * Supports synchronous and asynchronous validators via the `validators` and
+ * `asyncValidators` inputs. Validation errors are shown while the user is
+ * editing; saving is blocked when the typed value is invalid or a validator
+ * is pending.
+ *
+ * Custom error messages can be projected as `<c8y-message>` children:
+ *
+ * ```html
+ * <c8y-input-group-editable
+ *   [ngModel]="name"
+ *   (ngModelChange)="saveName($event)"
+ *   [validators]="[myValidator]"
+ *   ariaLabel="Name"
+ * >
+ *   <c8y-message name="myError" text="Value is invalid."></c8y-message>
+ * </c8y-input-group-editable>
+ * ```
+ */
+class InputGroupEditableComponent {
+    constructor() {
+        /** Accessible label applied via `aria-label` to both the `role="group"` container and the inner `<input>`, required for accessibility. */
+        this.ariaLabel = input.required(...(ngDevMode ? [{ debugName: "ariaLabel" }] : []));
+        /** The `name` attribute forwarded to the underlying `<input>` element. */
+        this.name = input('', ...(ngDevMode ? [{ debugName: "name" }] : []));
+        /** Controls the size of the input group. Use `'sm'` for small or `'lg'` for large. Defaults to standard size. */
+        this.size = input('', ...(ngDevMode ? [{ debugName: "size" }] : []));
+        /** Placeholder text shown inside the input when the value is empty. */
+        this.placeholder = input('', ...(ngDevMode ? [{ debugName: "placeholder" }] : []));
+        /** Synchronous validators evaluated against the live typed value. */
+        this.validators = input(null, ...(ngDevMode ? [{ debugName: "validators" }] : []));
+        /** Asynchronous validators evaluated against the live typed value. */
+        this.asyncValidators = input(null, ...(ngDevMode ? [{ debugName: "asyncValidators" }] : []));
+        /** Emitted when the user confirms an edit. Provides the new string value. */
+        this.save = output();
+        /** Emitted when the user cancels an edit via the cancel button or the Escape key. */
+        this.cancel = output();
+        /** Message broadcast to the aria-live region after save or cancel ('Saved' / 'Cancelled'). */
+        this.liveMessage = '';
+        /** Validation errors to display; non-null only while the user is actively editing and the value is invalid. */
+        this.errors = null;
+        /** Internal form control used to run sync and async validators against the live typed value. */
+        this.internalControl = new FormControl('');
+        this.committedValue = '';
+        this.onChange = null;
+        this.onTouched = null;
+        this.statusSub = null;
+        this.outerValidator = null;
+        this.outerAsyncValidator = null;
+        this.cdr = inject(ChangeDetectorRef);
+        this.injector = inject(Injector);
+        effect(() => {
+            this.syncInternalValidators();
+        });
+    }
+    /** Whether the save action should be blocked. */
+    get isSaveDisabled() {
+        return (this.internalControl.disabled ||
+            this.internalControl.status === 'INVALID' ||
+            this.internalControl.status === 'PENDING');
+    }
+    // --- ControlValueAccessor ---
+    writeValue(value) {
+        this.committedValue = value ?? '';
+        this.errors = null;
+        this.internalControl.reset(this.committedValue, { emitEvent: false });
+        this.cdr.markForCheck();
+    }
+    registerOnChange(fn) {
+        this.onChange = fn;
+    }
+    registerOnTouched(fn) {
+        this.onTouched = fn;
+    }
+    setDisabledState(isDisabled) {
+        isDisabled
+            ? this.internalControl.disable({ emitEvent: false })
+            : this.internalControl.enable({ emitEvent: false });
+        this.cdr.markForCheck();
+    }
+    // --- Lifecycle ---
+    ngOnInit() {
+        this.statusSub = this.internalControl.statusChanges.subscribe(() => {
+            this.errors = this.internalControl.dirty ? this.internalControl.errors : null;
+            this.cdr.markForCheck();
+        });
+    }
+    ngAfterContentInit() {
+        const ngControl = this.injector.get(NgControl, null);
+        if (ngControl?.control) {
+            this.outerValidator = ngControl.control.validator;
+            this.outerAsyncValidator = ngControl.control.asyncValidator;
+            this.syncInternalValidators();
+        }
+    }
+    ngOnDestroy() {
+        clearTimeout(this.announceTimeout);
+        this.statusSub?.unsubscribe();
+    }
+    // --- Event handlers ---
+    syncInternalValidators() {
+        const inputV = this.validators();
+        const syncList = [
+            ...(this.outerValidator ? [this.outerValidator] : []),
+            ...(Array.isArray(inputV) ? inputV : inputV ? [inputV] : [])
+        ];
+        this.internalControl.setValidators(syncList.length ? syncList : null);
+        const inputAv = this.asyncValidators();
+        const asyncList = [
+            ...(this.outerAsyncValidator ? [this.outerAsyncValidator] : []),
+            ...(Array.isArray(inputAv) ? inputAv : inputAv ? [inputAv] : [])
+        ];
+        this.internalControl.setAsyncValidators(asyncList.length ? asyncList : null);
+        this.internalControl.updateValueAndValidity({ emitEvent: false });
+    }
+    onSave(inputEl) {
+        if (this.isSaveDisabled) {
+            return;
+        }
+        const value = this.internalControl.value ?? '';
+        this.committedValue = value;
+        this.errors = null;
+        this.save.emit(value);
+        this.onChange?.(value);
+        this.onTouched?.();
+        this.internalControl.reset(value, { emitEvent: false });
+        this.announce(gettext$1('Saved'));
+        inputEl.blur();
+    }
+    onCancel() {
+        this.errors = null;
+        this.internalControl.reset(this.committedValue, { emitEvent: false });
+        this.cancel.emit();
+        this.announce(gettext$1('Cancelled'));
+    }
+    onEscape(inputEl) {
+        this.onCancel();
+        inputEl.blur();
+    }
+    announce(message) {
+        // Clear then defer: resetting liveMessage first forces the aria-live region to
+        // re-announce even when the same message is emitted twice in a row.
+        clearTimeout(this.announceTimeout);
+        this.liveMessage = '';
+        this.announceTimeout = setTimeout(() => {
+            this.liveMessage = message;
+            this.cdr.markForCheck();
+        }, 0);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: InputGroupEditableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.18", type: InputGroupEditableComponent, isStandalone: true, selector: "c8y-input-group-editable", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, validators: { classPropertyName: "validators", publicName: "validators", isSignal: true, isRequired: false, transformFunction: null }, asyncValidators: { classPropertyName: "asyncValidators", publicName: "asyncValidators", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { save: "save", cancel: "cancel" }, host: { classAttribute: "d-contents" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => InputGroupEditableComponent),
+                multi: true
+            }
+        ], queries: [{ propertyName: "customErrorMessages", predicate: MessageDirective }], ngImport: i0, template: "<c8y-form-group [status]=\"!!errors ? 'error' : ''\">\n  <div\n    class=\"input-group input-group-editable\"\n    [class.input-group-sm]=\"size() === 'sm'\"\n    [class.input-group-lg]=\"size() === 'lg'\"\n    [attr.aria-label]=\"ariaLabel() | translate\"\n    role=\"group\"\n  >\n    <input\n      class=\"form-control\"\n      [attr.aria-label]=\"ariaLabel() | translate\"\n      [attr.name]=\"name() || null\"\n      [placeholder]=\"(placeholder() | translate) || ''\"\n      [formControl]=\"internalControl\"\n      (keydown.enter)=\"onSave(inputEl)\"\n      (keydown.escape)=\"onEscape(inputEl)\"\n      #inputEl\n    />\n    <!-- Edit mode indicator hook used by _input-groups.scss -->\n    <span aria-hidden=\"true\"></span>\n    @if (!internalControl.disabled) {\n      <div class=\"input-group-btn\">\n        <button\n          class=\"btn btn-clean\"\n          [title]=\"'Cancel' | translate\"\n          [attr.aria-label]=\"'Cancel' | translate\"\n          type=\"button\"\n          (click)=\"onCancel()\"\n        >\n          <i\n            c8yIcon=\"times\"\n            aria-hidden=\"true\"\n          ></i>\n        </button>\n        <button\n          class=\"btn btn-clean text-primary\"\n          [title]=\"'Save' | translate\"\n          [attr.aria-label]=\"'Save' | translate\"\n          type=\"button\"\n          [disabled]=\"isSaveDisabled\"\n          (click)=\"onSave(inputEl)\"\n        >\n          <i\n            c8yIcon=\"check\"\n            aria-hidden=\"true\"\n          ></i>\n        </button>\n      </div>\n    }\n    <span\n      class=\"sr-only\"\n      aria-live=\"polite\"\n      aria-atomic=\"true\"\n      >{{ liveMessage | translate }}</span\n    >\n  </div>\n  <c8y-messages\n    [show]=\"errors\"\n    [additionalMessages]=\"customErrorMessages\"\n  ></c8y-messages>\n</c8y-form-group>\n", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$8.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$8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$8.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage", "additionalMessages"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: InputGroupEditableComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'c8y-input-group-editable', host: { class: 'd-contents' }, standalone: true, imports: [
+                        ReactiveFormsModule,
+                        C8yTranslatePipe,
+                        IconDirective,
+                        MessagesComponent,
+                        FormGroupComponent
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => InputGroupEditableComponent),
+                            multi: true
+                        }
+                    ], template: "<c8y-form-group [status]=\"!!errors ? 'error' : ''\">\n  <div\n    class=\"input-group input-group-editable\"\n    [class.input-group-sm]=\"size() === 'sm'\"\n    [class.input-group-lg]=\"size() === 'lg'\"\n    [attr.aria-label]=\"ariaLabel() | translate\"\n    role=\"group\"\n  >\n    <input\n      class=\"form-control\"\n      [attr.aria-label]=\"ariaLabel() | translate\"\n      [attr.name]=\"name() || null\"\n      [placeholder]=\"(placeholder() | translate) || ''\"\n      [formControl]=\"internalControl\"\n      (keydown.enter)=\"onSave(inputEl)\"\n      (keydown.escape)=\"onEscape(inputEl)\"\n      #inputEl\n    />\n    <!-- Edit mode indicator hook used by _input-groups.scss -->\n    <span aria-hidden=\"true\"></span>\n    @if (!internalControl.disabled) {\n      <div class=\"input-group-btn\">\n        <button\n          class=\"btn btn-clean\"\n          [title]=\"'Cancel' | translate\"\n          [attr.aria-label]=\"'Cancel' | translate\"\n          type=\"button\"\n          (click)=\"onCancel()\"\n        >\n          <i\n            c8yIcon=\"times\"\n            aria-hidden=\"true\"\n          ></i>\n        </button>\n        <button\n          class=\"btn btn-clean text-primary\"\n          [title]=\"'Save' | translate\"\n          [attr.aria-label]=\"'Save' | translate\"\n          type=\"button\"\n          [disabled]=\"isSaveDisabled\"\n          (click)=\"onSave(inputEl)\"\n        >\n          <i\n            c8yIcon=\"check\"\n            aria-hidden=\"true\"\n          ></i>\n        </button>\n      </div>\n    }\n    <span\n      class=\"sr-only\"\n      aria-live=\"polite\"\n      aria-atomic=\"true\"\n      >{{ liveMessage | translate }}</span\n    >\n  </div>\n  <c8y-messages\n    [show]=\"errors\"\n    [additionalMessages]=\"customErrorMessages\"\n  ></c8y-messages>\n</c8y-form-group>\n" }]
+        }], ctorParameters: () => [], propDecorators: { ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: true }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], validators: [{ type: i0.Input, args: [{ isSignal: true, alias: "validators", required: false }] }], asyncValidators: [{ type: i0.Input, args: [{ isSignal: true, alias: "asyncValidators", required: false }] }], save: [{ type: i0.Output, args: ["save"] }], cancel: [{ type: i0.Output, args: ["cancel"] }], customErrorMessages: [{
+                type: ContentChildren,
+                args: [MessageDirective]
+            }] } });
+
 class InputGroupListComponent {
     constructor() {
         this.plus = true;
@@ -19742,6 +19957,7 @@ class FormsModule {
             DefaultValidationDirective,
             MinValidationDirective,
             MaxValidationDirective,
+            InputGroupEditableComponent,
             InputGroupListComponent,
             InputGroupListContainerDirective,
             JsonValidationPrettifierDirective,
@@ -19764,6 +19980,7 @@ class FormsModule {
             FormGroupComponent,
             MessageDirective,
             MessagesComponent,
+            InputGroupEditableComponent,
             InputGroupListComponent,
             InputGroupListContainerDirective,
             JsonValidationPrettifierDirective,
@@ -19784,6 +20001,7 @@ class FormsModule {
             ReactiveFormsModule,
             PopoverModule,
             TooltipModule,
+            InputGroupEditableComponent,
             InputGroupListComponent,
             IpRangeInputListComponent, FormsModule$1] }); }
 }
@@ -19803,6 +20021,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
                         DefaultValidationDirective,
                         MinValidationDirective,
                         MaxValidationDirective,
+                        InputGroupEditableComponent,
                         InputGroupListComponent,
                         InputGroupListContainerDirective,
                         JsonValidationPrettifierDirective,
@@ -19828,6 +20047,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
                         FormGroupComponent,
                         MessageDirective,
                         MessagesComponent,
+                        InputGroupEditableComponent,
                         InputGroupListComponent,
                         InputGroupListContainerDirective,
                         JsonValidationPrettifierDirective,
@@ -20867,7 +21087,7 @@ class PasswordConfirmModalComponent {
         this.modal._dismiss();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", 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: "20.3.18", 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$8.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$8.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$8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$8.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$8.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$8.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: 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"] }, { kind: "directive", type: MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", 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$8.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$8.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$8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$8.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$8.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$8.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: 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" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: PasswordConfirmModalComponent, decorators: [{
             type: Component,
@@ -20902,7 +21122,7 @@ class CurrentPasswordModalComponent {
         this.modal.hide();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CurrentPasswordModalComponent, deps: [{ token: i1$7.BsModalRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", 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$8.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$8.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$8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$8.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$8.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$8.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: 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"] }, { kind: "directive", type: MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", 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$8.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$8.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$8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$8.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$8.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$8.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: 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" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: CurrentPasswordModalComponent, decorators: [{
             type: Component,
@@ -25301,7 +25521,7 @@ class FilePickerFormControlComponent {
                 multi: true,
                 useExisting: forwardRef(() => FilePickerFormControlComponent)
             }
-        ], viewQueries: [{ propertyName: "filePlaceholder", first: true, predicate: ["filePlaceholder"], descendants: true, static: true }], ngImport: i0, template: "<c8y-form-group class=\"m-0\">\n  <div\n    class=\"file-picker-drop-zone\"\n    [class.dragging]=\"isDropAreaEnlarged$ | async\"\n    tabindex=\"0\"\n  >\n    <div\n      class=\"file-placeholder pointer\"\n      [class.drag-over]=\"isDraggingOverFilePlaceholder$ | async\"\n      #filePlaceholder\n      (drop)=\"onDrop($event)\"\n      (click)=\"!uploadInProgress && picker.click()\"\n    >\n      <div *ngIf=\"validateExtensionOnDrag && (isDraggedFileUnsupported$ | async); else defaultHint\">\n        <p class=\"form-control-static text-truncate\">\n          <i\n            class=\"text-warning m-r-4\"\n            c8yIcon=\"exclamation-triangle\"\n          ></i>\n          <span>{{ 'At least one file is of an unsupported type.' | translate }}</span>\n        </p>\n      </div>\n      <ng-template #defaultHint>\n        <div\n          class=\"hint-placeholder\"\n          *ngIf=\"!uploadInProgress\"\n        >\n          <i c8yIcon=\"upload\"></i>\n          <p>\n            <b>{{ 'Drop files here or click to browse' | translate }}</b>\n          </p>\n          <p\n            class=\"m-t-8 text-12 text-muted\"\n            *ngIf=\"accept\"\n          >\n            {{ 'Supported file types:' | translate }} {{ accept }}\n          </p>\n          <c8y-form-group>\n            <c8y-messages\n              class=\"has-error\"\n              *ngIf=\"\n                controlInstance.touched && controlInstance.errors && controlInstance.errors\n                  | filterNonArrayValidationErrors\n              \"\n            >\n              <c8y-message\n                *ngFor=\"\n                  let error of controlInstance.errors | filterNonArrayValidationErrors | keyvalue\n                \"\n              >\n                {{ error.key | humanizeValidationMessage | translate: error.value }}\n              </c8y-message>\n            </c8y-messages>\n          </c8y-form-group>\n        </div>\n        <div\n          class=\"d-flex d-col p-4 flex-center\"\n          *ngIf=\"uploadInProgress\"\n        >\n          <c8y-loading></c8y-loading>\n          <p class=\"m-t-auto m-b-auto m-r-8 text-center\">\n            {{ loadingMessage | translate }}\n          </p>\n        </div>\n      </ng-template>\n    </div>\n  </div>\n  <div class=\"file-container\">\n    <ul class=\"list-group\">\n      <ng-container *ngFor=\"let file of droppedFiles; let i = index\">\n        <li class=\"list-group-item p-4 a-i-center\">\n          <div class=\"d-flex a-i-center\">\n            <i\n              class=\"icon-20 m-r-8\"\n              [c8yIcon]=\"file | fileIcon\"\n            ></i>\n            <div\n              class=\"m-r-16 text-truncate\"\n              [title]=\"file.name\"\n            >\n              {{ file.name }}\n            </div>\n            <div class=\"m-r-16 text-nowrap\">({{ file.size | bytes }})</div>\n            <div class=\"m-l-auto\">\n              <button\n                class=\"btn btn-dot btn-dot--danger\"\n                title=\"{{ 'Remove' | translate }}\"\n                [attr.aria-label]=\"'Remove' | translate\"\n                type=\"button\"\n                *ngIf=\"!uploadInProgress\"\n                (click)=\"deleteAt(i)\"\n              >\n                <i c8yIcon=\"minus-circle\"></i>\n              </button>\n            </div>\n          </div>\n          <c8y-form-group>\n            <c8y-messages class=\"has-error\">\n              <c8y-message\n                *ngFor=\"\n                  let error of controlInstance.errors | extractArrayValidationErrors: i | keyvalue\n                \"\n              >\n                {{ error.key | humanizeValidationMessage | translate: error.value }}\n              </c8y-message>\n            </c8y-messages>\n          </c8y-form-group>\n\n          <div\n            class=\"d-block\"\n            data-cy=\"c8y-file-picker-form-control--upload-progress-bar\"\n            *ngIf=\"uploadInProgress\"\n          >\n            <div\n              class=\"progress progress-striped active\"\n              *ngIf=\"uploadProgress\"\n            >\n              <div\n                class=\"progress-bar progress-bar-info\"\n                [style.width]=\"uploadProgress[i].percentage + '%'\"\n                aria-valuenow=\"0\"\n                aria-valuemin=\"0\"\n                aria-valuemax=\"100\"\n                role=\"progressbar\"\n              >\n                {{ uploadProgress[i].percentage }}%\n              </div>\n            </div>\n          </div>\n        </li>\n      </ng-container>\n    </ul>\n  </div>\n  <input\n    class=\"hidden\"\n    id=\"file\"\n    type=\"file\"\n    #picker\n    (change)=\"filesSelected($event)\"\n    [accept]=\"acceptedExts\"\n    [multiple]=\"maxAllowedFiles > 1\"\n  />\n</c8y-form-group>\n", dependencies: [{ kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "pipe", type: ExtractArrayValidationErrorsPipe, name: "extractArrayValidationErrors" }, { kind: "pipe", type: FilterNonArrayValidationErrorsPipe, name: "filterNonArrayValidationErrors" }, { kind: "pipe", type: HumanizeValidationMessagePipe, name: "humanizeValidationMessage" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: BytesPipe, name: "bytes" }, { kind: "pipe", type: GenericFileIconPipe, name: "fileIcon" }] }); }
+        ], viewQueries: [{ propertyName: "filePlaceholder", first: true, predicate: ["filePlaceholder"], descendants: true, static: true }], ngImport: i0, template: "<c8y-form-group class=\"m-0\">\n  <div\n    class=\"file-picker-drop-zone\"\n    [class.dragging]=\"isDropAreaEnlarged$ | async\"\n    tabindex=\"0\"\n  >\n    <div\n      class=\"file-placeholder pointer\"\n      [class.drag-over]=\"isDraggingOverFilePlaceholder$ | async\"\n      #filePlaceholder\n      (drop)=\"onDrop($event)\"\n      (click)=\"!uploadInProgress && picker.click()\"\n    >\n      <div *ngIf=\"validateExtensionOnDrag && (isDraggedFileUnsupported$ | async); else defaultHint\">\n        <p class=\"form-control-static text-truncate\">\n          <i\n            class=\"text-warning m-r-4\"\n            c8yIcon=\"exclamation-triangle\"\n          ></i>\n          <span>{{ 'At least one file is of an unsupported type.' | translate }}</span>\n        </p>\n      </div>\n      <ng-template #defaultHint>\n        <div\n          class=\"hint-placeholder\"\n          *ngIf=\"!uploadInProgress\"\n        >\n          <i c8yIcon=\"upload\"></i>\n          <p>\n            <b>{{ 'Drop files here or click to browse' | translate }}</b>\n          </p>\n          <p\n            class=\"m-t-8 text-12 text-muted\"\n            *ngIf=\"accept\"\n          >\n            {{ 'Supported file types:' | translate }} {{ accept }}\n          </p>\n          <c8y-form-group>\n            <c8y-messages\n              class=\"has-error\"\n              *ngIf=\"\n                controlInstance.touched && controlInstance.errors && controlInstance.errors\n                  | filterNonArrayValidationErrors\n              \"\n            >\n              <c8y-message\n                *ngFor=\"\n                  let error of controlInstance.errors | filterNonArrayValidationErrors | keyvalue\n                \"\n              >\n                {{ error.key | humanizeValidationMessage | translate: error.value }}\n              </c8y-message>\n            </c8y-messages>\n          </c8y-form-group>\n        </div>\n        <div\n          class=\"d-flex d-col p-4 flex-center\"\n          *ngIf=\"uploadInProgress\"\n        >\n          <c8y-loading></c8y-loading>\n          <p class=\"m-t-auto m-b-auto m-r-8 text-center\">\n            {{ loadingMessage | translate }}\n          </p>\n        </div>\n      </ng-template>\n    </div>\n  </div>\n  <div class=\"file-container\">\n    <ul class=\"list-group\">\n      <ng-container *ngFor=\"let file of droppedFiles; let i = index\">\n        <li class=\"list-group-item p-4 a-i-center\">\n          <div class=\"d-flex a-i-center\">\n            <i\n              class=\"icon-20 m-r-8\"\n              [c8yIcon]=\"file | fileIcon\"\n            ></i>\n            <div\n              class=\"m-r-16 text-truncate\"\n              [title]=\"file.name\"\n            >\n              {{ file.name }}\n            </div>\n            <div class=\"m-r-16 text-nowrap\">({{ file.size | bytes }})</div>\n            <div class=\"m-l-auto\">\n              <button\n                class=\"btn btn-dot btn-dot--danger\"\n                title=\"{{ 'Remove' | translate }}\"\n                [attr.aria-label]=\"'Remove' | translate\"\n                type=\"button\"\n                *ngIf=\"!uploadInProgress\"\n                (click)=\"deleteAt(i)\"\n              >\n                <i c8yIcon=\"minus-circle\"></i>\n              </button>\n            </div>\n          </div>\n          <c8y-form-group>\n            <c8y-messages class=\"has-error\">\n              <c8y-message\n                *ngFor=\"\n                  let error of controlInstance.errors | extractArrayValidationErrors: i | keyvalue\n                \"\n              >\n                {{ error.key | humanizeValidationMessage | translate: error.value }}\n              </c8y-message>\n            </c8y-messages>\n          </c8y-form-group>\n\n          <div\n            class=\"d-block\"\n            data-cy=\"c8y-file-picker-form-control--upload-progress-bar\"\n            *ngIf=\"uploadInProgress\"\n          >\n            <div\n              class=\"progress progress-striped active\"\n              *ngIf=\"uploadProgress\"\n            >\n              <div\n                class=\"progress-bar progress-bar-info\"\n                [style.width]=\"uploadProgress[i].percentage + '%'\"\n                aria-valuenow=\"0\"\n                aria-valuemin=\"0\"\n                aria-valuemax=\"100\"\n                role=\"progressbar\"\n              >\n                {{ uploadProgress[i].percentage }}%\n              </div>\n            </div>\n          </div>\n        </li>\n      </ng-container>\n    </ul>\n  </div>\n  <input\n    class=\"hidden\"\n    id=\"file\"\n    type=\"file\"\n    #picker\n    (change)=\"filesSelected($event)\"\n    [accept]=\"acceptedExts\"\n    [multiple]=\"maxAllowedFiles > 1\"\n  />\n</c8y-form-group>\n", dependencies: [{ kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage", "additionalMessages"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "pipe", type: ExtractArrayValidationErrorsPipe, name: "extractArrayValidationErrors" }, { kind: "pipe", type: FilterNonArrayValidationErrorsPipe, name: "filterNonArrayValidationErrors" }, { kind: "pipe", type: HumanizeValidationMessagePipe, name: "humanizeValidationMessage" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: BytesPipe, name: "bytes" }, { kind: "pipe", type: GenericFileIconPipe, name: "fileIcon" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: FilePickerFormControlComponent, decorators: [{
             type: Component,
@@ -28461,12 +28681,14 @@ function hookWidget(components, options) {
 }
 /**
  * The configuration size view is divided into configuration and preview.
- * The configuration can be collapsed, half or full (preview hidden).
+ * The configuration can be collapsed, fixed, half or full (preview hidden).
+ * The default value is 560px fixed size.
  */
 var WIDGET_CONFIGURATION_GRID_SIZE;
 (function (WIDGET_CONFIGURATION_GRID_SIZE) {
     WIDGET_CONFIGURATION_GRID_SIZE["COLLAPSED"] = "0px";
-    WIDGET_CONFIGURATION_GRID_SIZE["HALF"] = "560px";
+    WIDGET_CONFIGURATION_GRID_SIZE["DEFAULT"] = "560px";
+    WIDGET_CONFIGURATION_GRID_SIZE["HALF"] = "50%";
     WIDGET_CONFIGURATION_GRID_SIZE["FULL"] = "100%";
 })(WIDGET_CONFIGURATION_GRID_SIZE || (WIDGET_CONFIGURATION_GRID_SIZE = {}));
 function isLazyDynamicComponents(componentDefinition) {
@@ -30929,7 +31151,7 @@ class WidgetTimeContextComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: WidgetTimeContextComponent, deps: [{ token: WidgetsDashboardEventService }, { token: DashboardChildComponent }, { token: i1$8.FormBuilder }, { token: WidgetTimeContextQueryService }, { token: WidgetTimeContextHelperService }, { token: i1$4.Router }, { token: ActionBarService }, { token: AggregationService }, { token: i1$4.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: WidgetTimeContextComponent, isStandalone: true, selector: "c8y-widget-time-context", inputs: { canDecouple: "canDecouple", displaySettings: "displaySettings", hidden: "hidden" }, outputs: { dateContextChange: "dateContextChange" }, host: { classAttribute: "d-flex a-i-center gap-4" }, viewQueries: [{ propertyName: "action", first: true, predicate: DashboardChildActionComponent, descendants: true }, { propertyName: "dropdown", first: true, predicate: BsDropdownDirective, descendants: true }], ngImport: i0, template: "<c8y-action-bar-item\n  *ngIf=\"isCoupled && !hidden\"\n  [priority]=\"ACTION_BAR_PRIORITY\"\n  [groupId]=\"ACTION_BAR_GROUP_ID\"\n  [inGroupPriority]=\"actionBarInGroupPriority\"\n  [placement]=\"'left'\"\n>\n  <ng-container\n    [ngTemplateOutlet]=\"dateTimePicker\"\n    [ngTemplateOutletContext]=\"{\n      date: [form.value.currentDateContextFromDate, form.value.currentDateContextToDate]\n    }\"\n  ></ng-container>\n</c8y-action-bar-item>\n\n<ng-container\n  *ngIf=\"!isCoupled\"\n  [ngTemplateOutlet]=\"dateTimePicker\"\n  [ngTemplateOutletContext]=\"{\n    date: [form.value.currentDateContextFromDate, form.value.currentDateContextToDate]\n  }\"\n></ng-container>\n\n<ng-template\n  #dateTimePicker\n  let-date=\"date\"\n>\n  <form\n    class=\"d-flex gap-16 p-l-xs-16 p-r-xs-16 m-t-xs-8 m-b-xs-8\"\n    [formGroup]=\"form\"\n  >\n    <ng-container *ngIf=\"displaySettings.globalTimeContext\">\n      <div>\n        <div\n          class=\"dropdown flex-grow\"\n          #dropdown=\"bs-dropdown\"\n          dropdown\n          [insideClick]=\"true\"\n          *ngIf=\"date\"\n        >\n          <button\n            class=\"dropdown-toggle form-control l-h-tight d-flex a-i-center\"\n            attr.aria-label=\"{{ date[0] | c8yDate: DATE_FORMAT }} \u2014 {{\n              date[1] | c8yDate: DATE_FORMAT\n            }}\"\n            tooltip=\"{{ date[0] | c8yDate: DATE_FORMAT }} \u2014 {{ date[1] | c8yDate: DATE_FORMAT }}\"\n            placement=\"top\"\n            container=\"body\"\n            data-cy=\"widget-time-context--date-picker-dropdown-button\"\n            [adaptivePosition]=\"false\"\n            [delay]=\"500\"\n            dropdownToggle\n          >\n            <i\n              class=\"m-r-4\"\n              c8yIcon=\"schedule1\"\n            ></i>\n            <div class=\"d-col text-left fit-w\">\n              <span\n                class=\"text-12\"\n                data-cy=\"widget-time-context--selected-interval\"\n              >\n                {{ INTERVAL_TITLES[form.controls.currentDateContextInterval.value] | translate }}\n              </span>\n              <span\n                class=\"text-10 text-muted text-truncate\"\n                data-cy=\"widget-time-context--selected-time-range\"\n              >\n                {{ date[0] | c8yDate: DATE_FORMAT }} \u2014 {{ date[1] | c8yDate: DATE_FORMAT }}\n              </span>\n            </div>\n            <span class=\"caret m-r-16 m-l-4\"></span>\n          </button>\n\n          <ul\n            class=\"dropdown-menu dropdown-menu--date-range\"\n            *dropdownMenu\n          >\n            <c8y-interval-picker\n              class=\"d-contents\"\n              formControlName=\"currentDateContextInterval\"\n            ></c8y-interval-picker>\n\n            <ng-container *ngIf=\"form.controls.currentDateContextInterval.value === 'custom'\">\n              <div class=\"p-l-16 p-r-16\">\n                <c8y-form-group\n                  [ngClass]=\"form.controls.temporaryUserSelectedFromDate.errors ? 'has-error' : ''\"\n                >\n                  <label\n                    [title]=\"'From`date`' | translate\"\n                    for=\"temporaryUserSelectedFromDate\"\n                    translate\n                  >\n                    From`date`\n                  </label>\n                  <c8y-date-time-picker\n                    id=\"temporaryUserSelectedFromDate\"\n                    [maxDate]=\"form.value.temporaryUserSelectedToDate\"\n                    [placeholder]=\"'From`date`' | translate\"\n                    [formControl]=\"form.controls.temporaryUserSelectedFromDate\"\n                    [ngClass]=\"\n                      form.controls.temporaryUserSelectedFromDate.errors ? 'has-error' : ''\n                    \"\n                  ></c8y-date-time-picker>\n                  <c8y-messages [show]=\"form.controls.temporaryUserSelectedFromDate.errors\">\n                    <c8y-message\n                      name=\"dateAfterRangeMax\"\n                      [text]=\"'This date is after the latest allowed date.' | translate\"\n                    ></c8y-message>\n                    <c8y-message\n                      name=\"invalidDateTime\"\n                      [text]=\"'This date is invalid.' | translate\"\n                    ></c8y-message>\n                  </c8y-messages>\n                </c8y-form-group>\n\n                <c8y-form-group\n                  [ngClass]=\"form.controls.temporaryUserSelectedToDate.errors ? 'has-error' : ''\"\n                >\n                  <label\n                    [title]=\"'To`date`' | translate\"\n                    for=\"temporaryUserSelectedToDate\"\n                    translate\n                  >\n                    To`date`\n                  </label>\n                  <c8y-date-time-picker\n                    id=\"temporaryUserSelectedToDate\"\n                    [minDate]=\"form.value.temporaryUserSelectedFromDate\"\n                    [placeholder]=\"'To`date`' | translate\"\n                    [formControl]=\"form.controls.temporaryUserSelectedToDate\"\n                    [ngClass]=\"form.controls.temporaryUserSelectedToDate.errors ? 'has-error' : ''\"\n                  ></c8y-date-time-picker>\n                  <c8y-messages [show]=\"form.controls.temporaryUserSelectedToDate.errors\">\n                    <c8y-message\n                      name=\"dateBeforeRangeMin\"\n                      [text]=\"'This date is before the earliest allowed date.' | translate\"\n                    ></c8y-message>\n                    <c8y-message\n                      name=\"invalidDateTime\"\n                      [text]=\"'This date is invalid.' | translate\"\n                    ></c8y-message>\n                  </c8y-messages>\n                </c8y-form-group>\n              </div>\n\n              <div class=\"p-16 d-flex gap-8 separator-top\">\n                <button\n                  class=\"btn btn-default btn-sm flex-grow\"\n                  title=\"{{ 'Reset' | translate }}\"\n                  type=\"button\"\n                  (click)=\"reset(); dropdown.isOpen = false\"\n                  [disabled]=\"form.value.realtime || isAutoRefreshEnabled\"\n                  translate\n                >\n                  Reset\n                </button>\n\n                <button\n                  class=\"btn btn-primary btn-sm flex-grow\"\n                  title=\"{{ 'Apply' | translate }}\"\n                  type=\"button\"\n                  (click)=\"applyDatetimeContext(); dropdown.isOpen = false\"\n                  [disabled]=\"\n                    (form.pristine && form.untouched) || form.invalid || form.value.realtime || isAutoRefreshEnabled\n                  \"\n                  translate\n                >\n                  Apply\n                </button>\n              </div>\n            </ng-container>\n          </ul>\n        </div>\n      </div>\n    </ng-container>\n\n    <div class=\"input-group w-auto\">\n      <c8y-realtime-control\n        class=\"form-control p-0 flex-no-grow w-auto\"\n        *ngIf=\"displaySettings.globalRealtimeContext\"\n        formControlName=\"realtime\"\n      ></c8y-realtime-control>\n\n      <c8y-aggregation-picker\n        *ngIf=\"displaySettings.globalAggregationContext\"\n        formControlName=\"aggregation\"\n        [disabledAggregations]=\"disabledAggregations\"\n      ></c8y-aggregation-picker>\n    </div>\n  </form>\n</ng-template>\n\n<c8y-dashboard-child-action>\n  <button\n    type=\"button\"\n    (click)=\"toggleDecoupling()\"\n  >\n    <i [c8yIcon]=\"isCoupled ? 'schedule1' : 'today'\"></i>\n    <span class=\"m-l-4\">\n      {{ (isCoupled ? decoupleTimeContextLabel : coupleTimeContextLabel) | translate }}\n    </span>\n  </button>\n</c8y-dashboard-child-action>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule$1 }, { kind: "directive", type: i1$8.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$8.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$8.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$8.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$8.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: BsDropdownModule }, { kind: "directive", type: i1$3.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { kind: "directive", type: i1$3.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { kind: "directive", type: i1$3.BsDropdownDirective, selector: "[bsDropdown], [dropdown]", inputs: ["placement", "triggers", "container", "dropup", "autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen"], outputs: ["isOpenChange", "onShown", "onHidden"], exportAs: ["bs-dropdown"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i1$5.TooltipDirective, selector: "[tooltip], [tooltipHtml]", inputs: ["adaptivePosition", "tooltip", "placement", "triggers", "container", "containerClass", "boundariesElement", "isOpen", "isDisabled", "delay", "tooltipHtml", "tooltipPlacement", "tooltipIsOpen", "tooltipEnable", "tooltipAppendToBody", "tooltipAnimation", "tooltipClass", "tooltipContext", "tooltipPopupDelay", "tooltipFadeDuration", "tooltipTrigger"], outputs: ["tooltipChange", "onShown", "onHidden", "tooltipStateChanged"], exportAs: ["bs-tooltip"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: IntervalPickerComponent, selector: "c8y-interval-picker", inputs: ["INTERVALS"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: DateTimePickerComponent, selector: "c8y-date-time-picker", inputs: ["minDate", "maxDate", "placeholder", "dateInputFormat", "adaptivePosition", "size", "dateType", "config"], outputs: ["onDateSelected"] }, { kind: "component", type: MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage"] }, { kind: "directive", type: MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "component", type: RealtimeControlComponent, selector: "c8y-realtime-control" }, { kind: "component", type: AggregationPickerComponent, selector: "c8y-aggregation-picker", inputs: ["disabledAggregations"] }, { kind: "component", type: DashboardChildActionComponent, selector: "c8y-dashboard-child-action" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: DatePipe, name: "c8yDate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: WidgetTimeContextComponent, isStandalone: true, selector: "c8y-widget-time-context", inputs: { canDecouple: "canDecouple", displaySettings: "displaySettings", hidden: "hidden" }, outputs: { dateContextChange: "dateContextChange" }, host: { classAttribute: "d-flex a-i-center gap-4" }, viewQueries: [{ propertyName: "action", first: true, predicate: DashboardChildActionComponent, descendants: true }, { propertyName: "dropdown", first: true, predicate: BsDropdownDirective, descendants: true }], ngImport: i0, template: "<c8y-action-bar-item\n  *ngIf=\"isCoupled && !hidden\"\n  [priority]=\"ACTION_BAR_PRIORITY\"\n  [groupId]=\"ACTION_BAR_GROUP_ID\"\n  [inGroupPriority]=\"actionBarInGroupPriority\"\n  [placement]=\"'left'\"\n>\n  <ng-container\n    [ngTemplateOutlet]=\"dateTimePicker\"\n    [ngTemplateOutletContext]=\"{\n      date: [form.value.currentDateContextFromDate, form.value.currentDateContextToDate]\n    }\"\n  ></ng-container>\n</c8y-action-bar-item>\n\n<ng-container\n  *ngIf=\"!isCoupled\"\n  [ngTemplateOutlet]=\"dateTimePicker\"\n  [ngTemplateOutletContext]=\"{\n    date: [form.value.currentDateContextFromDate, form.value.currentDateContextToDate]\n  }\"\n></ng-container>\n\n<ng-template\n  #dateTimePicker\n  let-date=\"date\"\n>\n  <form\n    class=\"d-flex gap-16 p-l-xs-16 p-r-xs-16 m-t-xs-8 m-b-xs-8\"\n    [formGroup]=\"form\"\n  >\n    <ng-container *ngIf=\"displaySettings.globalTimeContext\">\n      <div>\n        <div\n          class=\"dropdown flex-grow\"\n          #dropdown=\"bs-dropdown\"\n          dropdown\n          [insideClick]=\"true\"\n          *ngIf=\"date\"\n        >\n          <button\n            class=\"dropdown-toggle form-control l-h-tight d-flex a-i-center\"\n            attr.aria-label=\"{{ date[0] | c8yDate: DATE_FORMAT }} \u2014 {{\n              date[1] | c8yDate: DATE_FORMAT\n            }}\"\n            tooltip=\"{{ date[0] | c8yDate: DATE_FORMAT }} \u2014 {{ date[1] | c8yDate: DATE_FORMAT }}\"\n            placement=\"top\"\n            container=\"body\"\n            data-cy=\"widget-time-context--date-picker-dropdown-button\"\n            [adaptivePosition]=\"false\"\n            [delay]=\"500\"\n            dropdownToggle\n          >\n            <i\n              class=\"m-r-4\"\n              c8yIcon=\"schedule1\"\n            ></i>\n            <div class=\"d-col text-left fit-w\">\n              <span\n                class=\"text-12\"\n                data-cy=\"widget-time-context--selected-interval\"\n              >\n                {{ INTERVAL_TITLES[form.controls.currentDateContextInterval.value] | translate }}\n              </span>\n              <span\n                class=\"text-10 text-muted text-truncate\"\n                data-cy=\"widget-time-context--selected-time-range\"\n              >\n                {{ date[0] | c8yDate: DATE_FORMAT }} \u2014 {{ date[1] | c8yDate: DATE_FORMAT }}\n              </span>\n            </div>\n            <span class=\"caret m-r-16 m-l-4\"></span>\n          </button>\n\n          <ul\n            class=\"dropdown-menu dropdown-menu--date-range\"\n            *dropdownMenu\n          >\n            <c8y-interval-picker\n              class=\"d-contents\"\n              formControlName=\"currentDateContextInterval\"\n            ></c8y-interval-picker>\n\n            <ng-container *ngIf=\"form.controls.currentDateContextInterval.value === 'custom'\">\n              <div class=\"p-l-16 p-r-16\">\n                <c8y-form-group\n                  [ngClass]=\"form.controls.temporaryUserSelectedFromDate.errors ? 'has-error' : ''\"\n                >\n                  <label\n                    [title]=\"'From`date`' | translate\"\n                    for=\"temporaryUserSelectedFromDate\"\n                    translate\n                  >\n                    From`date`\n                  </label>\n                  <c8y-date-time-picker\n                    id=\"temporaryUserSelectedFromDate\"\n                    [maxDate]=\"form.value.temporaryUserSelectedToDate\"\n                    [placeholder]=\"'From`date`' | translate\"\n                    [formControl]=\"form.controls.temporaryUserSelectedFromDate\"\n                    [ngClass]=\"\n                      form.controls.temporaryUserSelectedFromDate.errors ? 'has-error' : ''\n                    \"\n                  ></c8y-date-time-picker>\n                  <c8y-messages [show]=\"form.controls.temporaryUserSelectedFromDate.errors\">\n                    <c8y-message\n                      name=\"dateAfterRangeMax\"\n                      [text]=\"'This date is after the latest allowed date.' | translate\"\n                    ></c8y-message>\n                    <c8y-message\n                      name=\"invalidDateTime\"\n                      [text]=\"'This date is invalid.' | translate\"\n                    ></c8y-message>\n                  </c8y-messages>\n                </c8y-form-group>\n\n                <c8y-form-group\n                  [ngClass]=\"form.controls.temporaryUserSelectedToDate.errors ? 'has-error' : ''\"\n                >\n                  <label\n                    [title]=\"'To`date`' | translate\"\n                    for=\"temporaryUserSelectedToDate\"\n                    translate\n                  >\n                    To`date`\n                  </label>\n                  <c8y-date-time-picker\n                    id=\"temporaryUserSelectedToDate\"\n                    [minDate]=\"form.value.temporaryUserSelectedFromDate\"\n                    [placeholder]=\"'To`date`' | translate\"\n                    [formControl]=\"form.controls.temporaryUserSelectedToDate\"\n                    [ngClass]=\"form.controls.temporaryUserSelectedToDate.errors ? 'has-error' : ''\"\n                  ></c8y-date-time-picker>\n                  <c8y-messages [show]=\"form.controls.temporaryUserSelectedToDate.errors\">\n                    <c8y-message\n                      name=\"dateBeforeRangeMin\"\n                      [text]=\"'This date is before the earliest allowed date.' | translate\"\n                    ></c8y-message>\n                    <c8y-message\n                      name=\"invalidDateTime\"\n                      [text]=\"'This date is invalid.' | translate\"\n                    ></c8y-message>\n                  </c8y-messages>\n                </c8y-form-group>\n              </div>\n\n              <div class=\"p-16 d-flex gap-8 separator-top\">\n                <button\n                  class=\"btn btn-default btn-sm flex-grow\"\n                  title=\"{{ 'Reset' | translate }}\"\n                  type=\"button\"\n                  (click)=\"reset(); dropdown.isOpen = false\"\n                  [disabled]=\"form.value.realtime || isAutoRefreshEnabled\"\n                  translate\n                >\n                  Reset\n                </button>\n\n                <button\n                  class=\"btn btn-primary btn-sm flex-grow\"\n                  title=\"{{ 'Apply' | translate }}\"\n                  type=\"button\"\n                  (click)=\"applyDatetimeContext(); dropdown.isOpen = false\"\n                  [disabled]=\"\n                    (form.pristine && form.untouched) || form.invalid || form.value.realtime || isAutoRefreshEnabled\n                  \"\n                  translate\n                >\n                  Apply\n                </button>\n              </div>\n            </ng-container>\n          </ul>\n        </div>\n      </div>\n    </ng-container>\n\n    <div class=\"input-group w-auto\">\n      <c8y-realtime-control\n        class=\"form-control p-0 flex-no-grow w-auto\"\n        *ngIf=\"displaySettings.globalRealtimeContext\"\n        formControlName=\"realtime\"\n      ></c8y-realtime-control>\n\n      <c8y-aggregation-picker\n        *ngIf=\"displaySettings.globalAggregationContext\"\n        formControlName=\"aggregation\"\n        [disabledAggregations]=\"disabledAggregations\"\n      ></c8y-aggregation-picker>\n    </div>\n  </form>\n</ng-template>\n\n<c8y-dashboard-child-action>\n  <button\n    type=\"button\"\n    (click)=\"toggleDecoupling()\"\n  >\n    <i [c8yIcon]=\"isCoupled ? 'schedule1' : 'today'\"></i>\n    <span class=\"m-l-4\">\n      {{ (isCoupled ? decoupleTimeContextLabel : coupleTimeContextLabel) | translate }}\n    </span>\n  </button>\n</c8y-dashboard-child-action>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule$1 }, { kind: "directive", type: i1$8.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$8.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$8.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$8.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$8.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: BsDropdownModule }, { kind: "directive", type: i1$3.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { kind: "directive", type: i1$3.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { kind: "directive", type: i1$3.BsDropdownDirective, selector: "[bsDropdown], [dropdown]", inputs: ["placement", "triggers", "container", "dropup", "autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen"], outputs: ["isOpenChange", "onShown", "onHidden"], exportAs: ["bs-dropdown"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i1$5.TooltipDirective, selector: "[tooltip], [tooltipHtml]", inputs: ["adaptivePosition", "tooltip", "placement", "triggers", "container", "containerClass", "boundariesElement", "isOpen", "isDisabled", "delay", "tooltipHtml", "tooltipPlacement", "tooltipIsOpen", "tooltipEnable", "tooltipAppendToBody", "tooltipAnimation", "tooltipClass", "tooltipContext", "tooltipPopupDelay", "tooltipFadeDuration", "tooltipTrigger"], outputs: ["tooltipChange", "onShown", "onHidden", "tooltipStateChanged"], exportAs: ["bs-tooltip"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "component", type: IntervalPickerComponent, selector: "c8y-interval-picker", inputs: ["INTERVALS"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: DateTimePickerComponent, selector: "c8y-date-time-picker", inputs: ["minDate", "maxDate", "placeholder", "dateInputFormat", "adaptivePosition", "size", "dateType", "config"], outputs: ["onDateSelected"] }, { kind: "component", type: MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage", "additionalMessages"] }, { kind: "directive", type: MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "component", type: RealtimeControlComponent, selector: "c8y-realtime-control" }, { kind: "component", type: AggregationPickerComponent, selector: "c8y-aggregation-picker", inputs: ["disabledAggregations"] }, { kind: "component", type: DashboardChildActionComponent, selector: "c8y-dashboard-child-action" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: DatePipe, name: "c8yDate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: WidgetTimeContextComponent, decorators: [{
             type: Component,
@@ -32778,7 +33000,7 @@ class ConfigureCustomColumnComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ConfigureCustomColumnComponent, deps: [{ token: i1$8.FormBuilder }, { token: i1$7.BsModalRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: ConfigureCustomColumnComponent, isStandalone: true, selector: "c8y-configure-custom-column", outputs: { onAddCustomColumn: "onAddCustomColumn" }, viewQueries: [{ propertyName: "form", first: true, predicate: ["columnConfigForm"], descendants: true }], ngImport: i0, template: "<div class=\"viewport-modal\">\n  <div class=\"modal-header separator-bottom\">\n    <h3\n      id=\"modal-title\"\n      translate\n    >\n      Configure custom column\n    </h3>\n  </div>\n\n  <form\n    class=\"d-contents\"\n    #columnConfigForm=\"ngForm\"\n    [formGroup]=\"formGroup\"\n  >\n    <div\n      class=\"modal-inner-scroll\"\n      id=\"modal-body\"\n    >\n      <div class=\"modal-body\">\n        <c8y-form-group>\n          <label\n            for=\"header\"\n            translate\n          >\n            Header\n          </label>\n          <input\n            class=\"form-control\"\n            id=\"header\"\n            autocomplete=\"off\"\n            data-cy=\"configure-custom-column--header\"\n            formControlName=\"header\"\n            [placeholder]=\"'e.g. Agent name' | translate\"\n            [required]=\"true\"\n            uniqueByPath\n            [collection]=\"columns\"\n            path=\"header\"\n            [comparator]=\"comparator\"\n          />\n          <c8y-messages>\n            <c8y-message\n              name=\"uniqueByPath\"\n              [text]=\"uniqueHeaderMsg\"\n            ></c8y-message>\n          </c8y-messages>\n        </c8y-form-group>\n        <c8y-form-group>\n          <label\n            for=\"fragmentPath\"\n            translate\n          >\n            Fragment path\n          </label>\n          <input\n            class=\"form-control\"\n            id=\"fragmentPath\"\n            autocomplete=\"off\"\n            data-cy=\"configure-custom-column--fragmentPath\"\n            formControlName=\"path\"\n            [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'c8y_Agent.name' }\"\n          />\n        </c8y-form-group>\n        <label\n          class=\"c8y-switch\"\n          [title]=\"'Add another column after saving this one' | translate\"\n        >\n          <input\n            class=\"form-control\"\n            type=\"checkbox\"\n            formControlName=\"addAnother\"\n          />\n          <span></span>\n          <span translate>Add another column after saving this one</span>\n        </label>\n      </div>\n    </div>\n\n    <div class=\"modal-footer\">\n      <button\n        class=\"btn btn-default\"\n        title=\"{{ 'Cancel' | translate }}\"\n        (click)=\"modalRef.hide()\"\n      >\n        {{ 'Cancel' | translate }}\n      </button>\n      <button\n        class=\"btn btn-primary\"\n        title=\"{{ 'Save' | translate }}\"\n        [disabled]=\"columnConfigForm.form.pristine || !columnConfigForm.form.valid\"\n        (click)=\"addColumn()\"\n      >\n        {{ 'Save' | translate }}\n      </button>\n    </div>\n  </form>\n</div>\n", dependencies: [{ kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "ngmodule", type: FormsModule$1 }, { kind: "directive", type: i1$8.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$8.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$8.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$8.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$8.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$8.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$8.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "directive", type: UniqueInCollectionByPathValidationDirective, selector: "[uniqueByPath]", inputs: ["collection", "path", "comparator"] }, { kind: "component", type: MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage"] }, { kind: "directive", type: MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: ConfigureCustomColumnComponent, isStandalone: true, selector: "c8y-configure-custom-column", outputs: { onAddCustomColumn: "onAddCustomColumn" }, viewQueries: [{ propertyName: "form", first: true, predicate: ["columnConfigForm"], descendants: true }], ngImport: i0, template: "<div class=\"viewport-modal\">\n  <div class=\"modal-header separator-bottom\">\n    <h3\n      id=\"modal-title\"\n      translate\n    >\n      Configure custom column\n    </h3>\n  </div>\n\n  <form\n    class=\"d-contents\"\n    #columnConfigForm=\"ngForm\"\n    [formGroup]=\"formGroup\"\n  >\n    <div\n      class=\"modal-inner-scroll\"\n      id=\"modal-body\"\n    >\n      <div class=\"modal-body\">\n        <c8y-form-group>\n          <label\n            for=\"header\"\n            translate\n          >\n            Header\n          </label>\n          <input\n            class=\"form-control\"\n            id=\"header\"\n            autocomplete=\"off\"\n            data-cy=\"configure-custom-column--header\"\n            formControlName=\"header\"\n            [placeholder]=\"'e.g. Agent name' | translate\"\n            [required]=\"true\"\n            uniqueByPath\n            [collection]=\"columns\"\n            path=\"header\"\n            [comparator]=\"comparator\"\n          />\n          <c8y-messages>\n            <c8y-message\n              name=\"uniqueByPath\"\n              [text]=\"uniqueHeaderMsg\"\n            ></c8y-message>\n          </c8y-messages>\n        </c8y-form-group>\n        <c8y-form-group>\n          <label\n            for=\"fragmentPath\"\n            translate\n          >\n            Fragment path\n          </label>\n          <input\n            class=\"form-control\"\n            id=\"fragmentPath\"\n            autocomplete=\"off\"\n            data-cy=\"configure-custom-column--fragmentPath\"\n            formControlName=\"path\"\n            [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'c8y_Agent.name' }\"\n          />\n        </c8y-form-group>\n        <label\n          class=\"c8y-switch\"\n          [title]=\"'Add another column after saving this one' | translate\"\n        >\n          <input\n            class=\"form-control\"\n            type=\"checkbox\"\n            formControlName=\"addAnother\"\n          />\n          <span></span>\n          <span translate>Add another column after saving this one</span>\n        </label>\n      </div>\n    </div>\n\n    <div class=\"modal-footer\">\n      <button\n        class=\"btn btn-default\"\n        title=\"{{ 'Cancel' | translate }}\"\n        (click)=\"modalRef.hide()\"\n      >\n        {{ 'Cancel' | translate }}\n      </button>\n      <button\n        class=\"btn btn-primary\"\n        title=\"{{ 'Save' | translate }}\"\n        [disabled]=\"columnConfigForm.form.pristine || !columnConfigForm.form.valid\"\n        (click)=\"addColumn()\"\n      >\n        {{ 'Save' | translate }}\n      </button>\n    </div>\n  </form>\n</div>\n", dependencies: [{ kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "ngmodule", type: FormsModule$1 }, { kind: "directive", type: i1$8.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$8.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$8.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i1$8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$8.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$8.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$8.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$8.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "directive", type: UniqueInCollectionByPathValidationDirective, selector: "[uniqueByPath]", inputs: ["collection", "path", "comparator"] }, { 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" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ConfigureCustomColumnComponent, decorators: [{
             type: Component,
@@ -38048,7 +38270,7 @@ class ProviderConfigurationComponent {
         return mapValues(configuration, value => (value === '<<Encrypted>>' ? undefined : value));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ProviderConfigurationComponent, deps: [{ token: Permissions }, { token: i1$4.ActivatedRoute }, { token: ModalService }, { token: AlertService }, { token: ProviderDefinitionsService }, { token: ProviderConfigurationService }, { token: C8yJSONSchema }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: ProviderConfigurationComponent, isStandalone: true, selector: "c8y-sms-gateway", providers: [ProviderConfigurationService, ProviderDefinitionsService], ngImport: i0, template: "<c8y-title>\n  {{ (layout$ | async)?.pageTitle | translate }}\n</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [label]=\"'Settings' | translate\"\n    [icon]=\"'cog'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item *ngIf=\"(layout$ | async)?.pageTitle !='Connectivity'\"\n    [label]=\"'SMS provider' | translate\"\n    [icon]=\"'cog'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item *ngIf=\"(layout$ | async)?.pageTitle =='Connectivity'\"\n    [label]=\"'Connectivity' | translate\"\n    [icon]=\"'cog'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item *ngIf=\"(layout$ | async)?.pageTitle =='Connectivity'\"\n    [icon]=\"'cog'\"\n    [label]=\"'SIM provider settings' | translate\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<div class=\"row\">\n  <div class=\"col-md-8 col-xs-12\">\n    <form class=\"card card--fullpage\" (ngSubmit)=\"saveProviderConfiguration()\">\n      <div class=\"card-header separator\">\n        <div class=\"card-title\">\n          {{ (layout$ | async)?.cardTitle | translate }}\n        </div>\n      </div>\n      <div class=\"inner-scroll\">\n        <div class=\"card-block\">\n          <p *ngIf=\"!!(layout$ | async)?.description\" class=\"m-b-8\">\n            {{ (layout$ | async)?.description | translate }}\n          </p>\n          <c8y-form-group>\n            <label for=\"providerName\">{{ (layout$ | async)?.providerName | translate }}</label>\n            <c8y-typeahead\n              [disabled]=\"!permissions.hasAllRoles((layout$ | async)?.saveRoles || [])\"\n              [ngModel]=\"selectedProvider$ | async\"\n              [displayProperty]=\"'displayName'\"\n              name=\"providerName\"\n              placeholder=\"{{ (layout$ | async)?.providerNamePlaceholder | translate }}\"\n              (onSearch)=\"providerInput$.next($event)\"\n              [allowFreeEntries]=\"false\"\n              [required]=\"true\"\n              [container]=\"'body'\"\n            >\n              <c8y-li\n                *ngFor=\"let provider of providers$ | async\"\n                class=\"p-l-8 p-r-8 c8y-list__item--link\"\n                (click)=\"changeProvider$.next(provider); providerInput$.next('')\"\n                [active]=\"(selectedProvider$ | async) === provider\"\n                [attr.role]=\"'menuitem'\"\n              >\n                <c8y-highlight\n                  [text]=\"provider.displayName || '--'\"\n                  [pattern]=\"providerInput$ | async\"\n                ></c8y-highlight>\n              </c8y-li>\n            </c8y-typeahead>\n            <c8y-messages>\n              <c8y-message\n                name=\"notExisting\"\n                [text]=\"(layout$ | async)?.providerNameNoMatchesHint | translate\"\n              ></c8y-message>\n            </c8y-messages>\n          </c8y-form-group>\n          <formly-form\n            *ngIf=\"selectedProvider$ | async\"\n            [form]=\"form\"\n            [fields]=\"fields\"\n            [model]=\"model\"\n            [options]=\"options\"\n          ></formly-form>\n        </div>\n      </div>\n      <div class=\"card-footer separator\" *c8yIfAllowed=\"allRoles$ | async; allowAny\">\n        <button\n          *c8yIfAllowed=\"(layout$ | async)?.deleteRoles\"\n          class=\"btn btn-default\"\n          type=\"button\"\n          (click)=\"deleteProviderConfiguration()\"\n          [disabled]=\"\n            !(configuration$ | async)?.provider && !(configuration$ | async)?.providerName\n          \"\n          title=\"{{ (layout$ | async)?.deleteBtnLabel | translate }}\"\n        >\n          {{ (layout$ | async)?.deleteBtnLabel | translate }}\n        </button>\n        <button\n          *c8yIfAllowed=\"(layout$ | async)?.saveRoles\"\n          class=\"btn btn-primary\"\n          type=\"submit\"\n          [disabled]=\"form.invalid || form.pristine\"\n          title=\"{{ (layout$ | async)?.saveBtnLabel | translate }}\"\n        >\n          {{ (layout$ | async)?.saveBtnLabel | translate }}\n        </button>\n      </div>\n    </form>\n  </div>\n</div>\n", dependencies: [{ kind: "component", type: TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "component", type: BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule$1 }, { kind: "directive", type: i1$8.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$8.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$8.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$8.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "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: "component", type: HighlightComponent, selector: "c8y-highlight", inputs: ["pattern", "text", "elementClass", "shouldTrimPattern"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage"] }, { kind: "directive", type: MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i2$4.FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "directive", type: IfAllowedDirective, selector: "[c8yIfAllowed]", inputs: ["c8yIfAllowed", "c8yIfAllowedAllowAny"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.18", type: ProviderConfigurationComponent, isStandalone: true, selector: "c8y-sms-gateway", providers: [ProviderConfigurationService, ProviderDefinitionsService], ngImport: i0, template: "<c8y-title>\n  {{ (layout$ | async)?.pageTitle | translate }}\n</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    [label]=\"'Settings' | translate\"\n    [icon]=\"'cog'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item *ngIf=\"(layout$ | async)?.pageTitle !='Connectivity'\"\n    [label]=\"'SMS provider' | translate\"\n    [icon]=\"'cog'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item *ngIf=\"(layout$ | async)?.pageTitle =='Connectivity'\"\n    [label]=\"'Connectivity' | translate\"\n    [icon]=\"'cog'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item *ngIf=\"(layout$ | async)?.pageTitle =='Connectivity'\"\n    [icon]=\"'cog'\"\n    [label]=\"'SIM provider settings' | translate\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<div class=\"row\">\n  <div class=\"col-md-8 col-xs-12\">\n    <form class=\"card card--fullpage\" (ngSubmit)=\"saveProviderConfiguration()\">\n      <div class=\"card-header separator\">\n        <div class=\"card-title\">\n          {{ (layout$ | async)?.cardTitle | translate }}\n        </div>\n      </div>\n      <div class=\"inner-scroll\">\n        <div class=\"card-block\">\n          <p *ngIf=\"!!(layout$ | async)?.description\" class=\"m-b-8\">\n            {{ (layout$ | async)?.description | translate }}\n          </p>\n          <c8y-form-group>\n            <label for=\"providerName\">{{ (layout$ | async)?.providerName | translate }}</label>\n            <c8y-typeahead\n              [disabled]=\"!permissions.hasAllRoles((layout$ | async)?.saveRoles || [])\"\n              [ngModel]=\"selectedProvider$ | async\"\n              [displayProperty]=\"'displayName'\"\n              name=\"providerName\"\n              placeholder=\"{{ (layout$ | async)?.providerNamePlaceholder | translate }}\"\n              (onSearch)=\"providerInput$.next($event)\"\n              [allowFreeEntries]=\"false\"\n              [required]=\"true\"\n              [container]=\"'body'\"\n            >\n              <c8y-li\n                *ngFor=\"let provider of providers$ | async\"\n                class=\"p-l-8 p-r-8 c8y-list__item--link\"\n                (click)=\"changeProvider$.next(provider); providerInput$.next('')\"\n                [active]=\"(selectedProvider$ | async) === provider\"\n                [attr.role]=\"'menuitem'\"\n              >\n                <c8y-highlight\n                  [text]=\"provider.displayName || '--'\"\n                  [pattern]=\"providerInput$ | async\"\n                ></c8y-highlight>\n              </c8y-li>\n            </c8y-typeahead>\n            <c8y-messages>\n              <c8y-message\n                name=\"notExisting\"\n                [text]=\"(layout$ | async)?.providerNameNoMatchesHint | translate\"\n              ></c8y-message>\n            </c8y-messages>\n          </c8y-form-group>\n          <formly-form\n            *ngIf=\"selectedProvider$ | async\"\n            [form]=\"form\"\n            [fields]=\"fields\"\n            [model]=\"model\"\n            [options]=\"options\"\n          ></formly-form>\n        </div>\n      </div>\n      <div class=\"card-footer separator\" *c8yIfAllowed=\"allRoles$ | async; allowAny\">\n        <button\n          *c8yIfAllowed=\"(layout$ | async)?.deleteRoles\"\n          class=\"btn btn-default\"\n          type=\"button\"\n          (click)=\"deleteProviderConfiguration()\"\n          [disabled]=\"\n            !(configuration$ | async)?.provider && !(configuration$ | async)?.providerName\n          \"\n          title=\"{{ (layout$ | async)?.deleteBtnLabel | translate }}\"\n        >\n          {{ (layout$ | async)?.deleteBtnLabel | translate }}\n        </button>\n        <button\n          *c8yIfAllowed=\"(layout$ | async)?.saveRoles\"\n          class=\"btn btn-primary\"\n          type=\"submit\"\n          [disabled]=\"form.invalid || form.pristine\"\n          title=\"{{ (layout$ | async)?.saveBtnLabel | translate }}\"\n        >\n          {{ (layout$ | async)?.saveBtnLabel | translate }}\n        </button>\n      </div>\n    </form>\n  </div>\n</div>\n", dependencies: [{ kind: "component", type: TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "component", type: BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule$1 }, { kind: "directive", type: i1$8.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$8.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$8.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$8.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "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: "component", type: HighlightComponent, selector: "c8y-highlight", inputs: ["pattern", "text", "elementClass", "shouldTrimPattern"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage", "additionalMessages"] }, { kind: "directive", type: MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "ngmodule", type: FormlyModule }, { kind: "component", type: i2$4.FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "directive", type: IfAllowedDirective, selector: "[c8yIfAllowed]", inputs: ["c8yIfAllowed", "c8yIfAllowedAllowAny"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: ProviderConfigurationComponent, decorators: [{
             type: Component,
@@ -39886,7 +40108,7 @@ class SplitViewListComponent {
         return !!this.parentSplitView?.hasProjectedDetails;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: SplitViewListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.18", type: SplitViewListComponent, isStandalone: true, selector: "c8y-sv-list", inputs: { title: "title", loading: "loading", showEmptyState: "showEmptyState", emptyStateIcon: "emptyStateIcon", emptyStateTitle: "emptyStateTitle", emptyStateSubtitle: "emptyStateSubtitle", docsUrl: "docsUrl", showTitle: "showTitle", listOpacity: "listOpacity" }, host: { classAttribute: "d-contents" }, queries: [{ propertyName: "alertsComp", first: true, predicate: SplitViewAlertsComponent, descendants: true }], viewQueries: [{ propertyName: "innerScrollDiv", first: true, predicate: ["innerScrollDiv"], descendants: true }], ngImport: i0, template: "<div\n  class=\"inner-scroll fit-h\"\n  [attr.aria-label]=\"title | translate\"\n  role=\"region\"\n  [ngClass]=\"{ 'split-view__list bg-level-1': isSplitView, 'bg-component': !isSplitView }\"\n  data-cy=\"c8y-sv-list\"\n  #innerScrollDiv\n>\n  @if (title || hasAlerts) {\n    <div\n      class=\"flex-wrap flex-no-shrink sticky-top gap-8\"\n      [ngClass]=\"{\n        'card-header separator': title && shouldShowTitle\n      }\"\n    >\n      @if (title && shouldShowTitle) {\n        <h4 class=\"card-title\">\n          {{ title | translate }}\n        </h4>\n      }\n      <ng-content select=\"c8y-sv-header-actions\"></ng-content>\n      @if (hasAlerts) {\n        <ng-content select=\"c8y-sv-alerts\"></ng-content>\n      }\n    </div>\n  }\n  <div data-cy=\"c8y-sv-list--group\">\n    @if (loading && !showEmptyState) {\n      <div class=\"p-absolute fit-w overflow-hidden p-b-4\">\n        <c8y-loading\n          [layout]=\"'page'\"\n          data-cy=\"c8y-sv-list--loading\"\n        ></c8y-loading>\n      </div>\n    }\n    <ng-content></ng-content>\n\n    @if (showEmptyState) {\n      <div class=\"p-relative p-l-24\">\n        <c8y-ui-empty-state\n          [icon]=\"emptyStateIcon\"\n          [title]=\"emptyStateTitle\"\n          [subtitle]=\"emptyStateSubtitle\"\n          data-cy=\"c8y-sv-list--empty-state\"\n        >\n          @if (docsUrl) {\n            <p c8y-guide-docs>\n              <small\n                translate\n                [translateParams]=\"{ docsUrl }\"\n                ngNonBindable\n              >\n                Find out more in the\n                <a c8y-guide-href=\"{{ docsUrl }}\">user documentation</a>.\n              </small>\n            </p>\n          }\n        </c8y-ui-empty-state>\n      </div>\n    }\n  </div>\n\n  <ng-content select=\"c8y-sv-footer\"></ng-content>\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: GuideDocsComponent, selector: "[c8y-guide-docs]" }, { kind: "directive", type: GuideHrefDirective, selector: "[c8y-guide-href]", inputs: ["c8y-guide-href"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.18", type: SplitViewListComponent, isStandalone: true, selector: "c8y-sv-list", inputs: { title: "title", loading: "loading", showEmptyState: "showEmptyState", emptyStateIcon: "emptyStateIcon", emptyStateTitle: "emptyStateTitle", emptyStateSubtitle: "emptyStateSubtitle", docsUrl: "docsUrl", showTitle: "showTitle", listOpacity: "listOpacity" }, host: { classAttribute: "d-contents" }, queries: [{ propertyName: "alertsComp", first: true, predicate: SplitViewAlertsComponent, descendants: true }], viewQueries: [{ propertyName: "innerScrollDiv", first: true, predicate: ["innerScrollDiv"], descendants: true }], ngImport: i0, template: "<div\n  class=\"inner-scroll fit-h\"\n  [attr.aria-label]=\"title | translate\"\n  role=\"region\"\n  [ngClass]=\"{ 'split-view__list bg-level-1': isSplitView, 'bg-component': !isSplitView }\"\n  data-cy=\"c8y-sv-list\"\n  #innerScrollDiv\n>\n  @if (title || hasAlerts) {\n    <div\n      class=\"flex-wrap flex-no-shrink sticky-top gap-8\"\n      [ngClass]=\"{\n        'card-header separator': title && shouldShowTitle\n      }\"\n    >\n      @if (title && shouldShowTitle) {\n        <h4 class=\"card-title\">\n          {{ title | translate }}\n        </h4>\n      }\n      <ng-content select=\"c8y-sv-header-actions\"></ng-content>\n      @if (hasAlerts) {\n        <ng-content select=\"c8y-sv-alerts\"></ng-content>\n      }\n    </div>\n  }\n  <div data-cy=\"c8y-sv-list--group\">\n    @if (loading && !showEmptyState) {\n      <div\n        class=\"sticky-top\"\n        style=\"top: 60px\"\n      >\n        <div class=\"p-absolute fit-w overflow-hidden p-b-4\">\n          <c8y-loading\n            [layout]=\"'page'\"\n            data-cy=\"c8y-sv-list--loading\"\n          ></c8y-loading>\n        </div>\n      </div>\n    }\n    <ng-content></ng-content>\n\n    @if (showEmptyState) {\n      <div class=\"p-relative p-l-24\">\n        <c8y-ui-empty-state\n          [icon]=\"emptyStateIcon\"\n          [title]=\"emptyStateTitle\"\n          [subtitle]=\"emptyStateSubtitle\"\n          data-cy=\"c8y-sv-list--empty-state\"\n        >\n          @if (docsUrl) {\n            <p c8y-guide-docs>\n              <small\n                translate\n                [translateParams]=\"{ docsUrl }\"\n                ngNonBindable\n              >\n                Find out more in the\n                <a c8y-guide-href=\"{{ docsUrl }}\">user documentation</a>.\n              </small>\n            </p>\n          }\n        </c8y-ui-empty-state>\n      </div>\n    }\n  </div>\n\n  <ng-content select=\"c8y-sv-footer\"></ng-content>\n</div>\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: GuideDocsComponent, selector: "[c8y-guide-docs]" }, { kind: "directive", type: GuideHrefDirective, selector: "[c8y-guide-href]", inputs: ["c8y-guide-href"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImport: i0, type: SplitViewListComponent, decorators: [{
             type: Component,
@@ -39898,7 +40120,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
                         C8yTranslateDirective,
                         GuideDocsComponent,
                         GuideHrefDirective
-                    ], template: "<div\n  class=\"inner-scroll fit-h\"\n  [attr.aria-label]=\"title | translate\"\n  role=\"region\"\n  [ngClass]=\"{ 'split-view__list bg-level-1': isSplitView, 'bg-component': !isSplitView }\"\n  data-cy=\"c8y-sv-list\"\n  #innerScrollDiv\n>\n  @if (title || hasAlerts) {\n    <div\n      class=\"flex-wrap flex-no-shrink sticky-top gap-8\"\n      [ngClass]=\"{\n        'card-header separator': title && shouldShowTitle\n      }\"\n    >\n      @if (title && shouldShowTitle) {\n        <h4 class=\"card-title\">\n          {{ title | translate }}\n        </h4>\n      }\n      <ng-content select=\"c8y-sv-header-actions\"></ng-content>\n      @if (hasAlerts) {\n        <ng-content select=\"c8y-sv-alerts\"></ng-content>\n      }\n    </div>\n  }\n  <div data-cy=\"c8y-sv-list--group\">\n    @if (loading && !showEmptyState) {\n      <div class=\"p-absolute fit-w overflow-hidden p-b-4\">\n        <c8y-loading\n          [layout]=\"'page'\"\n          data-cy=\"c8y-sv-list--loading\"\n        ></c8y-loading>\n      </div>\n    }\n    <ng-content></ng-content>\n\n    @if (showEmptyState) {\n      <div class=\"p-relative p-l-24\">\n        <c8y-ui-empty-state\n          [icon]=\"emptyStateIcon\"\n          [title]=\"emptyStateTitle\"\n          [subtitle]=\"emptyStateSubtitle\"\n          data-cy=\"c8y-sv-list--empty-state\"\n        >\n          @if (docsUrl) {\n            <p c8y-guide-docs>\n              <small\n                translate\n                [translateParams]=\"{ docsUrl }\"\n                ngNonBindable\n              >\n                Find out more in the\n                <a c8y-guide-href=\"{{ docsUrl }}\">user documentation</a>.\n              </small>\n            </p>\n          }\n        </c8y-ui-empty-state>\n      </div>\n    }\n  </div>\n\n  <ng-content select=\"c8y-sv-footer\"></ng-content>\n</div>\n" }]
+                    ], template: "<div\n  class=\"inner-scroll fit-h\"\n  [attr.aria-label]=\"title | translate\"\n  role=\"region\"\n  [ngClass]=\"{ 'split-view__list bg-level-1': isSplitView, 'bg-component': !isSplitView }\"\n  data-cy=\"c8y-sv-list\"\n  #innerScrollDiv\n>\n  @if (title || hasAlerts) {\n    <div\n      class=\"flex-wrap flex-no-shrink sticky-top gap-8\"\n      [ngClass]=\"{\n        'card-header separator': title && shouldShowTitle\n      }\"\n    >\n      @if (title && shouldShowTitle) {\n        <h4 class=\"card-title\">\n          {{ title | translate }}\n        </h4>\n      }\n      <ng-content select=\"c8y-sv-header-actions\"></ng-content>\n      @if (hasAlerts) {\n        <ng-content select=\"c8y-sv-alerts\"></ng-content>\n      }\n    </div>\n  }\n  <div data-cy=\"c8y-sv-list--group\">\n    @if (loading && !showEmptyState) {\n      <div\n        class=\"sticky-top\"\n        style=\"top: 60px\"\n      >\n        <div class=\"p-absolute fit-w overflow-hidden p-b-4\">\n          <c8y-loading\n            [layout]=\"'page'\"\n            data-cy=\"c8y-sv-list--loading\"\n          ></c8y-loading>\n        </div>\n      </div>\n    }\n    <ng-content></ng-content>\n\n    @if (showEmptyState) {\n      <div class=\"p-relative p-l-24\">\n        <c8y-ui-empty-state\n          [icon]=\"emptyStateIcon\"\n          [title]=\"emptyStateTitle\"\n          [subtitle]=\"emptyStateSubtitle\"\n          data-cy=\"c8y-sv-list--empty-state\"\n        >\n          @if (docsUrl) {\n            <p c8y-guide-docs>\n              <small\n                translate\n                [translateParams]=\"{ docsUrl }\"\n                ngNonBindable\n              >\n                Find out more in the\n                <a c8y-guide-href=\"{{ docsUrl }}\">user documentation</a>.\n              </small>\n            </p>\n          }\n        </c8y-ui-empty-state>\n      </div>\n    }\n  </div>\n\n  <ng-content select=\"c8y-sv-footer\"></ng-content>\n</div>\n" }]
         }], propDecorators: { title: [{
                 type: Input
             }], loading: [{
@@ -40010,5 +40232,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.18", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { ACTIONS_STEPPER, AGGREGATIONS, AGGREGATION_ICONS, AGGREGATION_LABELS, AGGREGATION_LIMITS, AGGREGATION_TEXTS, AGGREGATION_VALUES, AGGREGATION_VALUES_ARR, ARRAY_VALIDATION_PREFIX, ASSET_PATH, AbstractConfigurationStrategy, ActionBarComponent, ActionBarItemComponent, ActionBarModule, ActionBarService, ActionComponent, ActionControlsExtensionService, ActionModule, ActionOutletComponent, ActionService, AggregationPickerComponent, AggregationService, AlarmRealtimeService, AlarmWithChildrenRealtimeService, AlertComponent, AlertDetailsComponent, AlertModule, AlertOutletBase, AlertOutletComponent, AlertService, AlertTextComponent, AppHrefPipe, AppIconComponent, AppStateService, AppSwitcherComponent, AppSwitcherInlineComponent, AppSwitcherService, ApplicationModule, ApplicationPluginStatus, ApplyRangeClassPipe, AssetDefinitionsService, AssetHierarchyService, AssetLinkPipe, AssetPropertyService, AssetTypesRealtimeService, AssetTypesService, AuditLogComponent, AuditLogModule, AuthenticationModule, BackendVersionFactory, BaseColumn, BaseFilteringFormRendererComponent, BooleanFilterMapper, BootstrapComponent, BootstrapModule, BottomDrawerComponent, BottomDrawerRef, BottomDrawerService, BreadcrumbComponent, BreadcrumbItemComponent, BreadcrumbModule, BreadcrumbOutletComponent, BreadcrumbService, BuiltInActionType, BytesPipe, C8Y_PLUGIN_CONTEXT_PATH, C8Y_PLUGIN_NAME, C8yComponentOutlet, C8yJSONSchema, C8yStepper, C8yStepperButtons, C8yStepperIcon, C8yStepperProgress, C8yTranslateDirective, C8yTranslateModule, C8yTranslatePipe, C8yTranslationCache, C8yTranslationLoader, C8yValidators, CUSTOM, CachedLocaleDictionaryService, CellRendererComponent, CellRendererContext, CellRendererDefDirective, ChangeCurrentUserPasswordService, ChangeIconComponent, ClipboardModule, ClipboardService, ColorInputComponent, ColorService, ColumnDirective, CommonModule, ConditionalTabsOutletComponent, ConfigureCustomColumnComponent, ConfirmModalComponent, ContextRouteComponent, ContextRouteGuard, ContextRouteService, CookieBannerComponent, CopyDashboardDisabledReason, CoreModule, CoreSearchModule, CountdownIntervalComponent, CountdownIntervalModule, CurrentPasswordModalComponent, CustomColumn, CustomTranslateService, CustomTranslateStore, DATA_GRID_CONFIGURATION_CONTEXT, DATA_GRID_CONFIGURATION_CONTEXT_PROVIDER, DATA_GRID_CONFIGURATION_STRATEGY, DEFAULT_INTERVAL_STATE, DEFAULT_INTERVAL_VALUE, DEFAULT_INTERVAL_VALUES, DRAWER_ANIMATION_TIME, DashboardChildActionComponent, DashboardChildChange, DashboardChildComponent, DashboardChildTitleComponent, DashboardComponent, DashboardModule, DataGridComponent, DataGridModule, DataGridService, DatapointLibraryValidationErrors, DatapointSyncService, DateContextQueryParamNames, DateFilterMapper, DateFormatService, DatePickerComponent, DatePickerModule, DatePipe, DateTimePickerComponent, DateTimePickerModule, DefaultValidationDirective, DeviceBootstrapRealtimeService, DeviceService, DeviceStatusComponent, DeviceStatusModule, DismissAlertStrategy, DocsModule, DocsService, DrawerModule, DrawerOutletComponent, DrawerService, DropAreaComponent, DropAreaModule, DropdownDirectionDirective, DropdownFocusTrapDirective, DynamicBulkDetailsResolver, DynamicBulkIIdentifiedResolver, DynamicComponentAlert, DynamicComponentAlertAggregator, DynamicComponentAlertsComponent, DynamicComponentComponent, DynamicComponentErrorStrategy, DynamicComponentModule, DynamicComponentService, DynamicDatapointsResolver, DynamicFormsModule, DynamicManagedObjectResolver, DynamicResolverService, ES_MAX_TIME_MILLISECONDS, EmailsValidatorDirective, EmptyComponent, EmptyStateComponent, EmptyStateContextDirective, EventRealtimeService, ExpandableRowDirective, ExtensionPointForPlugins, ExtensionPointWithoutStateForPlugins, ExtractArrayValidationErrorsPipe, FeatureCacheService, FeedbackFormComponent, FilePickerComponent, FilePickerFormControlComponent, FilePickerFormControlModule, FilePickerModule, FilesService, FilterByPipe, FilterInputComponent, FilterMapperFactory, FilterMapperModule, FilterMapperPipe, FilterMapperService, FilterNonArrayValidationErrorsPipe, FilteringActionType, FilteringFormRendererComponent, FilteringFormRendererContext, FilteringFormRendererDefDirective, ForOfDirective, FormGroupComponent, FormsModule, GENERIC_FILE_TYPE, GLOBAL_CONTEXT_AUTO_REFRESH, GainsightService, GenericFileIconPipe, GeoService, GetGroupIconPipe, GlobalConfigService, GridDataSource, GroupFragment, GroupService, GroupedFilterChips, GuideDocsComponent, GuideHrefDirective, HOOK_ACTION, HOOK_ACTION_BAR, HOOK_BREADCRUMB, HOOK_COMPONENTS, HOOK_CURRENT_APPLICATION, HOOK_CURRENT_TENANT, HOOK_CURRENT_USER, HOOK_DOCS, HOOK_DYNAMIC_PROVIDER_CONFIG, HOOK_NAVIGATOR_NODES, HOOK_OPTIONS, HOOK_PATTERN_MESSAGES, HOOK_PLUGIN, HOOK_PREVIEW, HOOK_QUERY_PARAM, HOOK_QUERY_PARAM_BOTTOM_DRAWER, HOOK_QUERY_PARAM_MODAL, HOOK_ROUTE, HOOK_SEARCH, HOOK_STEPPER, HOOK_TABS, HOOK_VERSION, HOOK_WIZARD, HeaderBarComponent, HeaderCellRendererDefDirective, HeaderModule, HeaderService, HelpComponent, HelpModule, HighlightComponent, HookProviderTypes, HumanizeAppNamePipe, HumanizePipe, HumanizeValidationMessagePipe, I18nModule, INTERVAL_OPTIONS, IconDirective, IconPanelComponent, IfAllowedDirective, InjectionType, InputGroupListComponent, InputGroupListContainerDirective, InterAppService, IntervalBasedReload, InventorySearchService, IpRangeInputListComponent, JsonValidationPrettifierDirective, LANGUAGES, LAST_DAY, LAST_HOUR, LAST_MINUTE, LAST_MONTH, LAST_WEEK, LOCALE_PATH, LegacyGridConfigMapperService, LegendFieldWrapper, ListDisplaySwitchComponent, ListDisplaySwitchModule, ListGroupComponent, ListGroupModule, ListItemActionComponent, ListItemBodyComponent, ListItemCheckboxComponent, ListItemCollapseComponent, ListItemComponent, ListItemDragHandleComponent, ListItemFooterComponent, ListItemIconComponent, ListItemRadioComponent, ListItemTimelineComponent, LoadMoreComponent, LoadingComponent, MAX_PAGE_SIZE, MESSAGES_CORE_I18N, MOChunkLoaderService, ManagedObjectRealtimeService, ManagedObjectType, MapFunctionPipe, MarkdownToHtmlPipe, MaxValidationDirective, MeasurementRealtimeService, MessageBannerService, MessageDirective, MessagesComponent, MinValidationDirective, MissingTranslationCustomHandler, MoNamePipe, ModalComponent, ModalModule, ModalSelectionMode, ModalService, NEEDED_ROLE_FOR_SETUP, NEW_DASHBOARD_ROUTER_STATE_PROP, NULL_VALUE_PLACEHOLDER, NUMBER_FORMAT_REGEXP, NameTransformPipe, NavigatorBottomModule, NavigatorIconComponent, NavigatorModule, NavigatorNode, NavigatorNodeComponent, NavigatorNodeRoot, NavigatorOutletComponent, NavigatorService, NavigatorTopModule, NewPasswordComponent, NumberPipe, OperationBulkRealtimeService, OperationRealtimeService, OperationResultComponent, OptionsService, OutletDirective, PREVIEW_FEATURE_PROVIDERS, PRODUCT_EXPERIENCE_EVENT_SOURCE, PX_ACTIONS, PX_EVENT_NAME, PackageType, PasswordCheckListComponent, PasswordConfirm, PasswordConfirmModalComponent, PasswordInputComponent, PasswordService, PasswordStrengthCheckerService, PasswordStrengthComponent, PasswordStrengthService, PasswordValidationDirective, PasswordValidationService, PatternMessagesService, Permissions, PhoneValidationDirective, PlatformDetailsService, PluginLoadedPipe, PluginsExportScopes, PluginsLoaderService, PluginsModule, PluginsResolveService, PluginsService, PopoverConfirmComponent, PreviewFeatureButtonComponent, PreviewFeatureShowNotification, PreviewService, ProductExperienceDirective, ProductExperienceModule, ProgressBarComponent, PropertiesListComponent, PropertiesListModule, PropertyValueTransformService, ProviderConfigurationComponent, ProviderConfigurationModule, ProviderConfigurationNodeFactory, ProviderConfigurationRouteFactory, ProviderConfigurationService, ProviderDefinitionsService, PushStatus, PushStatusLabels, QUERY_PARAM_HANDLER_PROVIDERS, QueryParamBottomDrawerFactory, QueryParamBottomDrawerStateService, QueryParamHandlerService, QueryParamModalFactory, QueryParamModalStateService, QuickLinkComponent, QuickLinkModule, RESOLVING_COMPONENT_WAIT_TIME, RadioFilterMapper, RangeComponent, RangeDirective, RangeDisplayComponent, RangeDisplayModule, RealtimeButtonComponent, RealtimeControlComponent, RealtimeMessage, RealtimeModule, RealtimeService, RealtimeSubjectService, RelativeTimePipe, RequiredInputPlaceholderDirective, ResizableGridComponent, ResolverServerError, RouterModule, RouterService, RouterTabsResolver, SETUP_FINISHED_STEP_ID, SHOW_PREVIEW_FEATURES, SearchComponent, SearchFilters, SearchInputComponent, SearchOutletComponent, SearchResultEmptyComponent, SearchService, SelectComponent, SelectFilterMapper, SelectItemDirective, SelectKeyboardService, SelectLegacyComponent, SelectModalComponent, SelectModalFilterPipe, SelectModalModule, SelectModule, SelectedItemsComponent, SelectedItemsDirective, SendStatus, SendStatusLabels, ServiceRegistry, SetupCompletedComponent, SetupComponent, SetupModule, SetupService, SetupState, SetupStepperFactory, ShortenUserNamePipe, ShouldShowMoPipe, ShowIfFilterPipe, SimpleJsonPathValidatorDirective, SimplifiedAuthService, SkipLinkDirective, SplitViewAlertsComponent, SplitViewComponent, SplitViewDetailsActionsComponent, SplitViewDetailsComponent, SplitViewExtraHeaderComponent, SplitViewFooterComponent, SplitViewHeaderActionsComponent, SplitViewListComponent, SplitViewListItemDirective, SplitViewSelectionService, StateService, Status, StepperModule, StepperOutletComponent, StepperService, Steppers, StringFilterMapper, StringifyObjectPipe, StripHtmlPipe, SupportedApps, TabComponent, TabsModule, TabsOutletComponent, TabsService, TabsetAriaDirective, TenantUiService, TextAreaRowHeightDirective, TextareaAutoresizeDirective, ThemeSwitcherService, TimeIntervalComponent, TimePickerComponent, TimePickerModule, TitleComponent, TitleOutletComponent, TotpChallengeComponent, TotpSetupComponent, TranslateService, TreeNodeCellRendererComponent, TreeNodeColumn, TreeNodeHeaderCellRendererComponent, TypeaheadComponent, TypeaheadFilterMapper, UiSettingsComponent, UiSettingsModule, UniqueInCollectionByPathValidationDirective, UserEditComponent, UserEditModalComponent, UserEngagementsService, UserMenuItemComponent, UserMenuOutletComponent, UserMenuService, UserModule, UserNameInitialsPipe, UserPreferencesConfigurationStrategy, UserPreferencesService, UserPreferencesStorageInventory, UserPreferencesStorageLocal, UserTotpRevokeComponent, UserTotpSetupComponent, VERSION_MODULE_CONFIG, ValidationPattern, VersionListComponent, VersionModule, VersionService, ViewContext, ViewContextServices, VirtualScrollListenerDirective, VirtualScrollWindowDirective, VirtualScrollWindowStrategy, VirtualScrollerWrapperComponent, VisibleControlsPipe, WIDGET_CONFIGURATION_GRID_SIZE, WIDGET_TYPE_VALUES, WILDCARD_SEARCH_FEATURE_KEY, WebSDKVersionFactory, WidgetActionWrapperComponent, WidgetGlobalAutoRefreshService, WidgetTimeContextActionBarPriority, WidgetTimeContextComponent, WidgetTimeContextDateRangeService, WidgetTimeContextMediatorService, WidgetsDashboardComponent, WidgetsDashboardEventService, WizardBodyComponent, WizardComponent, WizardFooterComponent, WizardHeaderComponent, WizardModalService, WizardModule, WizardOutletComponent, WizardService, ZipService, _virtualScrollWindowStrategyFactory, alertOnError, allEntriesAreEqual, asyncValidateArrayElements, colorValidator, deviceAvailabilityIconMap, extraRoutes, fromFactories, fromTrigger, fromTriggerOnce, getActivatedRoute, getAngularLocalesLanguageString, getBasicInputArrayFormFieldConfig, getDictionaryWithTrimmedKeys, getInjectedHooks, gettext, globalAutoRefreshLoading, hookAction, hookActionBar, hookBreadcrumb, hookComponent, hookCurrentApplication, hookCurrentTenant, hookCurrentUser, hookDataGridActionControls, hookDocs, hookDrawer, hookDynamicProviderConfig, hookFilterMapper, hookGeneric, hookNavigator, hookOptions, hookPatternMessages, hookPlugin, hookPreview, hookQueryParam, hookQueryParamBottomDrawer, hookQueryParamModal, hookRoute, hookSearch, hookService, hookStepper, hookTab, hookUserMenu, hookVersion, hookWidget, hookWizard, internalApps, isEagerDynamicComponents, isExtensionFactory, isLazyDynamicComponents, isPromise, languagesFactory, loadLocale, localeId, localePathFactory, memoize, minColumnGridTrackSize, operationStatusClasses, operationStatusIcons, provideBootstrapMetadata, provideCommonPipes, provideCommonServices, provideDefaultOptionsAppInitializer, provideI18n, provideLanguageSelectorAppInitializer, providePluginsLoaderServiceAppInitializer, provideTranslationServiceInstance, ratiosByColumnTypes, removeContextIndicators, removeDuplicatesIds, resolveInjectedFactories, retryWithDelay, simpleJsonPathValidator, sortByPriority, stateToFactory, statusAlert, statusClasses, statusIcons, throttle, toObservable, toObservableOfArrays, tooltips, trimTranslationKey, uniqueInCollectionByPathValidator, validateArrayElements, validateInternationalPhoneNumber, viewContextRoutes, wrapperLegendFieldConfig };
+export { ACTIONS_STEPPER, AGGREGATIONS, AGGREGATION_ICONS, AGGREGATION_LABELS, AGGREGATION_LIMITS, AGGREGATION_TEXTS, AGGREGATION_VALUES, AGGREGATION_VALUES_ARR, ARRAY_VALIDATION_PREFIX, ASSET_PATH, AbstractConfigurationStrategy, ActionBarComponent, ActionBarItemComponent, ActionBarModule, ActionBarService, ActionComponent, ActionControlsExtensionService, ActionModule, ActionOutletComponent, ActionService, AggregationPickerComponent, AggregationService, AlarmRealtimeService, AlarmWithChildrenRealtimeService, AlertComponent, AlertDetailsComponent, AlertModule, AlertOutletBase, AlertOutletComponent, AlertService, AlertTextComponent, AppHrefPipe, AppIconComponent, AppStateService, AppSwitcherComponent, AppSwitcherInlineComponent, AppSwitcherService, ApplicationModule, ApplicationPluginStatus, ApplyRangeClassPipe, AssetDefinitionsService, AssetHierarchyService, AssetLinkPipe, AssetPropertyService, AssetTypesRealtimeService, AssetTypesService, AuditLogComponent, AuditLogModule, AuthenticationModule, BackendVersionFactory, BaseColumn, BaseFilteringFormRendererComponent, BooleanFilterMapper, BootstrapComponent, BootstrapModule, BottomDrawerComponent, BottomDrawerRef, BottomDrawerService, BreadcrumbComponent, BreadcrumbItemComponent, BreadcrumbModule, BreadcrumbOutletComponent, BreadcrumbService, BuiltInActionType, BytesPipe, C8Y_PLUGIN_CONTEXT_PATH, C8Y_PLUGIN_NAME, C8yComponentOutlet, C8yJSONSchema, C8yStepper, C8yStepperButtons, C8yStepperIcon, C8yStepperProgress, C8yTranslateDirective, C8yTranslateModule, C8yTranslatePipe, C8yTranslationCache, C8yTranslationLoader, C8yValidators, CUSTOM, CachedLocaleDictionaryService, CellRendererComponent, CellRendererContext, CellRendererDefDirective, ChangeCurrentUserPasswordService, ChangeIconComponent, ClipboardModule, ClipboardService, ColorInputComponent, ColorService, ColumnDirective, CommonModule, ConditionalTabsOutletComponent, ConfigureCustomColumnComponent, ConfirmModalComponent, ContextRouteComponent, ContextRouteGuard, ContextRouteService, CookieBannerComponent, CopyDashboardDisabledReason, CoreModule, CoreSearchModule, CountdownIntervalComponent, CountdownIntervalModule, CurrentPasswordModalComponent, CustomColumn, CustomTranslateService, CustomTranslateStore, DATA_GRID_CONFIGURATION_CONTEXT, DATA_GRID_CONFIGURATION_CONTEXT_PROVIDER, DATA_GRID_CONFIGURATION_STRATEGY, DEFAULT_INTERVAL_STATE, DEFAULT_INTERVAL_VALUE, DEFAULT_INTERVAL_VALUES, DRAWER_ANIMATION_TIME, DashboardChildActionComponent, DashboardChildChange, DashboardChildComponent, DashboardChildTitleComponent, DashboardComponent, DashboardModule, DataGridComponent, DataGridModule, DataGridService, DatapointLibraryValidationErrors, DatapointSyncService, DateContextQueryParamNames, DateFilterMapper, DateFormatService, DatePickerComponent, DatePickerModule, DatePipe, DateTimePickerComponent, DateTimePickerModule, DefaultValidationDirective, DeviceBootstrapRealtimeService, DeviceService, DeviceStatusComponent, DeviceStatusModule, DismissAlertStrategy, DocsModule, DocsService, DrawerModule, DrawerOutletComponent, DrawerService, DropAreaComponent, DropAreaModule, DropdownDirectionDirective, DropdownFocusTrapDirective, DynamicBulkDetailsResolver, DynamicBulkIIdentifiedResolver, DynamicComponentAlert, DynamicComponentAlertAggregator, DynamicComponentAlertsComponent, DynamicComponentComponent, DynamicComponentErrorStrategy, DynamicComponentModule, DynamicComponentService, DynamicDatapointsResolver, DynamicFormsModule, DynamicManagedObjectResolver, DynamicResolverService, ES_MAX_TIME_MILLISECONDS, EmailsValidatorDirective, EmptyComponent, EmptyStateComponent, EmptyStateContextDirective, EventRealtimeService, ExpandableRowDirective, ExtensionPointForPlugins, ExtensionPointWithoutStateForPlugins, ExtractArrayValidationErrorsPipe, FeatureCacheService, FeedbackFormComponent, FilePickerComponent, FilePickerFormControlComponent, FilePickerFormControlModule, FilePickerModule, FilesService, FilterByPipe, FilterInputComponent, FilterMapperFactory, FilterMapperModule, FilterMapperPipe, FilterMapperService, FilterNonArrayValidationErrorsPipe, FilteringActionType, FilteringFormRendererComponent, FilteringFormRendererContext, FilteringFormRendererDefDirective, ForOfDirective, FormGroupComponent, FormsModule, GENERIC_FILE_TYPE, GLOBAL_CONTEXT_AUTO_REFRESH, GainsightService, GenericFileIconPipe, GeoService, GetGroupIconPipe, GlobalConfigService, GridDataSource, GroupFragment, GroupService, GroupedFilterChips, GuideDocsComponent, GuideHrefDirective, HOOK_ACTION, HOOK_ACTION_BAR, HOOK_BREADCRUMB, HOOK_COMPONENTS, HOOK_CURRENT_APPLICATION, HOOK_CURRENT_TENANT, HOOK_CURRENT_USER, HOOK_DOCS, HOOK_DYNAMIC_PROVIDER_CONFIG, HOOK_NAVIGATOR_NODES, HOOK_OPTIONS, HOOK_PATTERN_MESSAGES, HOOK_PLUGIN, HOOK_PREVIEW, HOOK_QUERY_PARAM, HOOK_QUERY_PARAM_BOTTOM_DRAWER, HOOK_QUERY_PARAM_MODAL, HOOK_ROUTE, HOOK_SEARCH, HOOK_STEPPER, HOOK_TABS, HOOK_VERSION, HOOK_WIZARD, HeaderBarComponent, HeaderCellRendererDefDirective, HeaderModule, HeaderService, HelpComponent, HelpModule, HighlightComponent, HookProviderTypes, HumanizeAppNamePipe, HumanizePipe, HumanizeValidationMessagePipe, I18nModule, INTERVAL_OPTIONS, IconDirective, IconPanelComponent, IfAllowedDirective, InjectionType, InputGroupEditableComponent, InputGroupListComponent, InputGroupListContainerDirective, InterAppService, IntervalBasedReload, InventorySearchService, IpRangeInputListComponent, JsonValidationPrettifierDirective, LANGUAGES, LAST_DAY, LAST_HOUR, LAST_MINUTE, LAST_MONTH, LAST_WEEK, LOCALE_PATH, LegacyGridConfigMapperService, LegendFieldWrapper, ListDisplaySwitchComponent, ListDisplaySwitchModule, ListGroupComponent, ListGroupModule, ListItemActionComponent, ListItemBodyComponent, ListItemCheckboxComponent, ListItemCollapseComponent, ListItemComponent, ListItemDragHandleComponent, ListItemFooterComponent, ListItemIconComponent, ListItemRadioComponent, ListItemTimelineComponent, LoadMoreComponent, LoadingComponent, MAX_PAGE_SIZE, MESSAGES_CORE_I18N, MOChunkLoaderService, ManagedObjectRealtimeService, ManagedObjectType, MapFunctionPipe, MarkdownToHtmlPipe, MaxValidationDirective, MeasurementRealtimeService, MessageBannerService, MessageDirective, MessagesComponent, MinValidationDirective, MissingTranslationCustomHandler, MoNamePipe, ModalComponent, ModalModule, ModalSelectionMode, ModalService, NEEDED_ROLE_FOR_SETUP, NEW_DASHBOARD_ROUTER_STATE_PROP, NULL_VALUE_PLACEHOLDER, NUMBER_FORMAT_REGEXP, NameTransformPipe, NavigatorBottomModule, NavigatorIconComponent, NavigatorModule, NavigatorNode, NavigatorNodeComponent, NavigatorNodeRoot, NavigatorOutletComponent, NavigatorService, NavigatorTopModule, NewPasswordComponent, NumberPipe, OperationBulkRealtimeService, OperationRealtimeService, OperationResultComponent, OptionsService, OutletDirective, PREVIEW_FEATURE_PROVIDERS, PRODUCT_EXPERIENCE_EVENT_SOURCE, PX_ACTIONS, PX_EVENT_NAME, PackageType, PasswordCheckListComponent, PasswordConfirm, PasswordConfirmModalComponent, PasswordInputComponent, PasswordService, PasswordStrengthCheckerService, PasswordStrengthComponent, PasswordStrengthService, PasswordValidationDirective, PasswordValidationService, PatternMessagesService, Permissions, PhoneValidationDirective, PlatformDetailsService, PluginLoadedPipe, PluginsExportScopes, PluginsLoaderService, PluginsModule, PluginsResolveService, PluginsService, PopoverConfirmComponent, PreviewFeatureButtonComponent, PreviewFeatureShowNotification, PreviewService, ProductExperienceDirective, ProductExperienceModule, ProgressBarComponent, PropertiesListComponent, PropertiesListModule, PropertyValueTransformService, ProviderConfigurationComponent, ProviderConfigurationModule, ProviderConfigurationNodeFactory, ProviderConfigurationRouteFactory, ProviderConfigurationService, ProviderDefinitionsService, PushStatus, PushStatusLabels, QUERY_PARAM_HANDLER_PROVIDERS, QueryParamBottomDrawerFactory, QueryParamBottomDrawerStateService, QueryParamHandlerService, QueryParamModalFactory, QueryParamModalStateService, QuickLinkComponent, QuickLinkModule, RESOLVING_COMPONENT_WAIT_TIME, RadioFilterMapper, RangeComponent, RangeDirective, RangeDisplayComponent, RangeDisplayModule, RealtimeButtonComponent, RealtimeControlComponent, RealtimeMessage, RealtimeModule, RealtimeService, RealtimeSubjectService, RelativeTimePipe, RequiredInputPlaceholderDirective, ResizableGridComponent, ResolverServerError, RouterModule, RouterService, RouterTabsResolver, SETUP_FINISHED_STEP_ID, SHOW_PREVIEW_FEATURES, SearchComponent, SearchFilters, SearchInputComponent, SearchOutletComponent, SearchResultEmptyComponent, SearchService, SelectComponent, SelectFilterMapper, SelectItemDirective, SelectKeyboardService, SelectLegacyComponent, SelectModalComponent, SelectModalFilterPipe, SelectModalModule, SelectModule, SelectedItemsComponent, SelectedItemsDirective, SendStatus, SendStatusLabels, ServiceRegistry, SetupCompletedComponent, SetupComponent, SetupModule, SetupService, SetupState, SetupStepperFactory, ShortenUserNamePipe, ShouldShowMoPipe, ShowIfFilterPipe, SimpleJsonPathValidatorDirective, SimplifiedAuthService, SkipLinkDirective, SplitViewAlertsComponent, SplitViewComponent, SplitViewDetailsActionsComponent, SplitViewDetailsComponent, SplitViewExtraHeaderComponent, SplitViewFooterComponent, SplitViewHeaderActionsComponent, SplitViewListComponent, SplitViewListItemDirective, SplitViewSelectionService, StateService, Status, StepperModule, StepperOutletComponent, StepperService, Steppers, StringFilterMapper, StringifyObjectPipe, StripHtmlPipe, SupportedApps, TabComponent, TabsModule, TabsOutletComponent, TabsService, TabsetAriaDirective, TenantUiService, TextAreaRowHeightDirective, TextareaAutoresizeDirective, ThemeSwitcherService, TimeIntervalComponent, TimePickerComponent, TimePickerModule, TitleComponent, TitleOutletComponent, TotpChallengeComponent, TotpSetupComponent, TranslateService, TreeNodeCellRendererComponent, TreeNodeColumn, TreeNodeHeaderCellRendererComponent, TypeaheadComponent, TypeaheadFilterMapper, UiSettingsComponent, UiSettingsModule, UniqueInCollectionByPathValidationDirective, UserEditComponent, UserEditModalComponent, UserEngagementsService, UserMenuItemComponent, UserMenuOutletComponent, UserMenuService, UserModule, UserNameInitialsPipe, UserPreferencesConfigurationStrategy, UserPreferencesService, UserPreferencesStorageInventory, UserPreferencesStorageLocal, UserTotpRevokeComponent, UserTotpSetupComponent, VERSION_MODULE_CONFIG, ValidationPattern, VersionListComponent, VersionModule, VersionService, ViewContext, ViewContextServices, VirtualScrollListenerDirective, VirtualScrollWindowDirective, VirtualScrollWindowStrategy, VirtualScrollerWrapperComponent, VisibleControlsPipe, WIDGET_CONFIGURATION_GRID_SIZE, WIDGET_TYPE_VALUES, WILDCARD_SEARCH_FEATURE_KEY, WebSDKVersionFactory, WidgetActionWrapperComponent, WidgetGlobalAutoRefreshService, WidgetTimeContextActionBarPriority, WidgetTimeContextComponent, WidgetTimeContextDateRangeService, WidgetTimeContextMediatorService, WidgetsDashboardComponent, WidgetsDashboardEventService, WizardBodyComponent, WizardComponent, WizardFooterComponent, WizardHeaderComponent, WizardModalService, WizardModule, WizardOutletComponent, WizardService, ZipService, _virtualScrollWindowStrategyFactory, alertOnError, allEntriesAreEqual, asyncValidateArrayElements, colorValidator, deviceAvailabilityIconMap, extraRoutes, fromFactories, fromTrigger, fromTriggerOnce, getActivatedRoute, getAngularLocalesLanguageString, getBasicInputArrayFormFieldConfig, getDictionaryWithTrimmedKeys, getInjectedHooks, gettext, globalAutoRefreshLoading, hookAction, hookActionBar, hookBreadcrumb, hookComponent, hookCurrentApplication, hookCurrentTenant, hookCurrentUser, hookDataGridActionControls, hookDocs, hookDrawer, hookDynamicProviderConfig, hookFilterMapper, hookGeneric, hookNavigator, hookOptions, hookPatternMessages, hookPlugin, hookPreview, hookQueryParam, hookQueryParamBottomDrawer, hookQueryParamModal, hookRoute, hookSearch, hookService, hookStepper, hookTab, hookUserMenu, hookVersion, hookWidget, hookWizard, internalApps, isEagerDynamicComponents, isExtensionFactory, isLazyDynamicComponents, isPromise, languagesFactory, loadLocale, localeId, localePathFactory, memoize, minColumnGridTrackSize, operationStatusClasses, operationStatusIcons, provideBootstrapMetadata, provideCommonPipes, provideCommonServices, provideDefaultOptionsAppInitializer, provideI18n, provideLanguageSelectorAppInitializer, providePluginsLoaderServiceAppInitializer, provideTranslationServiceInstance, ratiosByColumnTypes, removeContextIndicators, removeDuplicatesIds, resolveInjectedFactories, retryWithDelay, simpleJsonPathValidator, sortByPriority, stateToFactory, statusAlert, statusClasses, statusIcons, throttle, toObservable, toObservableOfArrays, tooltips, trimTranslationKey, uniqueInCollectionByPathValidator, validateArrayElements, validateInternationalPhoneNumber, viewContextRoutes, wrapperLegendFieldConfig };
 //# sourceMappingURL=c8y-ngx-components.mjs.map