@c8y/ngx-components 1018.0.176 → 1018.0.183

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (38) hide show
  1. package/core/bootstrap/cookie-banner/cookie-banner.service.d.ts +1 -1
  2. package/core/common/ApplicationOptions.d.ts +2 -0
  3. package/core/date-time-picker/close-date-picker.directive.d.ts +14 -0
  4. package/core/date-time-picker/date-time-picker.component.d.ts +7 -2
  5. package/core/date-time-picker/date-time-picker.module.d.ts +8 -7
  6. package/core/product-experience/gainsight.service.d.ts +86 -28
  7. package/core/product-experience/index.d.ts +1 -0
  8. package/core/product-experience/product-experience.module.d.ts +18 -5
  9. package/core/product-experience/user-engagements.service.d.ts +109 -0
  10. package/core/user/user-edit-modal.component.d.ts +33 -6
  11. package/core/user/user-edit.component.d.ts +6 -11
  12. package/esm2020/context-dashboard/widget-config.component.mjs +3 -3
  13. package/esm2020/core/bootstrap/cookie-banner/cookie-banner.service.mjs +2 -2
  14. package/esm2020/core/common/ApplicationOptions.mjs +1 -1
  15. package/esm2020/core/date-time-picker/close-date-picker.directive.mjs +36 -0
  16. package/esm2020/core/date-time-picker/date-time-picker.component.mjs +28 -8
  17. package/esm2020/core/date-time-picker/date-time-picker.module.mjs +4 -3
  18. package/esm2020/core/product-experience/gainsight.service.mjs +170 -81
  19. package/esm2020/core/product-experience/index.mjs +2 -1
  20. package/esm2020/core/product-experience/product-experience.module.mjs +42 -24
  21. package/esm2020/core/product-experience/user-engagements.service.mjs +174 -0
  22. package/esm2020/core/user/user-edit-modal.component.mjs +68 -33
  23. package/esm2020/core/user/user-edit.component.mjs +30 -39
  24. package/esm2020/datapoint-selector/datapoint-attributes-form/datapoint-attributes-form.component.mjs +3 -3
  25. package/fesm2015/c8y-ngx-components-context-dashboard.mjs +2 -2
  26. package/fesm2015/c8y-ngx-components-context-dashboard.mjs.map +1 -1
  27. package/fesm2015/c8y-ngx-components-datapoint-selector.mjs +2 -2
  28. package/fesm2015/c8y-ngx-components-datapoint-selector.mjs.map +1 -1
  29. package/fesm2015/c8y-ngx-components.mjs +516 -167
  30. package/fesm2015/c8y-ngx-components.mjs.map +1 -1
  31. package/fesm2020/c8y-ngx-components-context-dashboard.mjs +2 -2
  32. package/fesm2020/c8y-ngx-components-context-dashboard.mjs.map +1 -1
  33. package/fesm2020/c8y-ngx-components-datapoint-selector.mjs +2 -2
  34. package/fesm2020/c8y-ngx-components-datapoint-selector.mjs.map +1 -1
  35. package/fesm2020/c8y-ngx-components.mjs +511 -161
  36. package/fesm2020/c8y-ngx-components.mjs.map +1 -1
  37. package/locales/locales.pot +2 -2
  38. package/package.json +1 -1
@@ -276,7 +276,7 @@ DatapointAttributesFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion:
276
276
  useExisting: forwardRef(() => DatapointAttributesFormComponent),
277
277
  multi: true
278
278
  }
