import * as i0 from '@angular/core';
import { Pipe, Component, Optional, Input, NgModule } from '@angular/core';
import * as i3 from '@c8y/ngx-components';
import { MeasurementRealtimeService, DatePipe, CoreModule } from '@c8y/ngx-components';
import * as i4 from '@angular/common';
import { NgIf, NgFor, NgStyle, AsyncPipe, DecimalPipe } from '@angular/common';
import { of } from 'rxjs';
import { map, catchError } from 'rxjs/operators';
import * as i1 from '@c8y/ngx-components/context-dashboard';
import * as i1$1 from '@angular/forms';
import { Validators, ReactiveFormsModule, ControlContainer, NgForm } from '@angular/forms';
import * as i5 from '@c8y/ngx-components/datapoint-selector';
import { DatapointSelectorModule } from '@c8y/ngx-components/datapoint-selector';

const INFO_GAUGE_COLORS = {
    GREEN: 'var(--c8y-brand-50)',
    YELLOW: 'var(--c8y-palette-status-warning)',
    RED: 'var(--c8y-palette-status-danger)'
};
class InfoGaugeCurrentMeasurementPipe {
    constructor(measurementRealtime, alert) {
        this.measurementRealtime = measurementRealtime;
        this.alert = alert;
    }
    transform(datapoint, calculateGauge) {
        return this.measurementRealtime
            .latestValueOfSpecificMeasurement$(datapoint.fragment, datapoint.series, datapoint.__target, 1, true)
            .pipe(map(m => {
            // in case measurement is not stored in DB when initially requested.
            if (!m) {
                return { value: Number.NaN, date: '', unit: datapoint.unit || '', notFound: true };
            }
            const measurementValue = m[datapoint.fragment][datapoint.series];
            const data = {
                value: measurementValue.value,
                unit: measurementValue.unit || datapoint.unit,
                date: m.time
            };
            if (!calculateGauge) {
                return data;
            }
            const gauge = this.calculateGauge(datapoint, measurementValue.value);
            return { ...data, ...gauge };
        }), catchError(e => {
            this.alert.addServerFailure(e);
            return of({ value: Number.NaN, date: '', unit: '' });
        }));
    }
    calculateGauge(datapoint, value) {
        const val = value;
        const min = Number(datapoint.min || 0);
        const max = Number(datapoint.max || 0);
        const yMin = Number(datapoint.yellowRangeMin);
        const yMax = Number(datapoint.yellowRangeMax);
        const rMin = Number(datapoint.redRangeMin);
        const rMax = Number(datapoint.redRangeMax);
        // Previously d3 was used for linear scale: d3.scale.linear().domain([min, max]).range([0, 100]);
        // wanted to avoid importing d3 just for this.
        const scale = (value1) => (value1 - min) / ((max - min) / 100);
        const strokeDashOffset = 125.75 + (377.25 - (scale(val) / 100) * 377.25);
        let color = INFO_GAUGE_COLORS.GREEN;
        if (Number.isFinite(yMin) && Number.isFinite(yMax)) {
            if (val >= yMin && val <= yMax) {
                color = INFO_GAUGE_COLORS.YELLOW;
            }
        }
        if (Number.isFinite(rMin) && Number.isFinite(rMax)) {
            if (val >= rMin && val <= rMax) {
                color = INFO_GAUGE_COLORS.RED;
            }
        }
        return { color, strokeDashOffset };
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: InfoGaugeCurrentMeasurementPipe, deps: [{ token: i3.MeasurementRealtimeService }, { token: i3.AlertService }], target: i0.ɵɵFactoryTarget.Pipe }); }
    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "18.2.9", ngImport: i0, type: InfoGaugeCurrentMeasurementPipe, isStandalone: true, name: "infoGaugeCurrentMeasurement" }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: InfoGaugeCurrentMeasurementPipe, decorators: [{
            type: Pipe,
            args: [{
                    name: 'infoGaugeCurrentMeasurement',
                    pure: true,
                    standalone: true
                }]
        }], ctorParameters: () => [{ type: i3.MeasurementRealtimeService }, { type: i3.AlertService }] });

