import { getConfigOptions, selectValidationStatusForAddressGroup } from "@boldpenguin/sdk-redux";
import { h } from "@stencil/core";
import store from "../../services/redux-store.service";
export class BpSdkAccordion {
    constructor() {
        this.mapStateToProps = (state) => {
            var _a;
            return {
                configOptions: getConfigOptions(state),
                addressValidationStatus: selectValidationStatusForAddressGroup(state, (_a = this.questionGroup.poolId) !== null && _a !== void 0 ? _a : this.questionGroup.groupId),
            };
        };
        this.questionGroup = undefined;
        this.startPanelExpanded = true;
        this.configOptions = undefined;
        this.addressValidationStatus = undefined;
        this.useExternal = false;
    }
    resetState() { }
    connectedCallback() {
        this.resetState();
        this.handleSubscriptions();
    }
    componentWillLoad() {
        this.useExternal = !!customElements.get('bp-sdk-external-accordion');
        customElements.whenDefined('bp-sdk-external-accordion').then(() => {
            this.useExternal = true;
        });
        this.handleSubscriptions();
    }
    handleSubscriptions() {
        if (this.storeUnsubscribe) {
            this.storeUnsubscribe();
        }
        store.mapStateToProps(this, this.mapStateToProps);
    }
    render() {
        return [this.useExternal && this.renderExternal(), !this.useExternal && this.renderInternal()];
    }
    renderExternal() {
        return (h("bp-sdk-external-accordion", { questionGroup: this.questionGroup, startPanelExpanded: this.startPanelExpanded, configOptions: this.configOptions, addressValidationStatus: this.addressValidationStatus }));
    }
    renderAnswer(answer) {
        var _a;
        const nestedGroupToRender = (_a = this.questionGroup.nestedGroupsWithAnswers) === null || _a === void 0 ? void 0 : _a.get(answer.id);
        return [
            !nestedGroupToRender && h("bp-sdk-dynamic-input-redux-container", { answer: answer, id: `bp-sdk-question-group__${answer.question.id}` }),
            nestedGroupToRender && h("bp-sdk-question-group-container", { questionGroup: nestedGroupToRender }),
        ];
    }
    renderInternal() {
        var _a, _b, _c, _d, _e;
        return (h("div", { class: "bp-sdk-accordion__container" }, !((_a = this.configOptions) === null || _a === void 0 ? void 0 : _a.hideNestedQuestionGroupLabels) && (h("bp-sdk-question-group-label", { labelId: (_b = this.questionGroup) === null || _b === void 0 ? void 0 : _b.groupId, label: ((_c = this.questionGroup) === null || _c === void 0 ? void 0 : _c.parentQuestionAnswer.value) || ((_d = this.questionGroup) === null || _d === void 0 ? void 0 : _d.parentQuestionAnswer.question.text) })), (_e = this.questionGroup) === null || _e === void 0 ? void 0 :
            _e.answers.map((answer) => this.renderAnswer(answer))));
    }
    static get is() { return "bp-sdk-accordion"; }
    static get originalStyleUrls() {
        return {
            "$": ["./bp-sdk-accordion.css"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["bp-sdk-accordion.css"]
        };
    }
    static get properties() {
        return {
            "questionGroup": {
                "type": "unknown",
                "mutable": false,
                "complexType": {
                    "original": "IMappedQuestionGroupAnswers",
                    "resolved": "IMappedQuestionGroupAnswers",
                    "references": {
                        "IMappedQuestionGroupAnswers": {
                            "location": "import",
                            "path": "@boldpenguin/sdk-types",
                            "id": "../sdk-types/dist/types.d.ts::IMappedQuestionGroupAnswers"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                }
            },
            "startPanelExpanded": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "attribute": "start-panel-expanded",
                "reflect": false,
                "defaultValue": "true"
            },
            "configOptions": {
                "type": "unknown",
                "mutable": true,
                "complexType": {
                    "original": "IConfigOptions",
                    "resolved": "IConfigOptions",
                    "references": {
                        "IConfigOptions": {
                            "location": "import",
                            "path": "@boldpenguin/sdk-types",
                            "id": "../sdk-types/dist/types.d.ts::IConfigOptions"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Web component config options injected from redux"
                }
            },
            "addressValidationStatus": {
                "type": "string",
                "mutable": true,
                "complexType": {
                    "original": "ValidationStatus",
                    "resolved": "ValidationStatus.COMPLETED | ValidationStatus.PROCEED_NEXT | ValidationStatus.READY_TO_VALIDATE | ValidationStatus.REQUIRED | ValidationStatus.VALIDATED | ValidationStatus.VALIDATION_ERROR",
                    "references": {
                        "ValidationStatus": {
                            "location": "import",
                            "path": "@boldpenguin/sdk-types",
                            "id": "../sdk-types/dist/types.d.ts::ValidationStatus"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Address validation status, injected from redux"
                },
                "attribute": "address-validation-status",
                "reflect": false
            }
        };
    }
    static get states() {
        return {
            "useExternal": {}
        };
    }
}
