import { Component, EventEmitter, Input, Output } from '@angular/core';
import { FormControl } from '@angular/forms';
import { Subject, takeUntil } from 'rxjs';
import * as i0 from "@angular/core";
export class IncludeExcludeButtonComponent {
    constructor() {
        this.isExcluded = false;
        this.formElement = null;
        this.stateHandler = new EventEmitter();
        this.destroy$ = new Subject();
    }
    ngOnInit() {
        if (this.formElement) {
            this.formElement.valueChanges.pipe(takeUntil(this.destroy$)).subscribe((value) => {
                this.isExcluded = value;
            });
            this.isExcluded = this.formElement.value;
        }
    }
    toggle(state) {
        if (this.isExcluded !== state) {
            this.isExcluded = state;
            this.stateHandler.emit(state);
            if (this.formElement) {
                this.formElement.setValue(state, { emitEvent: false });
            }
        }
    }
    ngOnDestroy() {
        this.destroy$.next();
        this.destroy$.complete();
    }
}
IncludeExcludeButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: IncludeExcludeButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
IncludeExcludeButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: IncludeExcludeButtonComponent, selector: "epom-include-exclude-button", inputs: { isExcluded: "isExcluded", formElement: "formElement" }, outputs: { stateHandler: "stateHandler" }, ngImport: i0, template: "<section class=\"include-exclude-section\">\n  <div\n    class=\"include-exclude-button include-button\"\n    [class.include-active]=\"!isExcluded\"\n    [attr.data-qa]=\"'include'\"\n    (click)=\"toggle(false)\"\n  >\n    Include\n  </div>\n\n  <div\n    class=\"include-exclude-button exclude-button\"\n    [class.exclude-active]=\"isExcluded\"\n    [attr.data-qa]=\"'exclude'\"\n    (click)=\"toggle(true)\"\n  >\n    Exclude\n  </div>\n</section>\n", styles: [".include-exclude-section{display:flex;justify-content:center;align-items:center;border-radius:4px;height:36px;width:202px;position:relative;outline:1px solid var(--neutral-outline-variant-color)}.include-exclude-button{display:flex;align-items:center;justify-content:center;padding:7.5px 8px;position:relative;color:var(--neutral-on-main-neutral-color);text-overflow:ellipsis;font-size:14px;line-height:21px;cursor:pointer;height:36px;width:100%}.include-button:hover{background-color:var(--success-default-12-color)}.exclude-button:hover{background-color:var(--error-default-12-color)}.include-active{border-radius:4px;color:var(--success-default-color);background-color:var(--success-default-12-color);outline:1px solid var(--success-default-color)}.exclude-active{border-radius:4px;color:var(--error-default-color);background-color:var(--error-default-12-color);outline:1px solid var(--error-default-color)}\n"] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: IncludeExcludeButtonComponent, decorators: [{
            type: Component,
            args: [{ selector: 'epom-include-exclude-button', template: "<section class=\"include-exclude-section\">\n  <div\n    class=\"include-exclude-button include-button\"\n    [class.include-active]=\"!isExcluded\"\n    [attr.data-qa]=\"'include'\"\n    (click)=\"toggle(false)\"\n  >\n    Include\n  </div>\n\n  <div\n    class=\"include-exclude-button exclude-button\"\n    [class.exclude-active]=\"isExcluded\"\n    [attr.data-qa]=\"'exclude'\"\n    (click)=\"toggle(true)\"\n  >\n    Exclude\n  </div>\n</section>\n", styles: [".include-exclude-section{display:flex;justify-content:center;align-items:center;border-radius:4px;height:36px;width:202px;position:relative;outline:1px solid var(--neutral-outline-variant-color)}.include-exclude-button{display:flex;align-items:center;justify-content:center;padding:7.5px 8px;position:relative;color:var(--neutral-on-main-neutral-color);text-overflow:ellipsis;font-size:14px;line-height:21px;cursor:pointer;height:36px;width:100%}.include-button:hover{background-color:var(--success-default-12-color)}.exclude-button:hover{background-color:var(--error-default-12-color)}.include-active{border-radius:4px;color:var(--success-default-color);background-color:var(--success-default-12-color);outline:1px solid var(--success-default-color)}.exclude-active{border-radius:4px;color:var(--error-default-color);background-color:var(--error-default-12-color);outline:1px solid var(--error-default-color)}\n"] }]
        }], propDecorators: { isExcluded: [{
                type: Input
            }], formElement: [{
                type: Input
            }], stateHandler: [{
                type: Output
            }] } });
//# sourceMappingURL=data:application/json;base64, 