class InfoGaugeWidgetViewComponent {
    constructor(dashboard) {
        this.dashboard = dashboard;
        this.activeDatapointLabels = [];
        this.fractionSize = '1.1-1';
    }
    ngOnChanges() {
        if (this.config?.datapointsLabels && Array.isArray(this.config?.datapointsLabels)) {
            this.config.datapointsLabels.forEach(dp => this.assignContextFromContextDashboard(dp));
            this.activeDatapointLabels = this.config?.datapointsLabels.filter(dp => dp.__active);
        }
        if (this.config?.datapointsGauge && Array.isArray(this.config?.datapointsGauge)) {
            this.config.datapointsGauge.forEach(dp => this.assignContextFromContextDashboard(dp));
            this.activeDatapointGauge = this.config?.datapointsGauge.find(dp => dp.__active);
        }
        if (typeof this.config.fractionSize === 'number' && !Number.isNaN(this.config.fractionSize)) {
            this.fractionSize = `1.${this.config.fractionSize}-${this.config.fractionSize}`;
        }
    }
    assignContextFromContextDashboard(datapoint) {
        if (!this.dashboard?.isDeviceTypeDashboard) {
            return;
        }
        const context = this.dashboard?.context;
        if (context?.id) {
            const { name, id } = context;
            datapoint.__target = { name, id };
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: InfoGaugeWidgetViewComponent, deps: [{ token: i1.ContextDashboardComponent, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: InfoGaugeWidgetViewComponent, isStandalone: true, selector: "c8y-info-gauge-widget-view", inputs: { config: "config" }, host: { classAttribute: "d-contents" }, providers: [MeasurementRealtimeService], usesOnChanges: true, ngImport: i0, template: "<div class=\"label-value-unit-gauge\">\n  <div\n    class=\"gauge-legend\"\n    *ngIf=\"activeDatapointLabels?.length\"\n  >\n    <ng-container *ngFor=\"let dp of activeDatapointLabels\">\n      <ng-container *ngIf=\"dp | infoGaugeCurrentMeasurement | async as measurement\">\n        <label\n          class=\"text-truncate\"\n          title=\"{{ dp.label }}\"\n        >\n          {{ dp.label }}\n        </label>\n        <h3\n          class=\"text-truncate\"\n          title=\"{{ measurement.value | number: fractionSize }} {{ dp.unit || measurement.unit }}\"\n          *ngIf=\"!measurement.notFound; else notFound\"\n        >\n          {{ measurement.value | number: fractionSize }} {{ dp.unit || measurement.unit }}\n        </h3>\n        <ng-template #notFound>\n          <h3>--</h3>\n        </ng-template>\n        <p class=\"text-muted m-b-8\">\n          <small>\n            <div>{{ measurement.date | c8yDate: 'mediumDate' }}</div>\n            <div>{{ measurement.date | c8yDate: 'mediumTime' }}</div>\n          </small>\n        </p>\n      </ng-container>\n    </ng-container>\n  </div>\n\n  <ng-container *ngIf=\"activeDatapointGauge\">\n    <div\n      class=\"gauge-svg\"\n      *ngIf=\"activeDatapointGauge | infoGaugeCurrentMeasurement: true | async as measurement\"\n    >\n      <svg\n        height=\"214px\"\n        width=\"214px\"\n        viewBox=\"0 0 214 214\"\n        version=\"1.1\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n      >\n        <desc>radial gauge</desc>\n        <g\n          id=\"scale\"\n          stroke=\"none\"\n          stroke-width=\"1\"\n          fill=\"none\"\n          fill-rule=\"evenodd\"\n          stroke-dasharray=\"1,5\"\n        >\n          <circle\n            id=\"Oval\"\n            stroke=\"#CACECE\"\n            stroke-width=\"7\"\n            cx=\"107\"\n            cy=\"107\"\n            r=\"103\"\n          ></circle>\n          <rect\n            id=\"mask\"\n            height=\"214\"\n            stroke=\"none\"\n            fill-rule=\"evenodd\"\n            x=\"0\"\n            y=\"0\"\n            width=\"214\"\n            transform=\"rotate(-45 290 182)\"\n          ></rect>\n        </g>\n        <path\n          class=\"track\"\n          d=\"M 107 27 a 80 80 0 1 0.1 0 Z\"\n          transform=\"rotate(-135 107 107)\"\n        ></path>\n        <path\n          class=\"track-value\"\n          [ngStyle]=\"{\n            stroke: measurement.color,\n            'stroke-dashoffset': -measurement.strokeDashOffset\n          }\"\n          d=\"M 107 27 a 80 80 0 1 0.1 0 Z\"\n          transform=\"rotate(-135 107 107)\"\n        ></path>\n        <foreignObject\n          class=\"d-flex a-i-center j-c-center\"\n          height=\"100%\"\n          width=\"100%\"\n          requiredFeatures=\"http://www.w3.org/TR/SVG11/feature#Extensibility\"\n        >\n          <div\n            class=\"d-flex d-col fit-h a-i-center j-c-center\"\n            style=\"padding: 3rem\"\n            xmlns=\"http://www.w3.org/1999/xhtml\"\n          >\n            <p\n              class=\"text-truncate text-center\"\n              title=\"{{ activeDatapointGauge.label }}\"\n            >\n              {{ activeDatapointGauge.label }}\n            </p>\n            <p\n              class=\"center-value text-truncate\"\n              title=\"{{ measurement.value | number: fractionSize }}\"\n              *ngIf=\"!measurement.notFound; else notFoundSVG\"\n            >\n              {{ measurement.value | number: fractionSize }}\n            </p>\n            <ng-template #notFoundSVG>\n              <p class=\"center-value\">--</p>\n            </ng-template>\n            <p class=\"center-unit strong\">{{ activeDatapointGauge.unit || measurement.unit }}</p>\n            <div class=\"center-date-time\">{{ measurement.date | c8yDate: 'mediumDate' }}</div>\n            <div class=\"center-date-time\">{{ measurement.date | c8yDate: 'mediumTime' }}</div>\n          </div>\n        </foreignObject>\n      </svg>\n    </div>\n  </ng-container>\n  <div class=\"clearfix\"></div>\n</div>\n", dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: InfoGaugeCurrentMeasurementPipe, name: "infoGaugeCurrentMeasurement" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: DecimalPipe, name: "number" }, { kind: "pipe", type: DatePipe, name: "c8yDate" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: InfoGaugeWidgetViewComponent, decorators: [{
            type: Component,
            args: [{ selector: 'c8y-info-gauge-widget-view', host: { class: 'd-contents' }, providers: [MeasurementRealtimeService], standalone: true, imports: [NgIf, NgFor, NgStyle, InfoGaugeCurrentMeasurementPipe, AsyncPipe, DecimalPipe, DatePipe], template: "<div class=\"label-value-unit-gauge\">\n  <div\n    class=\"gauge-legend\"\n    *ngIf=\"activeDatapointLabels?.length\"\n  >\n    <ng-container *ngFor=\"let dp of activeDatapointLabels\">\n      <ng-container *ngIf=\"dp | infoGaugeCurrentMeasurement | async as measurement\">\n        <label\n          class=\"text-truncate\"\n          title=\"{{ dp.label }}\"\n        >\n          {{ dp.label }}\n        </label>\n        <h3\n          class=\"text-truncate\"\n          title=\"{{ measurement.value | number: fractionSize }} {{ dp.unit || measurement.unit }}\"\n          *ngIf=\"!measurement.notFound; else notFound\"\n        >\n          {{ measurement.value | number: fractionSize }} {{ dp.unit || measurement.unit }}\n        </h3>\n        <ng-template #notFound>\n          <h3>--</h3>\n        </ng-template>\n        <p class=\"text-muted m-b-8\">\n          <small>\n            <div>{{ measurement.date | c8yDate: 'mediumDate' }}</div>\n            <div>{{ measurement.date | c8yDate: 'mediumTime' }}</div>\n          </small>\n        </p>\n      </ng-container>\n    </ng-container>\n  </div>\n\n  <ng-container *ngIf=\"activeDatapointGauge\">\n    <div\n      class=\"gauge-svg\"\n      *ngIf=\"activeDatapointGauge | infoGaugeCurrentMeasurement: true | async as measurement\"\n    >\n      <svg\n        height=\"214px\"\n        width=\"214px\"\n        viewBox=\"0 0 214 214\"\n        version=\"1.1\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n      >\n        <desc>radial gauge</desc>\n        <g\n          id=\"scale\"\n          stroke=\"none\"\n          stroke-width=\"1\"\n          fill=\"none\"\n          fill-rule=\"evenodd\"\n          stroke-dasharray=\"1,5\"\n        >\n          <circle\n            id=\"Oval\"\n            stroke=\"#CACECE\"\n            stroke-width=\"7\"\n            cx=\"107\"\n            cy=\"107\"\n            r=\"103\"\n          ></circle>\n          <rect\n            id=\"mask\"\n            height=\"214\"\n            stroke=\"none\"\n            fill-rule=\"evenodd\"\n            x=\"0\"\n            y=\"0\"\n            width=\"214\"\n            transform=\"rotate(-45 290 182)\"\n          ></rect>\n        </g>\n        <path\n          class=\"track\"\n          d=\"M 107 27 a 80 80 0 1 0.1 0 Z\"\n          transform=\"rotate(-135 107 107)\"\n        ></path>\n        <path\n          class=\"track-value\"\n          [ngStyle]=\"{\n            stroke: measurement.color,\n            'stroke-dashoffset': -measurement.strokeDashOffset\n          }\"\n          d=\"M 107 27 a 80 80 0 1 0.1 0 Z\"\n          transform=\"rotate(-135 107 107)\"\n        ></path>\n        <foreignObject\n          class=\"d-flex a-i-center j-c-center\"\n          height=\"100%\"\n          width=\"100%\"\n          requiredFeatures=\"http://www.w3.org/TR/SVG11/feature#Extensibility\"\n        >\n          <div\n            class=\"d-flex d-col fit-h a-i-center j-c-center\"\n            style=\"padding: 3rem\"\n            xmlns=\"http://www.w3.org/1999/xhtml\"\n          >\n            <p\n              class=\"text-truncate text-center\"\n              title=\"{{ activeDatapointGauge.label }}\"\n            >\n              {{ activeDatapointGauge.label }}\n            </p>\n            <p\n              class=\"center-value text-truncate\"\n              title=\"{{ measurement.value | number: fractionSize }}\"\n              *ngIf=\"!measurement.notFound; else notFoundSVG\"\n            >\n              {{ measurement.value | number: fractionSize }}\n            </p>\n            <ng-template #notFoundSVG>\n              <p class=\"center-value\">--</p>\n            </ng-template>\n            <p class=\"center-unit strong\">{{ activeDatapointGauge.unit || measurement.unit }}</p>\n            <div class=\"center-date-time\">{{ measurement.date | c8yDate: 'mediumDate' }}</div>\n            <div class=\"center-date-time\">{{ measurement.date | c8yDate: 'mediumTime' }}</div>\n          </div>\n        </foreignObject>\n      </svg>\n    </div>\n  </ng-container>\n  <div class=\"clearfix\"></div>\n</div>\n" }]
        }], ctorParameters: () => [{ type: i1.ContextDashboardComponent, decorators: [{
                    type: Optional
                }] }], propDecorators: { config: [{
                type: Input
            }] } });

function ensureAtLeastOneDatapointSelectedAndActive(datapointListAttributes) {
    return (control) => {
        const formValue = control.value;
        for (const listAttributeName of datapointListAttributes) {
            const valueForList = formValue[listAttributeName];
            if (!valueForList || !Array.isArray(valueForList)) {
                continue;
            }
            if (valueForList.find(dp => dp.__active)) {
                return null;
            }
        }
        return { noActiveDatapoint: true };
    };
}
class InfoGaugeWidgetConfigComponent {
    constructor(formBuilder, form, widgetConfig) {
        this.formBuilder = formBuilder;
        this.form = form;
        this.widgetConfig = widgetConfig;
        this.datapointSelectionConfig = {};
        this.defaultFormOptions = {
            showRedRange: true,
            showYellowRange: true,
            showRange: true
        };
        this.limits = {
            numberOfDecimalPlacesMax: 10,
            numberOfDecimalPlacesMin: 0
        };
    }
    onBeforeSave(config) {
        if (this.formGroup.valid) {
            Object.assign(config, this.formGroup.value);
            return true;
        }
        return false;
    }
    ngOnInit() {
        if (this.widgetConfig.context?.id) {
            this.datapointSelectionConfig.contextAsset = this.widgetConfig?.context;
        }
        this.initForm();
        if (this.config?.datapointsLabels) {
            this.formGroup.patchValue({ datapointsLabels: this.config.datapointsLabels });
        }
        if (this.config?.datapointsGauge) {
            this.formGroup.patchValue({ datapointsGauge: this.config.datapointsGauge });
        }
        if (typeof this.config?.fractionSize === 'number' && !Number.isNaN(this.config?.fractionSize)) {
            this.formGroup.patchValue({ fractionSize: this.config.fractionSize });
        }
    }
    initForm() {
        this.formGroup = this.createForm();
        this.form.form.addControl('config', this.formGroup);
        this.formGroup.patchValue(this.config);
    }
    createForm() {
        return this.formBuilder.group({
            fractionSize: [
                1,
                [
                    Validators.required,
                    Validators.min(this.limits.numberOfDecimalPlacesMin),
                    Validators.max(this.limits.numberOfDecimalPlacesMax)
                ]
            ],
            datapointsLabels: this.formBuilder.control(new Array(), []),
            datapointsGauge: this.formBuilder.control(new Array(), [])
        }, {
            validators: [
                ensureAtLeastOneDatapointSelectedAndActive(['datapointsLabels', 'datapointsGauge'])
            ]
        });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: InfoGaugeWidgetConfigComponent, deps: [{ token: i1$1.FormBuilder }, { token: i1$1.NgForm }, { token: i1.WidgetConfigComponent }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: InfoGaugeWidgetConfigComponent, isStandalone: true, selector: "c8y-info-gauge-widget-config", inputs: { config: "config" }, ngImport: i0, template: "<div class=\"p-l-24 p-r-24\">\n  <form\n    class=\"no-card-context\"\n    [formGroup]=\"formGroup\"\n  >\n    <div class=\"row\">\n      <div class=\"col-md-6\">\n        <c8y-form-group class=\"p-t-8\">\n          <label translate>Decimal places</label>\n          <input\n            class=\"form-control\"\n            name=\"fractionSize\"\n            type=\"number\"\n            formControlName=\"fractionSize\"\n            step=\"1\"\n          />\n          <c8y-messages [show]=\"formGroup.controls.fractionSize.errors\"></c8y-messages>\n        </c8y-form-group>\n      </div>\n      <div class=\"col-md-6 p-t-8\">\n        <div\n          class=\"alert alert-info\"\n          role=\"alert\"\n          *ngIf=\"formGroup.errors?.noActiveDatapoint\"\n          translate\n        >\n          At least one data point for the labels or the gauge needs to be selected.\n        </div>\n      </div>\n    </div>\n\n    <div class=\"row\">\n      <div class=\"col-md-6\">\n        <c8y-datapoint-selection-list\n          class=\"bg-inherit separator-top p-t-16 d-block\"\n          name=\"datapoints\"\n          listTitle=\"{{ 'Multiple label and value pairs' | translate }}\"\n          [defaultFormOptions]=\"defaultFormOptions\"\n          [config]=\"datapointSelectionConfig\"\n          [minActiveCount]=\"0\"\n          formControlName=\"datapointsLabels\"\n        ></c8y-datapoint-selection-list>\n      </div>\n      <div class=\"col-md-6\">\n        <c8y-datapoint-selection-list\n          class=\"bg-inherit separator-top p-t-16 d-block\"\n          name=\"datapoints\"\n          listTitle=\"{{ 'Gauge`display`' | translate }}\"\n          [defaultFormOptions]=\"defaultFormOptions\"\n          [config]=\"datapointSelectionConfig\"\n          [minActiveCount]=\"0\"\n          [maxActiveCount]=\"1\"\n          formControlName=\"datapointsGauge\"\n        ></c8y-datapoint-selection-list>\n      </div>\n    </div>\n  </form>\n</div>\n", dependencies: [{ kind: "ngmodule", type: CoreModule }, { kind: "pipe", type: i3.C8yTranslatePipe, name: "translate" }, { kind: "directive", type: i3.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.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$1.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i3.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "component", type: i3.MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage"] }, { kind: "directive", type: i3.RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: DatapointSelectorModule }, { kind: "component", type: i5.DatapointSelectionListComponent, selector: "c8y-datapoint-selection-list", inputs: ["actions", "allowDragAndDrop", "config", "defaultFormOptions", "maxActiveCount", "minActiveCount", "resolveContext", "listTitle"], outputs: ["isValid", "change"] }], viewProviders: [{ provide: ControlContainer, useExisting: NgForm }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: InfoGaugeWidgetConfigComponent, decorators: [{
            type: Component,
            args: [{ selector: 'c8y-info-gauge-widget-config', viewProviders: [{ provide: ControlContainer, useExisting: NgForm }], standalone: true, imports: [CoreModule, ReactiveFormsModule, DatapointSelectorModule], template: "<div class=\"p-l-24 p-r-24\">\n  <form\n    class=\"no-card-context\"\n    [formGroup]=\"formGroup\"\n  >\n    <div class=\"row\">\n      <div class=\"col-md-6\">\n        <c8y-form-group class=\"p-t-8\">\n          <label translate>Decimal places</label>\n          <input\n            class=\"form-control\"\n            name=\"fractionSize\"\n            type=\"number\"\n            formControlName=\"fractionSize\"\n            step=\"1\"\n          />\n          <c8y-messages [show]=\"formGroup.controls.fractionSize.errors\"></c8y-messages>\n        </c8y-form-group>\n      </div>\n      <div class=\"col-md-6 p-t-8\">\n        <div\n          class=\"alert alert-info\"\n          role=\"alert\"\n          *ngIf=\"formGroup.errors?.noActiveDatapoint\"\n          translate\n        >\n          At least one data point for the labels or the gauge needs to be selected.\n        </div>\n      </div>\n    </div>\n\n    <div class=\"row\">\n      <div class=\"col-md-6\">\n        <c8y-datapoint-selection-list\n          class=\"bg-inherit separator-top p-t-16 d-block\"\n          name=\"datapoints\"\n          listTitle=\"{{ 'Multiple label and value pairs' | translate }}\"\n          [defaultFormOptions]=\"defaultFormOptions\"\n          [config]=\"datapointSelectionConfig\"\n          [minActiveCount]=\"0\"\n          formControlName=\"datapointsLabels\"\n        ></c8y-datapoint-selection-list>\n      </div>\n      <div class=\"col-md-6\">\n        <c8y-datapoint-selection-list\n          class=\"bg-inherit separator-top p-t-16 d-block\"\n          name=\"datapoints\"\n          listTitle=\"{{ 'Gauge`display`' | translate }}\"\n          [defaultFormOptions]=\"defaultFormOptions\"\n          [config]=\"datapointSelectionConfig\"\n          [minActiveCount]=\"0\"\n          [maxActiveCount]=\"1\"\n          formControlName=\"datapointsGauge\"\n        ></c8y-datapoint-selection-list>\n      </div>\n    </div>\n  </form>\n</div>\n" }]
        }], ctorParameters: () => [{ type: i1$1.FormBuilder }, { type: i1$1.NgForm }, { type: i1.WidgetConfigComponent }], propDecorators: { config: [{
                type: Input
            }] } });

/**
 * @deprecated
 */
class InfoGaugeWidgetModule {
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: InfoGaugeWidgetModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.9", ngImport: i0, type: InfoGaugeWidgetModule, imports: [InfoGaugeWidgetViewComponent,
            InfoGaugeWidgetConfigComponent,
            InfoGaugeCurrentMeasurementPipe] }); }
    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: InfoGaugeWidgetModule, imports: [InfoGaugeWidgetConfigComponent] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: InfoGaugeWidgetModule, decorators: [{
            type: NgModule,
            args: [{
                    imports: [
                        InfoGaugeWidgetViewComponent,
                        InfoGaugeWidgetConfigComponent,
                        InfoGaugeCurrentMeasurementPipe
                    ]
                }]
        }] });

/**
 * Generated bundle index. Do not edit.
 */

export { InfoGaugeWidgetConfigComponent, InfoGaugeWidgetModule, InfoGaugeWidgetViewComponent };
//# sourceMappingURL=c8y-ngx-components-widgets-implementations-info-gauge.mjs.map
