import { Component, EventEmitter, Input, Output } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "@angular/forms";
import * as i3 from "verben-ng-ui";
export class ExpirationComponent {
    idOptions = ['12uio899920000', '12uio8999299000', '896o899920000'];
    chipArray = [];
    cycle = [
        {
            id: 0,
            expanded: false,
            messages: [{ messageId: 'Default ID 1', subject: 'Default Subject 1', recipients: 'Default Recipients 1' }]
        },
        {
            id: 1,
            expanded: false,
            messages: [{ messageId: 'Default ID 2', subject: 'Default Subject 2', recipients: 'Default Recipients 2' }]
        },
        {
            id: 2,
            expanded: false,
            messages: [{ messageId: 'Default ID 3', subject: 'Default Subject 3', recipients: 'Default Recipients 3' }]
        }
    ];
    toggle = new EventEmitter();
    toggleCycle(index) {
        this.cycle[index].expanded = !this.cycle[index].expanded;
        this.toggle.emit(this.cycle[index].id);
    }
    addMessage(index) {
        this.cycle[index].messages.push({
            messageId: 'New Message ID',
            subject: 'New Subject',
            recipients: 'New Recipients'
        });
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ExpirationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: ExpirationComponent, selector: "lib-expiration", inputs: { cycle: "cycle" }, outputs: { toggle: "toggle" }, ngImport: i0, template: "<div class=\"w-full bg-white p-4\">\n    <div *ngFor=\"let item of cycle; let i = index\">\n      <div class=\"bg-[#FFE681B2] px-6 py-3 flex items-center mb-6 justify-between\" (click)=\"toggleCycle(i)\">\n        <span>Cycle {{ item.id + 1 }}</span>\n        <span class=\" cursor-pointer\">{{ item.expanded ? '\u25B2' : '\u25BC' }}</span>\n      </div>\n  \n      <div *ngIf=\"item.expanded\" class=\"cycle-content border border-primary p-6\">\n        <div *ngFor=\"let message of item.messages\" class=\"flex flex-col gap-6 mb-4\">\n          <verben-drop-down width=\"100%\" placeholder=\"Select Message ID\" [(options)]=\"idOptions\"></verben-drop-down>\n          <verbena-input type=\"text\" placeHolder=\"Message Subject\" bgColor=\"white\"></verbena-input>\n          <verben-chip [(ngModel)]=\"chipArray\" placeholder=\"Recipients\"></verben-chip>\n        </div>\n  \n        <div class=\"flex justify-end mt-4\">\n          <verbena-button text=\"+ Add Message\" bgColor=\"transparent\" pd=\"0\" textColor=\"blue\" (click)=\"addMessage(i)\"></verbena-button>\n        </div>\n      </div>\n    </div>\n  </div>\n  ", styles: [""], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3.VerbenaInputComponent, selector: "verbena-input", inputs: ["label", "placeHolder", "required", "svgPosition", "minLength", "maxLength", "type", "bgColor", "border", "borderRadius", "textColor", "value", "labelPosition", "labelColor", "disable", "readOnly", "min", "max", "showBorder", "showErrorMessage", "errorMessageColor", "errorBorderColor", "errorPosition", "svg", "fontSize", "svgWidth", "svgHeight", "svgColor", "capitalization", "inputContainerClass", "inputFieldClass", "passLength", "inputWrapperClass", "passwordToggle", "customErrorMessages", "icon", "textPass"], outputs: ["valueChange"] }, { kind: "component", type: i3.VerbenaButtonComponent, selector: "verbena-button", inputs: ["text", "icon", "useIcon", "svgPosition", "iconPosition", "bgColor", "textColor", "border", "borderRadius", "pd", "width", "height", "fontSize", "fontWeight", "disable", "svgSize", "weight", "variant", "styleType", "svg", "svgWidth", "svgHeight", "iconColor", "svgColor", "buttonClass", "buttonTextClass", "isLoading", "spinnerSize", "spinnerColor"] }, { kind: "component", type: i3.DropDownComponent, selector: "verben-drop-down", inputs: ["options", "width", "showHorizontalLine", "horizontalLineColor", "optionLabel", "optionSubLabel", "optionValue", "placeholder", "invalidMessage", "errorPosition", "loadMoreCaption", "display", "showClear", "lazyLoad", "selectKey", "styleClass", "group", "multiselect", "filter", "avoidDuplication", "filterBy", "debounceTime", "minChar", "disabled", "required", "load", "asyncLabel", "search"], outputs: ["optionsChange", "onChange", "onClick", "onClear"] }, { kind: "component", type: i3.ChipComponent, selector: "verben-chip", inputs: ["width", "placeholder", "max", "styleClass", "separator", "disabled", "required", "invalidMessage", "errorPosition"], outputs: ["onChange"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ExpirationComponent, decorators: [{
            type: Component,
            args: [{ selector: 'lib-expiration', template: "<div class=\"w-full bg-white p-4\">\n    <div *ngFor=\"let item of cycle; let i = index\">\n      <div class=\"bg-[#FFE681B2] px-6 py-3 flex items-center mb-6 justify-between\" (click)=\"toggleCycle(i)\">\n        <span>Cycle {{ item.id + 1 }}</span>\n        <span class=\" cursor-pointer\">{{ item.expanded ? '\u25B2' : '\u25BC' }}</span>\n      </div>\n  \n      <div *ngIf=\"item.expanded\" class=\"cycle-content border border-primary p-6\">\n        <div *ngFor=\"let message of item.messages\" class=\"flex flex-col gap-6 mb-4\">\n          <verben-drop-down width=\"100%\" placeholder=\"Select Message ID\" [(options)]=\"idOptions\"></verben-drop-down>\n          <verbena-input type=\"text\" placeHolder=\"Message Subject\" bgColor=\"white\"></verbena-input>\n          <verben-chip [(ngModel)]=\"chipArray\" placeholder=\"Recipients\"></verben-chip>\n        </div>\n  \n        <div class=\"flex justify-end mt-4\">\n          <verbena-button text=\"+ Add Message\" bgColor=\"transparent\" pd=\"0\" textColor=\"blue\" (click)=\"addMessage(i)\"></verbena-button>\n        </div>\n      </div>\n    </div>\n  </div>\n  " }]
        }], propDecorators: { cycle: [{
                type: Input
            }], toggle: [{
                type: Output
            }] } });
//# sourceMappingURL=data:application/json;base64, 