import { Component, ChangeDetectionStrategy } from '@angular/core';
import { FormControl, ReactiveFormsModule } from '@angular/forms';
import { FirstUppercaseLocalizeSAPipe } from '@anglr/common';
import { NumberInputModule } from '@anglr/common/forms';
import { RelationsNodeBase, RelationNodeInputSAComponent, RelationNodeOutputSAComponent, RelationsNodeHeaderSAComponent } from '@anglr/dynamic/relations-editor';
import { isNumber } from '@jscrpt/common';
import * as i0 from "@angular/core";
import * as i1 from "@angular/forms";
import * as i2 from "@anglr/common/forms";
/**
 * Debounce value node component for negation
 */
export class DebounceValueNodeSAComponent extends RelationsNodeBase {
    constructor() {
        super(...arguments);
        //######################### protected properties - template bindings #########################
        /**
         * Form control for handling debounce time
         */
        this.debounceTime = new FormControl(50);
    }
    //######################### protected methods - overrides #########################
    /**
     * @inheritdoc
     */
    initialize() {
        this.debounceTime.valueChanges.subscribe(value => {
            if (isNumber(value) && !isNaN(value) && this.metadata?.relationsOptions) {
                this.metadata.relationsOptions.delay = value;
                this.history.getNewState();
            }
        });
    }
    /**
     * @inheritdoc
     */
    metadataSet() {
        if (this.metadata?.relationsOptions?.delay) {
            this.debounceTime.patchValue(this.metadata?.relationsOptions.delay);
        }
    }
}
DebounceValueNodeSAComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: DebounceValueNodeSAComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
DebounceValueNodeSAComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.4", type: DebounceValueNodeSAComponent, isStandalone: true, selector: "debounce-value-node", usesInheritance: true, ngImport: i0, template: "<relations-node-header [parent]=\"this\" [destroySubject]=\"destroySubject\" [name]=\"'debounce value'|firstUppercaseLocalize\"></relations-node-header>\n\n<div class=\"node-content\">\n    <div class=\"dynamic-form-group dynamic-margin-bottom-extra-small dynamic-margin-bottom-small\">\n        <label class=\"dynamic-control-label dynamic-text-uppercase\">{{'debounce time'|firstUppercaseLocalize}}</label>\n        <input type=\"text\" class=\"dynamic-form-control\" [formControl]=\"debounceTime\" number required>\n    </div>\n\n    <div class=\"inputs-outputs\">\n        <div class=\"inputs\">\n            <div class=\"input\">\n                <relation-node-input [parentCoordiantes]=\"nodePosition\" [zoomLevel]=\"zoomLevel\" name=\"value\" [parent]=\"this\"></relation-node-input>\n                <div>{{'value'|firstUppercaseLocalize}}</div>\n            </div>\n        </div>\n\n        <div class=\"outputs\">\n            <div class=\"output\">\n                <div>{{'value'|firstUppercaseLocalize}}</div>\n                <relation-node-output [parentCoordiantes]=\"nodePosition\" [zoomLevel]=\"zoomLevel\" name=\"value\" [parent]=\"this\"></relation-node-output>\n            </div>\n        </div>\n    </div>\n</div>", dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: NumberInputModule }, { kind: "directive", type: i2.NumberInputControlValueAccessor, selector: "input[number][formControlName],input[number][formControl],input[number][ngModel]" }, { kind: "directive", type: i2.NumberInputValidatorDirective, selector: "input[number][formControlName],input[number][formControl],input[number][ngModel]" }, { kind: "component", type: RelationsNodeHeaderSAComponent, selector: "relations-node-header", inputs: ["parent", "destroySubject", "name"] }, { kind: "component", type: RelationNodeInputSAComponent, selector: "relation-node-input" }, { kind: "component", type: RelationNodeOutputSAComponent, selector: "relation-node-output" }, { kind: "pipe", type: FirstUppercaseLocalizeSAPipe, name: "firstUppercaseLocalize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.4", ngImport: i0, type: DebounceValueNodeSAComponent, decorators: [{
            type: Component,
            args: [{ selector: 'debounce-value-node', standalone: true, imports: [
                        ReactiveFormsModule,
                        NumberInputModule,
                        RelationsNodeHeaderSAComponent,
                        RelationNodeInputSAComponent,
                        RelationNodeOutputSAComponent,
                        FirstUppercaseLocalizeSAPipe,
                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "<relations-node-header [parent]=\"this\" [destroySubject]=\"destroySubject\" [name]=\"'debounce value'|firstUppercaseLocalize\"></relations-node-header>\n\n<div class=\"node-content\">\n    <div class=\"dynamic-form-group dynamic-margin-bottom-extra-small dynamic-margin-bottom-small\">\n        <label class=\"dynamic-control-label dynamic-text-uppercase\">{{'debounce time'|firstUppercaseLocalize}}</label>\n        <input type=\"text\" class=\"dynamic-form-control\" [formControl]=\"debounceTime\" number required>\n    </div>\n\n    <div class=\"inputs-outputs\">\n        <div class=\"inputs\">\n            <div class=\"input\">\n                <relation-node-input [parentCoordiantes]=\"nodePosition\" [zoomLevel]=\"zoomLevel\" name=\"value\" [parent]=\"this\"></relation-node-input>\n                <div>{{'value'|firstUppercaseLocalize}}</div>\n            </div>\n        </div>\n\n        <div class=\"outputs\">\n            <div class=\"output\">\n                <div>{{'value'|firstUppercaseLocalize}}</div>\n                <relation-node-output [parentCoordiantes]=\"nodePosition\" [zoomLevel]=\"zoomLevel\" name=\"value\" [parent]=\"this\"></relation-node-output>\n            </div>\n        </div>\n    </div>\n</div>" }]
        }] });
//# sourceMappingURL=debounceValueNode.component.js.map