import * as i0 from '@angular/core';
import { inject, Component, Input } from '@angular/core';
import * as i1 from '@angular/common';
import { CommonModule } from '@angular/common';
import * as i2 from '@angular/forms';
import { FormBuilder, Validators, ReactiveFormsModule } from '@angular/forms';
import * as i3 from '@angular/material/card';
import { MatCardModule } from '@angular/material/card';
import { LdcFieldBuilderComponent } from '@testlocallibrary/shared-kernel/components/ldc-form/ldc-dynamic-form/ldc-field-builder';
import { ButtonType, LdcButtonTypes, LdcButtonComponent } from '@testlocallibrary/shared-kernel/components/ldc-button';
import { LdcDynamicButtonsComponent } from '@testlocallibrary/shared-kernel/components/ldc-dynamic-buttons';

class LdcFormArrayBuilderComponent {
    constructor() {
        this.fields = [];
        this.buttons = [
            {
                text: "Add",
                type: ButtonType.Button,
                icon: "add",
                matType: LdcButtonTypes.Flat,
                id: 'add',
                // color: ButtonColors.primary,
                onClick: () => {
                    this.addNewCard();
                },
            },
        ];
        this._fb = inject(FormBuilder);
    }
    ngOnChanges() {
        if (this.formArrayName && this.formGroup && this.fields && this.label) {
            this.initializeFormArray();
        }
    }
    getFormArray() {
        return this.formGroup.get(this.formArrayName);
    }
    initializeFormArray() {
        let formControllers = {};
        const formArray = this.formGroup.get(this.formArrayName);
        for (let i = 0; i < this.fields.length; i++) {
            for (const field of this.fields[i].fields) {
                formControllers[field.controller.name] = field.controller
                    .controller;
            }
            formArray.push(this._fb.group(formControllers));
        }
    }
    addNewCard() {
        let formControllers = {};
        const formArray = this.formGroup.get(this.formArrayName);
        for (const field of this.fields[0].fields) {
            formControllers[field.controller.name] = this._fb.control(null, [
                Validators.required,
            ]);
        }
        this.fields.push({
            fields: [
                ...this.fields[0].fields.map(field => {
                    return {
                        ...field,
                        controller: {
                            ...field.controller,
                            controller: this._fb.control(null, field.controller.controller.validator),
                        },
                    };
                }),
            ],
        });
        formArray.push(this._fb.group(formControllers));
        formArray.at(formArray.length - 1).reset();
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LdcFormArrayBuilderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: LdcFormArrayBuilderComponent, isStandalone: true, selector: "lib-ldc-form-array-builder", inputs: { formArrayName: ["arrayController", "formArrayName"], formGroup: "formGroup", label: "label", fields: "fields" }, usesOnChanges: true, ngImport: i0, template: "<div [formGroup]=\"formGroup\">\r\n  <div [formArrayName]=\"formArrayName\">\r\n    <mat-card\r\n      *ngFor=\"let item of getFormArray().controls; let groupIndex = index\"\r\n      class=\"row my-2\">\r\n      <div [formGroupName]=\"groupIndex\" class=\"p-3 m-2 row\">\r\n        <ng-container\r\n          *ngFor=\"\r\n            let filed of fields[groupIndex]['fields'];\r\n            let filedIndex = index\r\n          \">\r\n          <div\r\n            class=\"col-{{ filed['columnSize'] }} {{ filed['containerStyle'] }}\">\r\n            <lib-ldc-field-builder [inputSpecification]=\"filed\" />\r\n          </div>\r\n        </ng-container>\r\n      </div>\r\n    </mat-card>\r\n  </div>\r\n  <lib-ldc-dynamic-buttons [buttons]=\"buttons\"/>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "component", type: LdcFieldBuilderComponent, selector: "lib-ldc-field-builder", inputs: ["inputSpecification", "errors"] }, { kind: "ngmodule", type: MatCardModule }, { kind: "component", type: i3.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: LdcDynamicButtonsComponent, selector: "lib-ldc-dynamic-buttons", inputs: ["buttons", "item"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: LdcFormArrayBuilderComponent, decorators: [{
            type: Component,
            args: [{ selector: "lib-ldc-form-array-builder", imports: [
                        CommonModule,
                        ReactiveFormsModule,
                        LdcFieldBuilderComponent,
                        MatCardModule,
                        LdcButtonComponent,
                        LdcDynamicButtonsComponent
                    ], standalone: true, template: "<div [formGroup]=\"formGroup\">\r\n  <div [formArrayName]=\"formArrayName\">\r\n    <mat-card\r\n      *ngFor=\"let item of getFormArray().controls; let groupIndex = index\"\r\n      class=\"row my-2\">\r\n      <div [formGroupName]=\"groupIndex\" class=\"p-3 m-2 row\">\r\n        <ng-container\r\n          *ngFor=\"\r\n            let filed of fields[groupIndex]['fields'];\r\n            let filedIndex = index\r\n          \">\r\n          <div\r\n            class=\"col-{{ filed['columnSize'] }} {{ filed['containerStyle'] }}\">\r\n            <lib-ldc-field-builder [inputSpecification]=\"filed\" />\r\n          </div>\r\n        </ng-container>\r\n      </div>\r\n    </mat-card>\r\n  </div>\r\n  <lib-ldc-dynamic-buttons [buttons]=\"buttons\"/>\r\n</div>\r\n" }]
        }], propDecorators: { formArrayName: [{
                type: Input,
                args: [{ required: true, alias: "arrayController" }]
            }], formGroup: [{
                type: Input,
                args: [{ required: true }]
            }], label: [{
                type: Input,
                args: [{ required: true }]
            }], fields: [{
                type: Input,
                args: [{ required: true }]
            }] } });

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

export { LdcFormArrayBuilderComponent };
//# sourceMappingURL=testlocallibrary-shared-kernel-components-ldc-form-ldc-dynamic-form-ldc-form-array-builder.mjs.map