279
- ], ngImport: i0, template: "<div [formGroup]=\"formGroup\" *ngIf=\"!rawValue?.__template || showFormIfTemplateWasSelected\">\n <fieldset\n class=\"c8y-fieldset\"\n *ngIf=\"formGroup.controls?.label || formGroup.controls?.unit || formGroup.controls?.target\"\n >\n <legend translate>Details</legend>\n <div class=\"row\">\n <div class=\"col-md-6\" *ngIf=\"formGroup.controls?.label\">\n <c8y-form-group>\n <label translate>Label</label>\n <input\n class=\"form-control\"\n name=\"label\"\n formControlName=\"label\"\n [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'Temperature' }\"\n />\n <c8y-messages\n [show]=\"formGroup.controls.label.touched && formGroup.controls.label.errors\"\n >\n <c8y-message\n *ngFor=\"let item of customValidationErrorMessages['label'] | keyvalue\"\n [name]=\"item.key\"\n [text]=\"item.value\"\n ></c8y-message>\n </c8y-messages>\n </c8y-form-group>\n </div>\n\n <div class=\"col-md-6\" *ngIf=\"formGroup.controls?.unit\">\n <c8y-form-group>\n <label translate>Unit</label>\n <input\n class=\"form-control\"\n name=\"unit\"\n formControlName=\"unit\"\n [placeholder]=\"'e.g. {{ example }}' | translate: { example: '\u00BAC' }\"\n />\n <c8y-messages [show]=\"formGroup.controls.unit.touched && formGroup.controls.unit.errors\">\n <c8y-message\n *ngFor=\"let item of customValidationErrorMessages['unit'] | keyvalue\"\n [name]=\"item.key\"\n [text]=\"item.value\"\n ></c8y-message>\n </c8y-messages>\n </c8y-form-group>\n </div>\n\n <div class=\"col-md-6\" *ngIf=\"formGroup.controls?.target && showTarget\">\n <c8y-form-group\n [ngClass]=\"{\n 'has-error':\n (range?.touched || formGroup.controls.target.touched) &&\n formGroup.controls?.target?.errors\n }\"\n >\n <label translate>Target</label>\n <input\n type=\"number\"\n class=\"form-control\"\n name=\"target\"\n formControlName=\"target\"\n [placeholder]=\"'e.g. {{ example }}' | translate: { example: 25 }\"\n />\n <c8y-messages\n [show]=\"\n (range?.touched || formGroup.controls.target.touched) &&\n formGroup.controls.target.errors\n \"\n >\n <c8y-message\n *ngFor=\"let item of customValidationErrorMessages['target'] | keyvalue\"\n [name]=\"item.key\"\n [text]=\"item.value\"\n ></c8y-message>\n </c8y-messages>\n </c8y-form-group>\n </div>\n </div>\n </fieldset>\n <fieldset class=\"c8y-fieldset\" *ngIf=\"range && showRange\">\n <legend translate>Range</legend>\n <div class=\"row\" formGroupName=\"range\">\n <div class=\"col-md-6\">\n <c8y-form-group [ngClass]=\"{ 'has-error': range?.touched && range?.controls?.min?.errors }\">\n <label translate>Min</label>\n <input\n type=\"number\"\n class=\"form-control\"\n name=\"min\"\n formControlName=\"min\"\n [placeholder]=\"'e.g. {{ example }}' | translate: { example: 0 }\"\n />\n <c8y-messages [show]=\"range?.touched && range.controls?.min?.errors\"></c8y-messages>\n </c8y-form-group>\n </div>\n <div class=\"col-md-6\">\n <c8y-form-group [ngClass]=\"{ 'has-error': range?.touched && range?.controls?.max?.errors }\">\n <label translate>Max</label>\n <input\n type=\"number\"\n class=\"form-control\"\n name=\"max\"\n formControlName=\"max\"\n [placeholder]=\"'e.g. {{ example }}' | translate: { example: 100 }\"\n />\n <c8y-messages [show]=\"range?.touched && range.controls?.max?.errors\">\n <c8y-message\n *ngFor=\"let item of customValidationErrorMessages['max'] | keyvalue\"\n [name]=\"item.key\"\n [text]=\"item.value\"\n ></c8y-message>\n </c8y-messages>\n </c8y-form-group>\n </div>\n </div>\n </fieldset>\n\n <fieldset class=\"c8y-fieldset\" formGroupName=\"yellowRange\" *ngIf=\"yellowRange && showYellowRange\">\n <legend translate>Yellow range</legend>\n <div class=\"row\">\n <div class=\"col-md-6\">\n <c8y-form-group\n [ngClass]=\"{\n 'has-error':\n (range?.touched || yellowRange?.touched) && yellowRange?.controls?.min?.errors\n }\"\n >\n <label translate>Min</label>\n <input\n type=\"number\"\n class=\"form-control\"\n name=\"min\"\n formControlName=\"min\"\n [placeholder]=\"'e.g. {{ example }}' | translate: { example: 50 }\"\n />\n <c8y-messages\n [show]=\"(range?.touched || yellowRange?.touched) && yellowRange.controls?.min?.errors\"\n ></c8y-messages>\n </c8y-form-group>\n </div>\n\n <div class=\"col-md-6\">\n <c8y-form-group\n [ngClass]=\"{\n 'has-error':\n (range?.touched || yellowRange?.touched) && yellowRange?.controls?.max?.errors\n }\"\n >\n <label translate>Max</label>\n <input\n type=\"number\"\n class=\"form-control\"\n name=\"max\"\n formControlName=\"max\"\n [placeholder]=\"'e.g. {{ example }}' | translate: { example: 75 }\"\n />\n <c8y-messages\n [show]=\"(range?.touched || yellowRange?.touched) && yellowRange.controls?.max?.errors\"\n ></c8y-messages>\n </c8y-form-group>\n </div>\n </div>\n </fieldset>\n\n <fieldset class=\"c8y-fieldset\" formGroupName=\"redRange\" *ngIf=\"redRange && showRedRange\">\n <legend translate>Red range</legend>\n <div class=\"row\">\n <div class=\"col-md-6\">\n <c8y-form-group\n [ngClass]=\"{\n 'has-error': (range?.touched || redRange?.touched) && redRange?.controls?.min?.errors\n }\"\n >\n <label translate>Min</label>\n <input\n type=\"number\"\n class=\"form-control\"\n name=\"min\"\n formControlName=\"min\"\n [placeholder]=\"'e.g. {{ example }}' | translate: { example: 75 }\"\n />\n <c8y-messages\n [show]=\"(range?.touched || redRange?.touched) && redRange.controls?.min?.errors\"\n ></c8y-messages>\n </c8y-form-group>\n </div>\n\n <div class=\"col-md-6\">\n <c8y-form-group\n [ngClass]=\"{\n 'has-error': (range?.touched || redRange?.touched) && redRange?.controls?.max?.errors\n }\"\n >\n <label translate>Max</label>\n <input\n type=\"number\"\n class=\"form-control\"\n name=\"max\"\n formControlName=\"max\"\n [placeholder]=\"'e.g. {{ example }}' | translate: { example: 100 }\"\n />\n <c8y-messages\n [show]=\"(range?.touched || redRange?.touched) && redRange.controls?.max?.errors\"\n ></c8y-messages>\n </c8y-form-group>\n </div>\n </div>\n </fieldset>\n\n <fieldset class=\"c8y-fieldset\" *ngIf=\"chart && showChart\" formGroupName=\"chart\">\n <legend translate>Chart</legend>\n <div class=\"tight-grid\">\n <div class=\"col-xs-6 col-sm-4\">\n <c8y-form-group>\n <label for=\"display\">\n {{ 'Display' | translate }}\n <button\n class=\"btn-help btn-help--sm\"\n type=\"button\"\n [attr.aria-label]=\"'Help' | translate\"\n popover=\"{{ 'Value displayed when data is aggregated' | translate }}\"\n [placement]=\"'right'\"\n triggers=\"focus\"\n [container]=\"'body'\"\n ></button>\n </label>\n <div class=\"c8y-select-wrapper\">\n <select class=\"form-control\" formControlName=\"renderType\">\n <option *ngFor=\"let type of CHART_RENDER_TYPES\" [ngValue]=\"type.val\">\n {{ type.text | translate }}\n </option>\n </select>\n </div>\n </c8y-form-group>\n </div>\n <div class=\"col-xs-6 col-sm-4\">\n <c8y-form-group>\n <label for=\"chartType\" translate>Chart type</label>\n <div class=\"c8y-select-wrapper\">\n <select class=\"form-control\" formControlName=\"lineType\">\n <option *ngFor=\"let type of CHART_LINE_TYPES\" [ngValue]=\"type.val\">\n {{ type.text | translate }}\n </option>\n </select>\n <span></span>\n </div>\n </c8y-form-group>\n </div>\n <div class=\"col-xs-6 col-sm-4\">\n <c8y-form-group>\n <label for=\"yAxis\" translate>Y-axis</label>\n <div class=\"c8y-select-wrapper\">\n <select class=\"form-control\" formControlName=\"yAxisType\">\n <option *ngFor=\"let type of AXIS_TYPES\" [ngValue]=\"type.val\">\n {{ type.text | translate }}\n </option>\n </select>\n <span></span>\n </div>\n </c8y-form-group>\n </div>\n </div>\n </fieldset>\n</div>\n", dependencies: [{ kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.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: i4.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i2.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: i2.MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "component", type: i2.MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults"] }, { kind: "directive", type: i2.RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i4.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i5.PopoverDirective, selector: "[popover]", inputs: ["adaptivePosition", "boundariesElement", "popover", "popoverContext", "popoverTitle", "placement", "outsideClick", "triggers", "container", "containerClass", "isOpen", "delay"], outputs: ["onShown", "onHidden"], exportAs: ["bs-popover"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i3.KeyValuePipe, name: "keyvalue" }] });
279
+ ], ngImport: i0, template: "<div [formGroup]=\"formGroup\">\n <ng-container *ngIf=\"!rawValue?.__template || showFormIfTemplateWasSelected\">\n <fieldset\n class=\"c8y-fieldset\"\n *ngIf=\"formGroup.controls?.label || formGroup.controls?.unit || formGroup.controls?.target\"\n >\n <legend translate>Details</legend>\n <div class=\"row\">\n <div class=\"col-md-6\" *ngIf=\"formGroup.controls?.label\">\n <c8y-form-group>\n <label translate>Label</label>\n <input\n class=\"form-control\"\n [placeholder]=\"'e.g. {{ example }}' | translate : { example: 'Temperature' }\"\n name=\"label\"\n formControlName=\"label\"\n />\n <c8y-messages\n [show]=\"formGroup.controls.label.touched && formGroup.controls.label.errors\"\n >\n <c8y-message\n *ngFor=\"let item of customValidationErrorMessages['label'] | keyvalue\"\n [name]=\"item.key\"\n [text]=\"item.value\"\n ></c8y-message>\n </c8y-messages>\n </c8y-form-group>\n </div>\n\n <div class=\"col-md-6\" *ngIf=\"formGroup.controls?.unit\">\n <c8y-form-group>\n <label translate>Unit</label>\n <input\n class=\"form-control\"\n [placeholder]=\"'e.g. {{ example }}' | translate : { example: '\u00BAC' }\"\n name=\"unit\"\n formControlName=\"unit\"\n />\n <c8y-messages\n [show]=\"formGroup.controls.unit.touched && formGroup.controls.unit.errors\"\n >\n <c8y-message\n *ngFor=\"let item of customValidationErrorMessages['unit'] | keyvalue\"\n [name]=\"item.key\"\n [text]=\"item.value\"\n ></c8y-message>\n </c8y-messages>\n </c8y-form-group>\n </div>\n\n <div class=\"col-md-6\" *ngIf=\"formGroup.controls?.target && showTarget\">\n <c8y-form-group\n [ngClass]=\"{\n 'has-error':\n (range?.touched || formGroup.controls.target.touched) &&\n formGroup.controls?.target?.errors\n }\"\n >\n <label translate>Target</label>\n <input\n class=\"form-control\"\n [placeholder]=\"'e.g. {{ example }}' | translate : { example: 25 }\"\n type=\"number\"\n name=\"target\"\n formControlName=\"target\"\n />\n <c8y-messages\n [show]=\"\n (range?.touched || formGroup.controls.target.touched) &&\n formGroup.controls.target.errors\n \"\n >\n <c8y-message\n *ngFor=\"let item of customValidationErrorMessages['target'] | keyvalue\"\n [name]=\"item.key\"\n [text]=\"item.value\"\n ></c8y-message>\n </c8y-messages>\n </c8y-form-group>\n </div>\n </div>\n </fieldset>\n <fieldset class=\"c8y-fieldset\" *ngIf=\"range && showRange\">\n <legend translate>Range</legend>\n <div class=\"row\" formGroupName=\"range\">\n <div class=\"col-md-6\">\n <c8y-form-group\n [ngClass]=\"{ 'has-error': range?.touched && range?.controls?.min?.errors }\"\n >\n <label translate>Min</label>\n <input\n class=\"form-control\"\n [placeholder]=\"'e.g. {{ example }}' | translate : { example: 0 }\"\n type=\"number\"\n name=\"min\"\n formControlName=\"min\"\n />\n <c8y-messages [show]=\"range?.touched && range.controls?.min?.errors\"></c8y-messages>\n </c8y-form-group>\n </div>\n <div class=\"col-md-6\">\n <c8y-form-group\n [ngClass]=\"{ 'has-error': range?.touched && range?.controls?.max?.errors }\"\n >\n <label translate>Max</label>\n <input\n class=\"form-control\"\n [placeholder]=\"'e.g. {{ example }}' | translate : { example: 100 }\"\n type=\"number\"\n name=\"max\"\n formControlName=\"max\"\n />\n <c8y-messages [show]=\"range?.touched && range.controls?.max?.errors\">\n <c8y-message\n *ngFor=\"let item of customValidationErrorMessages['max'] | keyvalue\"\n [name]=\"item.key\"\n [text]=\"item.value\"\n ></c8y-message>\n </c8y-messages>\n </c8y-form-group>\n </div>\n </div>\n </fieldset>\n\n <fieldset\n class=\"c8y-fieldset\"\n *ngIf=\"yellowRange && showYellowRange\"\n formGroupName=\"yellowRange\"\n >\n <legend translate>Yellow range</legend>\n <div class=\"row\">\n <div class=\"col-md-6\">\n <c8y-form-group\n [ngClass]=\"{\n 'has-error':\n (range?.touched || yellowRange?.touched) && yellowRange?.controls?.min?.errors\n }\"\n >\n <label translate>Min</label>\n <input\n class=\"form-control\"\n [placeholder]=\"'e.g. {{ example }}' | translate : { example: 50 }\"\n type=\"number\"\n name=\"min\"\n formControlName=\"min\"\n />\n <c8y-messages\n [show]=\"(range?.touched || yellowRange?.touched) && yellowRange.controls?.min?.errors\"\n ></c8y-messages>\n </c8y-form-group>\n </div>\n\n <div class=\"col-md-6\">\n <c8y-form-group\n [ngClass]=\"{\n 'has-error':\n (range?.touched || yellowRange?.touched) && yellowRange?.controls?.max?.errors\n }\"\n >\n <label translate>Max</label>\n <input\n class=\"form-control\"\n [placeholder]=\"'e.g. {{ example }}' | translate : { example: 75 }\"\n type=\"number\"\n name=\"max\"\n formControlName=\"max\"\n />\n <c8y-messages\n [show]=\"(range?.touched || yellowRange?.touched) && yellowRange.controls?.max?.errors\"\n ></c8y-messages>\n </c8y-form-group>\n </div>\n </div>\n </fieldset>\n\n <fieldset class=\"c8y-fieldset\" *ngIf=\"redRange && showRedRange\" formGroupName=\"redRange\">\n <legend translate>Red range</legend>\n <div class=\"row\">\n <div class=\"col-md-6\">\n <c8y-form-group\n [ngClass]=\"{\n 'has-error': (range?.touched || redRange?.touched) && redRange?.controls?.min?.errors\n }\"\n >\n <label translate>Min</label>\n <input\n class=\"form-control\"\n [placeholder]=\"'e.g. {{ example }}' | translate : { example: 75 }\"\n type=\"number\"\n name=\"min\"\n formControlName=\"min\"\n />\n <c8y-messages\n [show]=\"(range?.touched || redRange?.touched) && redRange.controls?.min?.errors\"\n ></c8y-messages>\n </c8y-form-group>\n </div>\n\n <div class=\"col-md-6\">\n <c8y-form-group\n [ngClass]=\"{\n 'has-error': (range?.touched || redRange?.touched) && redRange?.controls?.max?.errors\n }\"\n >\n <label translate>Max</label>\n <input\n class=\"form-control\"\n [placeholder]=\"'e.g. {{ example }}' | translate : { example: 100 }\"\n type=\"number\"\n name=\"max\"\n formControlName=\"max\"\n />\n <c8y-messages\n [show]=\"(range?.touched || redRange?.touched) && redRange.controls?.max?.errors\"\n ></c8y-messages>\n </c8y-form-group>\n </div>\n </div>\n </fieldset>\n </ng-container>\n\n <fieldset class=\"c8y-fieldset\" *ngIf=\"chart && showChart\" formGroupName=\"chart\">\n <legend translate>Chart</legend>\n <div class=\"tight-grid\">\n <div class=\"col-xs-6 col-sm-4\">\n <c8y-form-group>\n <label for=\"display\">\n {{ 'Display' | translate }}\n <button\n class=\"btn-help btn-help--sm\"\n [attr.aria-label]=\"'Help' | translate\"\n [placement]=\"'right'\"\n [container]=\"'body'\"\n type=\"button\"\n popover=\"{{ 'Value displayed when data is aggregated' | translate }}\"\n triggers=\"focus\"\n ></button>\n </label>\n <div class=\"c8y-select-wrapper\">\n <select class=\"form-control\" formControlName=\"renderType\">\n <option *ngFor=\"let type of CHART_RENDER_TYPES\" [ngValue]=\"type.val\">\n {{ type.text | translate }}\n </option>\n </select>\n </div>\n </c8y-form-group>\n </div>\n <div class=\"col-xs-6 col-sm-4\">\n <c8y-form-group>\n <label for=\"chartType\" translate>Chart type</label>\n <div class=\"c8y-select-wrapper\">\n <select class=\"form-control\" formControlName=\"lineType\">\n <option *ngFor=\"let type of CHART_LINE_TYPES\" [ngValue]=\"type.val\">\n {{ type.text | translate }}\n </option>\n </select>\n <span></span>\n </div>\n </c8y-form-group>\n </div>\n <div class=\"col-xs-6 col-sm-4\">\n <c8y-form-group>\n <label for=\"yAxis\" translate>Y-axis</label>\n <div class=\"c8y-select-wrapper\">\n <select class=\"form-control\" formControlName=\"yAxisType\">\n <option *ngFor=\"let type of AXIS_TYPES\" [ngValue]=\"type.val\">\n {{ type.text | translate }}\n </option>\n </select>\n <span></span>\n </div>\n </c8y-form-group>\n </div>\n </div>\n </fieldset>\n</div>\n", dependencies: [{ kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.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: i4.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i2.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: i2.MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "component", type: i2.MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults"] }, { kind: "directive", type: i2.RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i4.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i5.PopoverDirective, selector: "[popover]", inputs: ["adaptivePosition", "boundariesElement", "popover", "popoverContext", "popoverTitle", "placement", "outsideClick", "triggers", "container", "containerClass", "isOpen", "delay"], outputs: ["onShown", "onHidden"], exportAs: ["bs-popover"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i3.KeyValuePipe, name: "keyvalue" }] });
280
280
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: DatapointAttributesFormComponent, decorators: [{
281
281
  type: Component,
282
282
  args: [{ selector: 'c8y-datapoint-attributes-form', providers: [
@@ -290,7 +290,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImpor
290
290
  useExisting: forwardRef(() => DatapointAttributesFormComponent),
291
291
  multi: true
292
292
  }
293
- ], template: "<div [formGroup]=\"formGroup\" *ngIf=\"!rawValue?.__template || showFormIfTemplateWasSelected\">\n <fieldset\n class=\"c8y-fieldset\"\n *ngIf=\"formGroup.controls?.label || formGroup.controls?.unit || formGroup.controls?.target\"\n >\n <legend translate>Details</legend>\n <div class=\"row\">\n <div class=\"col-md-6\" *ngIf=\"formGroup.controls?.label\">\n <c8y-form-group>\n <label translate>Label</label>\n <input\n class=\"form-control\"\n name=\"label\"\n formControlName=\"label\"\n [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'Temperature' }\"\n />\n <c8y-messages\n [show]=\"formGroup.controls.label.touched && formGroup.controls.label.errors\"\n >\n <c8y-message\n *ngFor=\"let item of customValidationErrorMessages['label'] | keyvalue\"\n [name]=\"item.key\"\n [text]=\"item.value\"\n ></c8y-message>\n </c8y-messages>\n </c8y-form-group>\n </div>\n\n <div class=\"col-md-6\" *ngIf=\"formGroup.controls?.unit\">\n <c8y-form-group>\n <label translate>Unit</label>\n <input\n class=\"form-control\"\n name=\"unit\"\n formControlName=\"unit\"\n [placeholder]=\"'e.g. {{ example }}' | translate: { example: '\u00BAC' }\"\n />\n <c8y-messages [show]=\"formGroup.controls.unit.touched && formGroup.controls.unit.errors\">\n <c8y-message\n *ngFor=\"let item of customValidationErrorMessages['unit'] | keyvalue\"\n [name]=\"item.key\"\n [text]=\"item.value\"\n ></c8y-message>\n </c8y-messages>\n </c8y-form-group>\n </div>\n\n <div class=\"col-md-6\" *ngIf=\"formGroup.controls?.target && showTarget\">\n <c8y-form-group\n [ngClass]=\"{\n 'has-error':\n (range?.touched || formGroup.controls.target.touched) &&\n formGroup.controls?.target?.errors\n }\"\n >\n <label translate>Target</label>\n <input\n type=\"number\"\n class=\"form-control\"\n name=\"target\"\n formControlName=\"target\"\n [placeholder]=\"'e.g. {{ example }}' | translate: { example: 25 }\"\n />\n <c8y-messages\n [show]=\"\n (range?.touched || formGroup.controls.target.touched) &&\n formGroup.controls.target.errors\n \"\n >\n <c8y-message\n *ngFor=\"let item of customValidationErrorMessages['target'] | keyvalue\"\n [name]=\"item.key\"\n [text]=\"item.value\"\n ></c8y-message>\n </c8y-messages>\n </c8y-form-group>\n </div>\n </div>\n </fieldset>\n <fieldset class=\"c8y-fieldset\" *ngIf=\"range && showRange\">\n <legend translate>Range</legend>\n <div class=\"row\" formGroupName=\"range\">\n <div class=\"col-md-6\">\n <c8y-form-group [ngClass]=\"{ 'has-error': range?.touched && range?.controls?.min?.errors }\">\n <label translate>Min</label>\n <input\n type=\"number\"\n class=\"form-control\"\n name=\"min\"\n formControlName=\"min\"\n [placeholder]=\"'e.g. {{ example }}' | translate: { example: 0 }\"\n />\n <c8y-messages [show]=\"range?.touched && range.controls?.min?.errors\"></c8y-messages>\n </c8y-form-group>\n </div>\n <div class=\"col-md-6\">\n <c8y-form-group [ngClass]=\"{ 'has-error': range?.touched && range?.controls?.max?.errors }\">\n <label translate>Max</label>\n <input\n type=\"number\"\n class=\"form-control\"\n name=\"max\"\n formControlName=\"max\"\n [placeholder]=\"'e.g. {{ example }}' | translate: { example: 100 }\"\n />\n <c8y-messages [show]=\"range?.touched && range.controls?.max?.errors\">\n <c8y-message\n *ngFor=\"let item of customValidationErrorMessages['max'] | keyvalue\"\n [name]=\"item.key\"\n [text]=\"item.value\"\n ></c8y-message>\n </c8y-messages>\n </c8y-form-group>\n </div>\n </div>\n </fieldset>\n\n <fieldset class=\"c8y-fieldset\" formGroupName=\"yellowRange\" *ngIf=\"yellowRange && showYellowRange\">\n <legend translate>Yellow range</legend>\n <div class=\"row\">\n <div class=\"col-md-6\">\n <c8y-form-group\n [ngClass]=\"{\n 'has-error':\n (range?.touched || yellowRange?.touched) && yellowRange?.controls?.min?.errors\n }\"\n >\n <label translate>Min</label>\n <input\n type=\"number\"\n class=\"form-control\"\n name=\"min\"\n formControlName=\"min\"\n [placeholder]=\"'e.g. {{ example }}' | translate: { example: 50 }\"\n />\n <c8y-messages\n [show]=\"(range?.touched || yellowRange?.touched) && yellowRange.controls?.min?.errors\"\n ></c8y-messages>\n </c8y-form-group>\n </div>\n\n <div class=\"col-md-6\">\n <c8y-form-group\n [ngClass]=\"{\n 'has-error':\n (range?.touched || yellowRange?.touched) && yellowRange?.controls?.max?.errors\n }\"\n >\n <label translate>Max</label>\n <input\n type=\"number\"\n class=\"form-control\"\n name=\"max\"\n formControlName=\"max\"\n [placeholder]=\"'e.g. {{ example }}' | translate: { example: 75 }\"\n />\n <c8y-messages\n [show]=\"(range?.touched || yellowRange?.touched) && yellowRange.controls?.max?.errors\"\n ></c8y-messages>\n </c8y-form-group>\n </div>\n </div>\n </fieldset>\n\n <fieldset class=\"c8y-fieldset\" formGroupName=\"redRange\" *ngIf=\"redRange && showRedRange\">\n <legend translate>Red range</legend>\n <div class=\"row\">\n <div class=\"col-md-6\">\n <c8y-form-group\n [ngClass]=\"{\n 'has-error': (range?.touched || redRange?.touched) && redRange?.controls?.min?.errors\n }\"\n >\n <label translate>Min</label>\n <input\n type=\"number\"\n class=\"form-control\"\n name=\"min\"\n formControlName=\"min\"\n [placeholder]=\"'e.g. {{ example }}' | translate: { example: 75 }\"\n />\n <c8y-messages\n [show]=\"(range?.touched || redRange?.touched) && redRange.controls?.min?.errors\"\n ></c8y-messages>\n </c8y-form-group>\n </div>\n\n <div class=\"col-md-6\">\n <c8y-form-group\n [ngClass]=\"{\n 'has-error': (range?.touched || redRange?.touched) && redRange?.controls?.max?.errors\n }\"\n >\n <label translate>Max</label>\n <input\n type=\"number\"\n class=\"form-control\"\n name=\"max\"\n formControlName=\"max\"\n [placeholder]=\"'e.g. {{ example }}' | translate: { example: 100 }\"\n />\n <c8y-messages\n [show]=\"(range?.touched || redRange?.touched) && redRange.controls?.max?.errors\"\n ></c8y-messages>\n </c8y-form-group>\n </div>\n </div>\n </fieldset>\n\n <fieldset class=\"c8y-fieldset\" *ngIf=\"chart && showChart\" formGroupName=\"chart\">\n <legend translate>Chart</legend>\n <div class=\"tight-grid\">\n <div class=\"col-xs-6 col-sm-4\">\n <c8y-form-group>\n <label for=\"display\">\n {{ 'Display' | translate }}\n <button\n class=\"btn-help btn-help--sm\"\n type=\"button\"\n [attr.aria-label]=\"'Help' | translate\"\n popover=\"{{ 'Value displayed when data is aggregated' | translate }}\"\n [placement]=\"'right'\"\n triggers=\"focus\"\n [container]=\"'body'\"\n ></button>\n </label>\n <div class=\"c8y-select-wrapper\">\n <select class=\"form-control\" formControlName=\"renderType\">\n <option *ngFor=\"let type of CHART_RENDER_TYPES\" [ngValue]=\"type.val\">\n {{ type.text | translate }}\n </option>\n </select>\n </div>\n </c8y-form-group>\n </div>\n <div class=\"col-xs-6 col-sm-4\">\n <c8y-form-group>\n <label for=\"chartType\" translate>Chart type</label>\n <div class=\"c8y-select-wrapper\">\n <select class=\"form-control\" formControlName=\"lineType\">\n <option *ngFor=\"let type of CHART_LINE_TYPES\" [ngValue]=\"type.val\">\n {{ type.text | translate }}\n </option>\n </select>\n <span></span>\n </div>\n </c8y-form-group>\n </div>\n <div class=\"col-xs-6 col-sm-4\">\n <c8y-form-group>\n <label for=\"yAxis\" translate>Y-axis</label>\n <div class=\"c8y-select-wrapper\">\n <select class=\"form-control\" formControlName=\"yAxisType\">\n <option *ngFor=\"let type of AXIS_TYPES\" [ngValue]=\"type.val\">\n {{ type.text | translate }}\n </option>\n </select>\n <span></span>\n </div>\n </c8y-form-group>\n </div>\n </div>\n </fieldset>\n</div>\n" }]
293
+ ], template: "<div [formGroup]=\"formGroup\">\n <ng-container *ngIf=\"!rawValue?.__template || showFormIfTemplateWasSelected\">\n <fieldset\n class=\"c8y-fieldset\"\n *ngIf=\"formGroup.controls?.label || formGroup.controls?.unit || formGroup.controls?.target\"\n >\n <legend translate>Details</legend>\n <div class=\"row\">\n <div class=\"col-md-6\" *ngIf=\"formGroup.controls?.label\">\n <c8y-form-group>\n <label translate>Label</label>\n <input\n class=\"form-control\"\n [placeholder]=\"'e.g. {{ example }}' | translate : { example: 'Temperature' }\"\n name=\"label\"\n formControlName=\"label\"\n />\n <c8y-messages\n [show]=\"formGroup.controls.label.touched && formGroup.controls.label.errors\"\n >\n <c8y-message\n *ngFor=\"let item of customValidationErrorMessages['label'] | keyvalue\"\n [name]=\"item.key\"\n [text]=\"item.value\"\n ></c8y-message>\n </c8y-messages>\n </c8y-form-group>\n </div>\n\n <div class=\"col-md-6\" *ngIf=\"formGroup.controls?.unit\">\n <c8y-form-group>\n <label translate>Unit</label>\n <input\n class=\"form-control\"\n [placeholder]=\"'e.g. {{ example }}' | translate : { example: '\u00BAC' }\"\n name=\"unit\"\n formControlName=\"unit\"\n />\n <c8y-messages\n [show]=\"formGroup.controls.unit.touched && formGroup.controls.unit.errors\"\n >\n <c8y-message\n *ngFor=\"let item of customValidationErrorMessages['unit'] | keyvalue\"\n [name]=\"item.key\"\n [text]=\"item.value\"\n ></c8y-message>\n </c8y-messages>\n </c8y-form-group>\n </div>\n\n <div class=\"col-md-6\" *ngIf=\"formGroup.controls?.target && showTarget\">\n <c8y-form-group\n [ngClass]=\"{\n 'has-error':\n (range?.touched || formGroup.controls.target.touched) &&\n formGroup.controls?.target?.errors\n }\"\n >\n <label translate>Target</label>\n <input\n class=\"form-control\"\n [placeholder]=\"'e.g. {{ example }}' | translate : { example: 25 }\"\n type=\"number\"\n name=\"target\"\n formControlName=\"target\"\n />\n <c8y-messages\n [show]=\"\n (range?.touched || formGroup.controls.target.touched) &&\n formGroup.controls.target.errors\n \"\n >\n <c8y-message\n *ngFor=\"let item of customValidationErrorMessages['target'] | keyvalue\"\n [name]=\"item.key\"\n [text]=\"item.value\"\n ></c8y-message>\n </c8y-messages>\n </c8y-form-group>\n </div>\n </div>\n </fieldset>\n <fieldset class=\"c8y-fieldset\" *ngIf=\"range && showRange\">\n <legend translate>Range</legend>\n <div class=\"row\" formGroupName=\"range\">\n <div class=\"col-md-6\">\n <c8y-form-group\n [ngClass]=\"{ 'has-error': range?.touched && range?.controls?.min?.errors }\"\n >\n <label translate>Min</label>\n <input\n class=\"form-control\"\n [placeholder]=\"'e.g. {{ example }}' | translate : { example: 0 }\"\n type=\"number\"\n name=\"min\"\n formControlName=\"min\"\n />\n <c8y-messages [show]=\"range?.touched && range.controls?.min?.errors\"></c8y-messages>\n </c8y-form-group>\n </div>\n <div class=\"col-md-6\">\n <c8y-form-group\n [ngClass]=\"{ 'has-error': range?.touched && range?.controls?.max?.errors }\"\n >\n <label translate>Max</label>\n <input\n class=\"form-control\"\n [placeholder]=\"'e.g. {{ example }}' | translate : { example: 100 }\"\n type=\"number\"\n name=\"max\"\n formControlName=\"max\"\n />\n <c8y-messages [show]=\"range?.touched && range.controls?.max?.errors\">\n <c8y-message\n *ngFor=\"let item of customValidationErrorMessages['max'] | keyvalue\"\n [name]=\"item.key\"\n [text]=\"item.value\"\n ></c8y-message>\n </c8y-messages>\n </c8y-form-group>\n </div>\n </div>\n </fieldset>\n\n <fieldset\n class=\"c8y-fieldset\"\n *ngIf=\"yellowRange && showYellowRange\"\n formGroupName=\"yellowRange\"\n >\n <legend translate>Yellow range</legend>\n <div class=\"row\">\n <div class=\"col-md-6\">\n <c8y-form-group\n [ngClass]=\"{\n 'has-error':\n (range?.touched || yellowRange?.touched) && yellowRange?.controls?.min?.errors\n }\"\n >\n <label translate>Min</label>\n <input\n class=\"form-control\"\n [placeholder]=\"'e.g. {{ example }}' | translate : { example: 50 }\"\n type=\"number\"\n name=\"min\"\n formControlName=\"min\"\n />\n <c8y-messages\n [show]=\"(range?.touched || yellowRange?.touched) && yellowRange.controls?.min?.errors\"\n ></c8y-messages>\n </c8y-form-group>\n </div>\n\n <div class=\"col-md-6\">\n <c8y-form-group\n [ngClass]=\"{\n 'has-error':\n (range?.touched || yellowRange?.touched) && yellowRange?.controls?.max?.errors\n }\"\n >\n <label translate>Max</label>\n <input\n class=\"form-control\"\n [placeholder]=\"'e.g. {{ example }}' | translate : { example: 75 }\"\n type=\"number\"\n name=\"max\"\n formControlName=\"max\"\n />\n <c8y-messages\n [show]=\"(range?.touched || yellowRange?.touched) && yellowRange.controls?.max?.errors\"\n ></c8y-messages>\n </c8y-form-group>\n </div>\n </div>\n </fieldset>\n\n <fieldset class=\"c8y-fieldset\" *ngIf=\"redRange && showRedRange\" formGroupName=\"redRange\">\n <legend translate>Red range</legend>\n <div class=\"row\">\n <div class=\"col-md-6\">\n <c8y-form-group\n [ngClass]=\"{\n 'has-error': (range?.touched || redRange?.touched) && redRange?.controls?.min?.errors\n }\"\n >\n <label translate>Min</label>\n <input\n class=\"form-control\"\n [placeholder]=\"'e.g. {{ example }}' | translate : { example: 75 }\"\n type=\"number\"\n name=\"min\"\n formControlName=\"min\"\n />\n <c8y-messages\n [show]=\"(range?.touched || redRange?.touched) && redRange.controls?.min?.errors\"\n ></c8y-messages>\n </c8y-form-group>\n </div>\n\n <div class=\"col-md-6\">\n <c8y-form-group\n [ngClass]=\"{\n 'has-error': (range?.touched || redRange?.touched) && redRange?.controls?.max?.errors\n }\"\n >\n <label translate>Max</label>\n <input\n class=\"form-control\"\n [placeholder]=\"'e.g. {{ example }}' | translate : { example: 100 }\"\n type=\"number\"\n name=\"max\"\n formControlName=\"max\"\n />\n <c8y-messages\n [show]=\"(range?.touched || redRange?.touched) && redRange.controls?.max?.errors\"\n ></c8y-messages>\n </c8y-form-group>\n </div>\n </div>\n </fieldset>\n </ng-container>\n\n <fieldset class=\"c8y-fieldset\" *ngIf=\"chart && showChart\" formGroupName=\"chart\">\n <legend translate>Chart</legend>\n <div class=\"tight-grid\">\n <div class=\"col-xs-6 col-sm-4\">\n <c8y-form-group>\n <label for=\"display\">\n {{ 'Display' | translate }}\n <button\n class=\"btn-help btn-help--sm\"\n [attr.aria-label]=\"'Help' | translate\"\n [placement]=\"'right'\"\n [container]=\"'body'\"\n type=\"button\"\n popover=\"{{ 'Value displayed when data is aggregated' | translate }}\"\n triggers=\"focus\"\n ></button>\n </label>\n <div class=\"c8y-select-wrapper\">\n <select class=\"form-control\" formControlName=\"renderType\">\n <option *ngFor=\"let type of CHART_RENDER_TYPES\" [ngValue]=\"type.val\">\n {{ type.text | translate }}\n </option>\n </select>\n </div>\n </c8y-form-group>\n </div>\n <div class=\"col-xs-6 col-sm-4\">\n <c8y-form-group>\n <label for=\"chartType\" translate>Chart type</label>\n <div class=\"c8y-select-wrapper\">\n <select class=\"form-control\" formControlName=\"lineType\">\n <option *ngFor=\"let type of CHART_LINE_TYPES\" [ngValue]=\"type.val\">\n {{ type.text | translate }}\n </option>\n </select>\n <span></span>\n </div>\n </c8y-form-group>\n </div>\n <div class=\"col-xs-6 col-sm-4\">\n <c8y-form-group>\n <label for=\"yAxis\" translate>Y-axis</label>\n <div class=\"c8y-select-wrapper\">\n <select class=\"form-control\" formControlName=\"yAxisType\">\n <option *ngFor=\"let type of AXIS_TYPES\" [ngValue]=\"type.val\">\n {{ type.text | translate }}\n </option>\n </select>\n <span></span>\n </div>\n </c8y-form-group>\n </div>\n </div>\n </fieldset>\n</div>\n" }]
294
294
  }], ctorParameters: function () { return [{ type: DatapointAttributesFormValidationService }]; }, propDecorators: { showTarget: [{
295
295
  type: Input
296
296
  }], showRange: [{