import { Component, Input, ViewEncapsulation } from '@angular/core';
import { FormObjectViewService } from '../../form-object-view.service';
import { ChildRecord } from '../../../../forms/page/widgets/child-record';
import { DetailViewType } from '../../../../forms/page/common/detail-view-enums';
import * as i0 from "@angular/core";
import * as i1 from "../../form-object-view.service";
function ChildRecordsWidgetViewComponent_div_0_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 3);
    i0.ɵɵelementStart(1, "div", 4);
    i0.ɵɵelement(2, "mat-icon", 5);
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(3, "div");
    i0.ɵɵtext(4);
    i0.ɵɵelementEnd();
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r0 = i0.ɵɵnextContext();
    i0.ɵɵproperty("ngSwitch", ctx_r0.widget.subType);
    i0.ɵɵadvance(4);
    i0.ɵɵtextInterpolate(ctx_r0.widget.prompt);
} }
function ChildRecordsWidgetViewComponent_div_1_mat_spinner_11_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "mat-spinner", 23);
} if (rf & 2) {
    i0.ɵɵproperty("diameter", 15);
} }
function ChildRecordsWidgetViewComponent_div_1_img_14_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "img", 24);
} }
function ChildRecordsWidgetViewComponent_div_1_img_15_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "img", 25);
} }
function ChildRecordsWidgetViewComponent_div_1_img_16_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "img", 26);
} }
function ChildRecordsWidgetViewComponent_div_1_div_19_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 27);
    i0.ɵɵelement(1, "dynamic-data-view", 28);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const child_r3 = i0.ɵɵnextContext().$implicit;
    const ctx_r10 = i0.ɵɵnextContext();
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("dataDetailView", ctx_r10.childRecordsDetailView[child_r3.Id])("baseUrl", ctx_r10.baseUrl)("viewType", ctx_r10.detailViewType.FormObjectView)("axonatorX1Url", ctx_r10.axonatorX1Url);
} }
function ChildRecordsWidgetViewComponent_div_1_Template(rf, ctx) { if (rf & 1) {
    const _r14 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "div");
    i0.ɵɵelementStart(1, "div", 6);
    i0.ɵɵlistener("click", function ChildRecordsWidgetViewComponent_div_1_Template_div_click_1_listener($event) { return $event.stopPropagation(); });
    i0.ɵɵelementStart(2, "div", 7);
    i0.ɵɵelementStart(3, "div", 8);
    i0.ɵɵlistener("click", function ChildRecordsWidgetViewComponent_div_1_Template_div_click_3_listener() { const restoredCtx = i0.ɵɵrestoreView(_r14); const child_r3 = restoredCtx.$implicit; const _r5 = i0.ɵɵreference(13); const ctx_r13 = i0.ɵɵnextContext(); return ctx_r13.toggleAccordion(_r5, child_r3.Id, ctx_r13.section.childSectionId); });
    i0.ɵɵelementStart(4, "div", 9);
    i0.ɵɵelementStart(5, "div", 10);
    i0.ɵɵelement(6, "mat-icon", 11);
    i0.ɵɵelementStart(7, "span", 12);
    i0.ɵɵtext(8);
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(9, "p", 13);
    i0.ɵɵtext(10);
    i0.ɵɵelementEnd();
    i0.ɵɵelementEnd();
    i0.ɵɵelementEnd();
    i0.ɵɵtemplate(11, ChildRecordsWidgetViewComponent_div_1_mat_spinner_11_Template, 1, 1, "mat-spinner", 14);
    i0.ɵɵelementStart(12, "button", 15, 16);
    i0.ɵɵlistener("click", function ChildRecordsWidgetViewComponent_div_1_Template_button_click_12_listener() { const restoredCtx = i0.ɵɵrestoreView(_r14); const child_r3 = restoredCtx.$implicit; const _r5 = i0.ɵɵreference(13); const ctx_r15 = i0.ɵɵnextContext(); return ctx_r15.toggleAccordion(_r5, child_r3.Id, ctx_r15.section.childSectionId); });
    i0.ɵɵtemplate(14, ChildRecordsWidgetViewComponent_div_1_img_14_Template, 1, 0, "img", 17);
    i0.ɵɵtemplate(15, ChildRecordsWidgetViewComponent_div_1_img_15_Template, 1, 0, "img", 18);
    i0.ɵɵelementEnd();
    i0.ɵɵtemplate(16, ChildRecordsWidgetViewComponent_div_1_img_16_Template, 1, 0, "img", 19);
    i0.ɵɵelementEnd();
    i0.ɵɵelementStart(17, "div", 20, 21);
    i0.ɵɵtemplate(19, ChildRecordsWidgetViewComponent_div_1_div_19_Template, 2, 4, "div", 22);
    i0.ɵɵelementEnd();
    i0.ɵɵelementEnd();
    i0.ɵɵelementEnd();
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const child_r3 = ctx.$implicit;
    const ctx_r1 = i0.ɵɵnextContext();
    i0.ɵɵadvance(3);
    i0.ɵɵattribute("data-bs-target", "#" + ctx_r1.section.widget.identifier + "_" + child_r3.Id + "_" + ctx_r1.section.childSectionId);
    i0.ɵɵadvance(5);
    i0.ɵɵtextInterpolate(child_r3.title);
    i0.ɵɵadvance(2);
    i0.ɵɵtextInterpolate(child_r3.subTitle);
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngIf", ctx_r1.childRecordsInProgress[ctx_r1.section.widget.identifier + "_" + child_r3.Id]);
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("id", ctx_r1.section.widget.identifier + "_" + child_r3.Id);
    i0.ɵɵattribute("data-bs-target", "#" + ctx_r1.section.widget.identifier + "_" + child_r3.Id + "_" + ctx_r1.section.childSectionId)("aria-controls", ctx_r1.section.widget.identifier + "_" + child_r3.Id + "_" + ctx_r1.section.childSectionId);
    i0.ɵɵadvance(2);
    i0.ɵɵproperty("ngIf", !ctx_r1.expandedChildRecords[ctx_r1.section.widget.identifier + "_" + child_r3.Id] && !ctx_r1.childRecordsInProgress[ctx_r1.section.widget.identifier + "_" + child_r3.Id]);
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngIf", ctx_r1.expandedChildRecords[ctx_r1.section.widget.identifier + "_" + child_r3.Id]);
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngIf", ctx_r1.expandedChildRecords[ctx_r1.section.widget.identifier + "_" + child_r3.Id]);
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("id", ctx_r1.section.widget.identifier + "_" + child_r3.Id + "_" + ctx_r1.section.childSectionId);
    i0.ɵɵadvance(2);
    i0.ɵɵproperty("ngIf", ctx_r1.childRecordsDetailView[child_r3.Id]);
} }
function ChildRecordsWidgetViewComponent_ng_container_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementContainerStart(0);
    i0.ɵɵelementStart(1, "div", 29);
    i0.ɵɵelement(2, "mat-icon", 11);
    i0.ɵɵelementStart(3, "span", 30);
    i0.ɵɵtext(4, "-");
    i0.ɵɵelementEnd();
    i0.ɵɵelementEnd();
    i0.ɵɵelementContainerEnd();
} }
export class ChildRecordsWidgetViewComponent {
    constructor(_formObjectViewService) {
        this._formObjectViewService = _formObjectViewService;
        this.childRecordsDetailView = new Map();
        this.expandedChildRecords = new Map();
        this.childRecordsInProgress = new Map();
        this.detailViewType = Object.assign({}, DetailViewType);
    }
    ngOnInit() {
        this.section.showPrompt = this.section.showPrompt;
    }
    toggleAccordion(accordionToggle, formobjectId, childSectionId) {
        if (!(formobjectId in this.childRecordsDetailView)) {
            this.childRecordsInProgress[accordionToggle.id] = true;
            this._formObjectViewService.createDataDetailView(childSectionId, formobjectId, Number(this.widget.childFormId), this.axonatorX1Url).then((dataDetailSection) => {
                this.childRecordsDetailView[formobjectId] = dataDetailSection;
                this.expandedChildRecords[accordionToggle.id] = accordionToggle.ariaExpanded == 'true';
                this.childRecordsInProgress[accordionToggle.id] = false;
            });
        }
        else
            this.expandedChildRecords[accordionToggle.id] = accordionToggle.ariaExpanded == 'true';
    }
}
ChildRecordsWidgetViewComponent.ɵfac = function ChildRecordsWidgetViewComponent_Factory(t) { return new (t || ChildRecordsWidgetViewComponent)(i0.ɵɵdirectiveInject(i1.FormObjectViewService)); };
ChildRecordsWidgetViewComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ChildRecordsWidgetViewComponent, selectors: [["lib-child-records-widget-view"]], inputs: { widget: "widget", axonatorX1Url: "axonatorX1Url" }, decls: 3, vars: 3, consts: [["class", "child-record-title flex items-center text-sm", 3, "ngSwitch", 4, "ngIf"], [4, "ngFor", "ngForOf"], [4, "ngIf"], [1, "child-record-title", "flex", "items-center", "text-sm", 3, "ngSwitch"], [1, "flex", "items-start"], ["svgIcon", "axo_child_records", 1, "add-text"], [1, "accordion", "child-record", 3, "click"], [1, "accordion-item", "bg-white", "border", "border-gray-200"], ["id", "accordionHeading", "data-bs-toggle", "collapse", 1, "accordion-header", "mb-0", "sm:py-4", "sm:pl-10", "sm:pr-2", "p-4", 3, "click"], [1, "data-detail-info"], [1, "children-title", "text-sm"], ["svgIcon", "axo_child_records", 1, "add-text", "child-record-icon"], [1, "child-recordTitle"], [1, "child-record-subtitle", "m-0"], ["class", "expand-button", 3, "diameter", 4, "ngIf"], ["type", "button", "data-bs-toggle", "collapse", "aria-expanded", "false", 1, "expand-button", 3, "id", "click"], ["accordionToggle", ""], ["class", "child-expand-icon", "alt", "", "src", "assets/icons/axo/expand_icon.svg", 4, "ngIf"], ["class", "child-expand-icon", "alt", "", "src", "assets/icons/axo/collapse_icon.svg", 4, "ngIf"], ["class", "child-expanded-icon", "alt", "", "src", "assets/icons/axo/expanded_arrow.svg", 4, "ngIf"], ["aria-labelledby", "accordionHeading", 1, "accordion-collapse", "collapse", 3, "id"], ["accordionBody", ""], ["class", "accordion-body", 4, "ngIf"], [1, "expand-button", 3, "diameter"], ["alt", "", "src", "assets/icons/axo/expand_icon.svg", 1, "child-expand-icon"], ["alt", "", "src", "assets/icons/axo/collapse_icon.svg", 1, "child-expand-icon"], ["alt", "", "src", "assets/icons/axo/expanded_arrow.svg", 1, "child-expanded-icon"], [1, "accordion-body"], [3, "dataDetailView", "baseUrl", "viewType", "axonatorX1Url"], [1, "flex", "items-center", "gap-3"], [1, "flex", "justify-start"]], template: function ChildRecordsWidgetViewComponent_Template(rf, ctx) { if (rf & 1) {
        i0.ɵɵtemplate(0, ChildRecordsWidgetViewComponent_div_0_Template, 5, 2, "div", 0);
        i0.ɵɵtemplate(1, ChildRecordsWidgetViewComponent_div_1_Template, 20, 12, "div", 1);
        i0.ɵɵtemplate(2, ChildRecordsWidgetViewComponent_ng_container_2_Template, 5, 0, "ng-container", 2);
    } if (rf & 2) {
        i0.ɵɵproperty("ngIf", ctx.section.showPrompt);
        i0.ɵɵadvance(1);
        i0.ɵɵproperty("ngForOf", ctx.widget == null ? null : ctx.widget.value);
        i0.ɵɵadvance(1);
        i0.ɵɵproperty("ngIf", !ctx.widget.value || ctx.widget.value.length <= 0);
    } }, styles: ["lib-child-records-widget-view{display:flex;flex-direction:column;row-gap:25px}lib-child-records-widget-view .accordion{position:relative;background-color:#fafbfc}lib-child-records-widget-view .accordion .records-connection-line{position:absolute;left:4.1rem;height:calc(100% - 16px);border-left:1px solid;width:2px}lib-child-records-widget-view .accordion .accordion-item{border-radius:.25rem}lib-child-records-widget-view .accordion .accordion-header{background:#FAFBFC;border-radius:.25rem;cursor:pointer}lib-child-records-widget-view .accordion .accordion-header .child-expand-icon{width:1rem}lib-child-records-widget-view .accordion .accordion-header .child-expanded-icon{width:1rem;position:absolute;left:1.5rem;top:3.5rem}lib-child-records-widget-view .accordion .expand-button{position:absolute;bottom:-.4rem;left:1.5rem}@media screen and (max-width: 600px){lib-child-records-widget-view .accordion .accordion-header .child-expanded-icon{left:.5rem}lib-child-records-widget-view .accordion .expand-button{left:.5rem}}lib-child-records-widget-view .accordion .child-record-icon{grid-area:child-record-icon}lib-child-records-widget-view .accordion .child-recordTitle{grid-area:child-record-title}lib-child-records-widget-view .accordion .child-record-subtitle{grid-area:child-record-subtitle;color:#6c798f;font-family:Roboto,sans-serif;font-size:10px;height:.625rem}lib-child-records-widget-view .accordion .children-title{line-height:14px;display:grid;grid-template-areas:\"child-record-icon child-record-title\" \". child-record-subtitle\";grid-column-gap:8px;column-gap:8px;grid-row-gap:4px;row-gap:4px;align-items:center}lib-child-records-widget-view .accordion .accordion-body{margin-top:1rem;background-color:#fcfdff;border-radius:.5rem}lib-child-records-widget-view .accordion .accordion-body .mat-card{margin-bottom:16px!important}lib-child-records-widget-view .accordion .accordion-collapse{background-color:#fcfdff}lib-child-records-widget-view .data-detail-content{margin:0!important}lib-child-records-widget-view .child-record-title{font-weight:500!important;font-size:12px!important;color:#10172b!important;margin:0!important;column-gap:15px}lib-child-records-widget-view .data-detail-title{margin:0 0 8px!important}lib-child-records-widget-view .mat-icon{height:18px;min-height:18px;width:18px;min-width:18px}\n"], encapsulation: 2 });
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ChildRecordsWidgetViewComponent, [{
        type: Component,
        args: [{ selector: 'lib-child-records-widget-view', encapsulation: ViewEncapsulation.None, template: "<div  *ngIf=\"section.showPrompt\" class=\"child-record-title flex items-center text-sm\" [ngSwitch]=\"widget.subType\">\n    <div class=\"flex items-start\"> <mat-icon class=\"add-text\" svgIcon=\"axo_child_records\"></mat-icon></div>\n    <div>{{widget.prompt}}</div>\n</div>  \n\n<div *ngFor=\"let child of widget?.value\">    \n    <div class=\"accordion child-record\" (click)=\"$event.stopPropagation()\">\n        <div class=\"accordion-item bg-white border border-gray-200\">\n            <div class=\"accordion-header mb-0 sm:py-4 sm:pl-10 sm:pr-2 p-4\" id=\"accordionHeading\" data-bs-toggle=\"collapse\" (click)=\"toggleAccordion(accordionToggle,child.Id,section.childSectionId)\" [attr.data-bs-target]=\"'#'+section.widget.identifier+'_'+child.Id+'_'+section.childSectionId\">\n              <div class=\"data-detail-info\">\n                <div class=\"children-title text-sm\" >\n                    \n                    <mat-icon class=\"add-text child-record-icon\" svgIcon=\"axo_child_records\"></mat-icon> \n                    <span class=\"child-recordTitle\">{{child.title}}</span>        \n                    <p class=\"child-record-subtitle m-0\">{{child.subTitle}}</p>\n                </div>\n            </div>\n            <mat-spinner *ngIf=\"childRecordsInProgress[section.widget.identifier+'_'+child.Id]\" class=\"expand-button\" [diameter]=\"15\"></mat-spinner>\n            <button #accordionToggle [id] =\"section.widget.identifier+'_'+child.Id\"   (click)=\"toggleAccordion(accordionToggle,child.Id,section.childSectionId)\" class=\"expand-button\" type=\"button\" data-bs-toggle=\"collapse\" [attr.data-bs-target]=\"'#'+section.widget.identifier+'_'+child.Id+'_'+section.childSectionId\" aria-expanded=\"false\"\n               [attr.aria-controls]=\"section.widget.identifier+'_'+child.Id+'_'+section.childSectionId\">\n                <img *ngIf=\"!expandedChildRecords[section.widget.identifier+'_'+child.Id] && !childRecordsInProgress[section.widget.identifier+'_'+child.Id]\" class=\"child-expand-icon\" alt=\"\" src=\"assets/icons/axo/expand_icon.svg\">\n                <img *ngIf=\"expandedChildRecords[section.widget.identifier+'_'+child.Id]\" class=\"child-expand-icon\" alt=\"\" src=\"assets/icons/axo/collapse_icon.svg\">\n\n            </button>\n            <img *ngIf=\"expandedChildRecords[section.widget.identifier+'_'+child.Id]\" class=\"child-expanded-icon\" alt=\"\" src=\"assets/icons/axo/expanded_arrow.svg\">\n            </div>\n            <div #accordionBody [id]=\"section.widget.identifier+'_'+child.Id+'_'+section.childSectionId\" class=\"accordion-collapse collapse\" aria-labelledby=\"accordionHeading\">\n            <div class=\"accordion-body\" *ngIf=\"childRecordsDetailView[child.Id]\" >\n                <dynamic-data-view [dataDetailView]=\"childRecordsDetailView[child.Id]\"\n                [baseUrl]=\"baseUrl\" \n                [viewType]=\"detailViewType.FormObjectView\"\n                [axonatorX1Url] =\"axonatorX1Url\"></dynamic-data-view>\n            </div>\n            </div>\n        </div>\n    </div>\n</div>\n<ng-container *ngIf=\"!widget.value || widget.value.length <= 0\" >\n    <div class=\"flex items-center gap-3\">\n        <mat-icon class=\"add-text child-record-icon\" svgIcon=\"axo_child_records\"></mat-icon> \n        <span class=\"flex justify-start\">-</span>\n    </div>\n</ng-container>\n\n\n", styles: ["lib-child-records-widget-view{display:flex;flex-direction:column;row-gap:25px}lib-child-records-widget-view .accordion{position:relative;background-color:#fafbfc}lib-child-records-widget-view .accordion .records-connection-line{position:absolute;left:4.1rem;height:calc(100% - 16px);border-left:1px solid;width:2px}lib-child-records-widget-view .accordion .accordion-item{border-radius:.25rem}lib-child-records-widget-view .accordion .accordion-header{background:#FAFBFC;border-radius:.25rem;cursor:pointer}lib-child-records-widget-view .accordion .accordion-header .child-expand-icon{width:1rem}lib-child-records-widget-view .accordion .accordion-header .child-expanded-icon{width:1rem;position:absolute;left:1.5rem;top:3.5rem}lib-child-records-widget-view .accordion .expand-button{position:absolute;bottom:-.4rem;left:1.5rem}@media screen and (max-width: 600px){lib-child-records-widget-view .accordion .accordion-header .child-expanded-icon{left:.5rem}lib-child-records-widget-view .accordion .expand-button{left:.5rem}}lib-child-records-widget-view .accordion .child-record-icon{grid-area:child-record-icon}lib-child-records-widget-view .accordion .child-recordTitle{grid-area:child-record-title}lib-child-records-widget-view .accordion .child-record-subtitle{grid-area:child-record-subtitle;color:#6c798f;font-family:Roboto,sans-serif;font-size:10px;height:.625rem}lib-child-records-widget-view .accordion .children-title{line-height:14px;display:grid;grid-template-areas:\"child-record-icon child-record-title\" \". child-record-subtitle\";grid-column-gap:8px;column-gap:8px;grid-row-gap:4px;row-gap:4px;align-items:center}lib-child-records-widget-view .accordion .accordion-body{margin-top:1rem;background-color:#fcfdff;border-radius:.5rem}lib-child-records-widget-view .accordion .accordion-body .mat-card{margin-bottom:16px!important}lib-child-records-widget-view .accordion .accordion-collapse{background-color:#fcfdff}lib-child-records-widget-view .data-detail-content{margin:0!important}lib-child-records-widget-view .child-record-title{font-weight:500!important;font-size:12px!important;color:#10172b!important;margin:0!important;column-gap:15px}lib-child-records-widget-view .data-detail-title{margin:0 0 8px!important}lib-child-records-widget-view .mat-icon{height:18px;min-height:18px;width:18px;min-width:18px}\n"] }]
    }], function () { return [{ type: i1.FormObjectViewService }]; }, { widget: [{
            type: Input
        }], axonatorX1Url: [{
            type: Input
        }] }); })();
//# sourceMappingURL=data:application/json;base64, 