import { __decorate, __metadata } from "tslib";
import { Component, EventEmitter, Input, Output, ViewChild, } from '@angular/core';
import { TapValueEditorContainerComponent } from '@iotize/ionic';
import { MonitoringAppGenComponent, } from '../../metadata/decorators';
import * as i0 from "@angular/core";
import * as i1 from "@ionic/angular";
import * as i2 from "../monitoring-range/monitoring-range.component";
import * as i3 from "@iotize/ionic";
import * as i4 from "@angular/common";
let TapVariableRangeComponent = class TapVariableRangeComponent {
    constructor() {
        this.editable = true;
        this.writeValueForEveryChange = false;
        this.min = 0;
        this.max = 100;
        this.step = 1;
        this.color = 'primary';
        this.pin = true;
        this.snaps = true;
        this.ticks = true;
        this.debounce = 0;
        this.valueChange = new EventEmitter();
    }
    set variable(variable) {
        this._variable = variable;
    }
    onValueChange(newValue) {
        // const newValue = $event.detail.value;
        this.valueChange.emit(newValue);
        this.ctx?.notifyValueChange(newValue);
    }
};
/** @nocollapse */ TapVariableRangeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TapVariableRangeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ TapVariableRangeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: TapVariableRangeComponent, selector: "tap-variable-range", inputs: { variable: "variable", editable: "editable", writeValueForEveryChange: "writeValueForEveryChange", min: "min", max: "max", step: "step", color: "color", pin: "pin", snaps: "snaps", ticks: "ticks", debounce: "debounce", leftIcon: "leftIcon", leftIconColor: "leftIconColor", rightIcon: "rightIcon", rightIconColor: "rightIconColor", value: "value" }, outputs: { valueChange: "valueChange" }, viewQueries: [{ propertyName: "ctx", first: true, predicate: ["ctx"], descendants: true }], ngImport: i0, template: "<tap-value-editor-container #ctx [variable]=\"_variable\" [value]=\"value\">\n  <monitoring-range\n    [disabled]=\"!editable || (ctx.loadingChange | async)\"\n    [inputStream]=\"ctx.valueToDisplay\"\n    [ticks]=\"ticks\"\n    [pin]=\"pin\"\n    [snaps]=\"snaps\"\n    [max]=\"max\"\n    [min]=\"min\"\n    [step]=\"step\"\n    [color]=\"color\"\n    [debounce]=\"debounce\"\n    [writeValueForEveryChange]=\"writeValueForEveryChange\"\n    [leftIcon]=\"leftIcon\"\n    [leftIconColor]=\"leftIconColor\"\n    [rightIconColor]=\"rightIconColor\"\n    [rightIcon]=\"rightIcon\"\n    style=\"width: 100%\"\n    (onValueChanged)=\"onValueChange($event)\"\n  >\n    <ng-template monitoringRangeContent>\n      <ion-label slot=\"start\">{{ min }}</ion-label>\n      <ion-label slot=\"end\">{{ max }}</ion-label>\n    </ng-template>\n  </monitoring-range>\n</tap-value-editor-container>\n", styles: [""], dependencies: [{ kind: "component", type: i1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i2.MonitoringRangeComponent, selector: "monitoring-range", inputs: ["inputStream", "min", "max", "step", "debounce", "pin", "disabled", "snaps", "ticks", "writeValueForEveryChange", "leftIcon", "leftIconColor", "rightIcon", "rightIconColor", "color"], outputs: ["onValueChanged"] }, { kind: "directive", type: i2.MonitoringRangeContentDirective, selector: "[monitoringRangeContent]" }, { kind: "component", type: i3.TapValueEditorContainerComponent, selector: "tap-value-editor-container", inputs: ["button", "variable", "inputOptions", "showRefreshButton", "showSubmitButton", "showEditButton", "error", "lines", "modalEdition", "value"], outputs: ["submit", "refresh"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }] });
TapVariableRangeComponent = __decorate([
    MonitoringAppGenComponent({
        constraints: {
            isArray: 'YES',
            isNumber: 'YES',
        },
        events: [
            {
                name: 'submit',
                dataType: 'number',
            },
        ],
    }),
    __metadata("design:paramtypes", [])
], TapVariableRangeComponent);
export { TapVariableRangeComponent };
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TapVariableRangeComponent, decorators: [{
            type: Component,
            args: [{ selector: 'tap-variable-range', template: "<tap-value-editor-container #ctx [variable]=\"_variable\" [value]=\"value\">\n  <monitoring-range\n    [disabled]=\"!editable || (ctx.loadingChange | async)\"\n    [inputStream]=\"ctx.valueToDisplay\"\n    [ticks]=\"ticks\"\n    [pin]=\"pin\"\n    [snaps]=\"snaps\"\n    [max]=\"max\"\n    [min]=\"min\"\n    [step]=\"step\"\n    [color]=\"color\"\n    [debounce]=\"debounce\"\n    [writeValueForEveryChange]=\"writeValueForEveryChange\"\n    [leftIcon]=\"leftIcon\"\n    [leftIconColor]=\"leftIconColor\"\n    [rightIconColor]=\"rightIconColor\"\n    [rightIcon]=\"rightIcon\"\n    style=\"width: 100%\"\n    (onValueChanged)=\"onValueChange($event)\"\n  >\n    <ng-template monitoringRangeContent>\n      <ion-label slot=\"start\">{{ min }}</ion-label>\n      <ion-label slot=\"end\">{{ max }}</ion-label>\n    </ng-template>\n  </monitoring-range>\n</tap-value-editor-container>\n" }]
        }], ctorParameters: function () { return []; }, propDecorators: { variable: [{
                type: Input
            }], editable: [{
                type: Input
            }], writeValueForEveryChange: [{
                type: Input
            }], min: [{
                type: Input
            }], max: [{
                type: Input
            }], step: [{
                type: Input
            }], color: [{
                type: Input
            }], pin: [{
                type: Input
            }], snaps: [{
                type: Input
            }], ticks: [{
                type: Input
            }], debounce: [{
                type: Input
            }], leftIcon: [{
                type: Input
            }], leftIconColor: [{
                type: Input
            }], rightIcon: [{
                type: Input
            }], rightIconColor: [{
                type: Input
            }], value: [{
                type: Input
            }], valueChange: [{
                type: Output
            }], ctx: [{
                type: ViewChild,
                args: ['ctx']
            }] } });
//# sourceMappingURL=data:application/json;base64, 