'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-ceff47a0.js');
const index_esm_min$2 = require('./index.esm.min-1101deb1.js');
const index_esm_min$1 = require('./index.esm.min-2e158fd8.js');
const index_esm_min = require('./index.esm.min-f57d151c.js');
const reduxStore_service = require('./redux-store.service-10b7725a.js');
const vehicleVin_service = require('./vehicle-vin.service-621890f4.js');

const bpSdkQuestionGroupCss = ".bp-sdk-row{display:flex;flex-direction:row}.bp-sdk-column{display:flex;flex-direction:column}.bp-sdk-space-between{justify-content:space-between}";
const BpSdkQuestionGroupStyle0 = bpSdkQuestionGroupCss;

const BpSdkQuestionGroup = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.handleSubscriptions = () => {
            this.storeUnsubscribe && this.storeUnsubscribe();
            this.storeUnsubscribe = reduxStore_service.store.mapStateToProps(this, this.mapStateToProps);
        };
        this.mapStateToProps = (state) => {
            var _a, _b;
            return {
                questionPools: (_b = (_a = index_esm_min.Oe(state)) === null || _a === void 0 ? void 0 : _a.question_set) === null || _b === void 0 ? void 0 : _b.question_pools,
            };
        };
        this.answers = [];
        this.classes = '';
        this.label = undefined;
        this.labelId = index_esm_min$1.e$(8);
        this.questionGroup = undefined;
        this.type = undefined;
        this.questionPools = undefined;
        this.useExternal = false;
    }
    resetState() { }
    connectedCallback() {
        this.resetState();
        this.handleSubscriptions();
    }
    componentWillLoad() {
        this.useExternal = !!customElements.get('bp-sdk-external-question-group');
        customElements.whenDefined('bp-sdk-external-question-group').then(() => {
            this.useExternal = true;
        });
    }
    render() {
        return [this.useExternal && this.renderExternal(), !this.useExternal && this.renderInternal()];
    }
    renderUnknownGroupType(answer) {
        var _a;
        const nestedGroupToRender = (_a = this.questionGroup.nestedGroupsWithAnswers) === null || _a === void 0 ? void 0 : _a.get(answer.id);
        return [
            !nestedGroupToRender && (index.h("bp-sdk-dynamic-input-redux-container", { answer: answer, labelledBy: this.getLabelledBy(), id: `bp-sdk-question-group__${answer.question.id}`, class: "bp-sdk-question-group__question-set" })),
            nestedGroupToRender && index.h("bp-sdk-question-group-container", { questionGroup: nestedGroupToRender }),
        ];
    }
    renderExternal() {
        return (index.h("bp-sdk-external-question-group", { answers: this.answers, classes: this.classes, label: this.label, labelId: this.labelId, questionGroup: this.questionGroup, questionPools: this.questionPools, type: this.type }));
    }
    hideNestedGroup(group) {
        const shouldHide = [];
        group.forEach((child) => {
            var _a;
            const onlyAnchors = (_a = child.answers) === null || _a === void 0 ? void 0 : _a.every((a) => a.question.field_type === index_esm_min$2.t.Anchor);
            if (onlyAnchors && child.nestedGroupsWithAnswers.size > 0) {
                shouldHide.push(this.hideNestedGroup(child.nestedGroupsWithAnswers));
            }
            else {
                shouldHide.push(onlyAnchors || child.answers.length === 0);
            }
        });
        return shouldHide.every(Boolean);
    }
    shouldRenderLabel() {
        // Adding a check to avoid accordion and coverage groups double rendering labels
        // this can likely be expanded to other group types
        return (this.label &&
            this.type !== index_esm_min$2.F.Accordion &&
            this.type !== index_esm_min$2.F.Coverage &&
            this.type !== index_esm_min$2.F.AutoCollapsedAccordion);
    }
    hideQuestionGroup() {
        var _a, _b, _c;
        const onlyAnchors = (_b = (_a = this.questionGroup) === null || _a === void 0 ? void 0 : _a.answers) === null || _b === void 0 ? void 0 : _b.every((a) => a.question.field_type === index_esm_min$2.t.Anchor);
        if (onlyAnchors) {
            // If an anchor is a parent of a nested group.
            if (((_c = this.questionGroup.nestedGroupsWithAnswers) === null || _c === void 0 ? void 0 : _c.size) > 0) {
                return this.hideNestedGroup(this.questionGroup.nestedGroupsWithAnswers);
            }
            // If an anchor is part of a question pool, render it.
            return (this.questionGroup.answers.find((a) => { var _a; return !!((_a = this.questionPools) === null || _a === void 0 ? void 0 : _a.find((p) => p.parent_question_id === a.question.id)); }) === undefined);
        }
        return false;
    }
    getLabelledBy() {
        return this.shouldRenderLabel() ? this.labelId : '';
    }
    renderInternal() {
        if (this.hideQuestionGroup()) {
            return;
        }
        return [
            this.shouldRenderLabel() && index.h("bp-sdk-question-group-label", { labelId: this.labelId, label: this.label }),
            index.h("div", { class: this.classes }, this.renderContent()),
        ];
    }
    renderContent() {
        switch (this.type) {
            case index_esm_min$2.F.Address:
                return (index.h("bp-sdk-address-group-container", { questionGroup: this.questionGroup, label: this.label, labelledBy: this.getLabelledBy(), answers: this.answers }));
            case index_esm_min$2.F.AccumulatePercentage:
                return index.h("bp-sdk-accumulation-question-group-container", { label: this.label, labelledBy: this.getLabelledBy(), answers: this.answers });
            case index_esm_min$2.F.Vehicle:
                return index.h("bp-sdk-vehicle-question-pool-container", { questionGroup: this.questionGroup });
            case index_esm_min$2.F.Driver:
                return index.h("bp-sdk-driver-question-pool-container", { questionGroup: this.questionGroup });
            case index_esm_min$2.F.Stepper:
                return index.h("bp-sdk-stepper-group-container", { questionGroup: this.questionGroup });
            case index_esm_min$2.F.Accordion:
                return index.h("bp-sdk-accordion", { questionGroup: this.questionGroup, startPanelExpanded: true });
            case index_esm_min$2.F.Coverage:
                return index.h("bp-sdk-coverage-group", { questionGroup: this.questionGroup });
            case index_esm_min$2.F.AutoCollapsedAccordion:
                return index.h("bp-sdk-accordion", { questionGroup: this.questionGroup, startPanelExpanded: false });
            default:
                return this.answers.map((answer) => this.renderUnknownGroupType(answer));
        }
    }
};
BpSdkQuestionGroup.style = BpSdkQuestionGroupStyle0;

const bpSdkQuestionGroupContainerCss = "";
const BpSdkQuestionGroupContainerStyle0 = bpSdkQuestionGroupContainerCss;

const BpSdkQuestionGroupContainer = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.questionGroup = undefined;
        this.classes = 'bp-sdk-question-group-content';
        this.labelId = index_esm_min$1.e$(8);
        this.type = undefined;
        this.useExternal = false;
    }
    onQuestionGroupChange(questionGroup) {
        if (this.type !== (questionGroup === null || questionGroup === void 0 ? void 0 : questionGroup.group_type)) {
            this.type = questionGroup === null || questionGroup === void 0 ? void 0 : questionGroup.group_type;
        }
    }
    onTypeChange(type) {
        this.updateClasses(type);
    }
    resetState() {
        var _a;
        this.type = (_a = this.questionGroup) === null || _a === void 0 ? void 0 : _a.group_type;
    }
    connectedCallback() {
        this.resetState();
    }
    componentWillLoad() {
        var _a;
        this.useExternal = !!customElements.get('bp-sdk-external-question-group-container');
        customElements.whenDefined('bp-sdk-external-question-group-container').then(() => {
            this.useExternal = true;
        });
        this.type = (_a = this.questionGroup) === null || _a === void 0 ? void 0 : _a.group_type;
    }
    render() {
        return [this.useExternal && this.renderExternal(), !this.useExternal && this.renderInternal()];
    }
    renderExternal() {
        return index.h("bp-sdk-external-question-group-container", { questionGroup: this.questionGroup });
    }
    renderInternal() {
        var _a, _b, _c;
        return (index.h("bp-sdk-question-group", { answers: (_a = this.questionGroup) === null || _a === void 0 ? void 0 : _a.answers, classes: this.classes, label: (_b = this.questionGroup) === null || _b === void 0 ? void 0 : _b.label, labelId: this.labelId, questionGroup: this.questionGroup, type: (_c = this.questionGroup) === null || _c === void 0 ? void 0 : _c.group_type }));
    }
    updateClasses(type) {
        if (!type) {
            this.classes = 'bp-sdk-question-group-content';
            return;
        }
        this.classes = index_esm_min$1.zh('bp-sdk-question-group-content', {
            'bp-sdk-row': type === 'split_horizontal',
            'bp-sdk-column': type !== 'split_horizontal',
            'bp-sdk-space-between': type === 'split_horizontal',
        });
    }
    static get watchers() { return {
        "questionGroup": ["onQuestionGroupChange"],
        "type": ["onTypeChange"]
    }; }
};
BpSdkQuestionGroupContainer.style = BpSdkQuestionGroupContainerStyle0;

const bpSdkVehicleDeleteButtonCss = ".bp-sdk-vehicle-delete-button{appearance:none;font-weight:bold;cursor:pointer;height:100%;width:3rem}";
const BpSdkVehicleDeleteButtonStyle0 = bpSdkVehicleDeleteButtonCss;

const BpSdkVehicleDeleteButton = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.useExternal = false;
    }
    resetState() { }
    connectedCallback() {
        this.resetState();
    }
    componentWillLoad() {
        this.useExternal = !!customElements.get('bp-sdk-external-vehicle-delete-button');
        customElements.whenDefined('bp-sdk-external-vehicle-delete-button').then(() => {
            this.useExternal = true;
        });
    }
    render() {
        return [this.useExternal && this.renderExternal(), !this.useExternal && this.renderInternal()];
    }
    renderExternal() {
        return index.h("bp-sdk-external-vehicle-delete-button", null);
    }
    renderInternal() {
        return (index.h("button", { type: "button", class: "bp-sdk-vehicle-delete-button" }, index.h("bp-sdk-model-container", { name: "trashcan" }, "Delete")));
    }
};
BpSdkVehicleDeleteButton.style = BpSdkVehicleDeleteButtonStyle0;

const bpSdkVehicleEditButtonCss = ".bp-sdk-vehicle-edit-button{appearance:none;font-weight:bold;cursor:pointer;height:100%;width:3rem}";
const BpSdkVehicleEditButtonStyle0 = bpSdkVehicleEditButtonCss;

const BpSdkVehicleEditButton = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.useExternal = false;
    }
    resetState() { }
    connectedCallback() {
        this.resetState();
    }
    componentWillLoad() {
        this.useExternal = !!customElements.get('bp-sdk-external-vehicle-edit-button');
        customElements.whenDefined('bp-sdk-external-vehicle-edit-button').then(() => {
            this.useExternal = true;
        });
    }
    render() {
        return [this.useExternal && this.renderExternal(), !this.useExternal && this.renderInternal()];
    }
    renderExternal() {
        return index.h("bp-sdk-external-vehicle-edit-button", null);
    }
    renderInternal() {
        return (index.h("button", { type: "button", class: "bp-sdk-vehicle-edit-button" }, "Edit"));
    }
};
BpSdkVehicleEditButton.style = BpSdkVehicleEditButtonStyle0;

const bpSdkVehicleGroupCss = "";
const BpSdkVehicleGroupStyle0 = bpSdkVehicleGroupCss;

const BpSdkVehicleGroup = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.saveVehicle = index.createEvent(this, "saveVehicle", 7);
        this.saveButtonClick = () => {
            switch (this.selectedCAFlow) {
                case index_esm_min$2.D.ymm:
                    this.saveVehicle.emit(index_esm_min$2.D.ymm);
                    break;
                case index_esm_min$2.D.vin:
                    this.saveVehicle.emit(index_esm_min$2.D.vin);
                    break;
                case 'trailer':
                    this.saveVehicle.emit(index_esm_min$2.D.trailers);
                    break;
            }
        };
        this.canSave = true;
        this.questionGroup = undefined;
        this.isVehicleTrailer = false;
        this.shouldShowTrailers = true;
        this.handleDelete = undefined;
        this.useExternal = false;
        this.flowAnswer = undefined;
        this.selectedCAFlow = 'none';
    }
    onQuestionSetChange(questionGroup) {
        this.flowAnswer = index_esm_min$1.ii(questionGroup);
        this.selectedCAFlow = this.getSelectedVehicleInput();
    }
    resetState() {
        this.flowAnswer = index_esm_min$1.ii(this.questionGroup);
    }
    connectedCallback() {
        this.resetState();
    }
    componentWillLoad() {
        this.useExternal = !!customElements.get('bp-sdk-external-vehicle-group');
        customElements.whenDefined('bp-sdk-external-vehicle-group').then(() => {
            this.useExternal = true;
        });
        this.onQuestionSetChange(this.questionGroup);
    }
    render() {
        return [this.useExternal && this.renderExternal(), !this.useExternal && this.renderInternal()];
    }
    renderVehicleQuestions() {
        switch (this.selectedCAFlow) {
            case 'ymm':
                return index.h("bp-sdk-vehicle-interface", { questionGroup: this.questionGroup, canSave: this.canSave });
            case 'vin':
                return index.h("bp-sdk-vehicle-vin-container", { questionGroupId: index_esm_min$1.g1(this.questionGroup) });
            case 'trailer':
                return this.shouldShowTrailers ? (index.h("bp-sdk-vehicle-interface", { questionGroup: this.questionGroup, isVehicleTrailer: true, canSave: this.canSave })) : ('');
            default:
                return '';
        }
    }
    renderExternal() {
        return (index.h("bp-sdk-external-vehicle-group", { canSave: this.canSave, isVehicleTrailer: this.isVehicleTrailer, questionGroup: this.questionGroup, shouldShowTrailers: this.shouldShowTrailers, handleDelete: this.handleDelete }));
    }
    renderInternal() {
        return (index.h("div", { class: "bp-sdk-vehicle-group__container" }, index.h("h2", null, "Vehicle Information"), index.h("bp-sdk-dynamic-input-redux-container", { answer: this.flowAnswer, label: "Choose how to add your vehicle" }), this.renderVehicleQuestions(), index.h("div", { class: "bp-sdk-row" }, index.h("bp-sdk-vehicle-delete-button", { onClick: this.handleDelete }), index.h("bp-sdk-vehicle-save-button", { buttonDisabled: !this.canSave, onClick: this.saveButtonClick, text: "Save Vehicle" }))));
    }
    getSelectedVehicleInput() {
        var _a;
        if (!this.flowAnswer) {
            return 'none';
        }
        const selectedCAFlow = this.flowAnswer.choice_id;
        const aliasOfSelectedChoice = (_a = this.flowAnswer.question.choices.find((choice) => choice.id === selectedCAFlow)) === null || _a === void 0 ? void 0 : _a.value;
        switch (aliasOfSelectedChoice) {
            case 'Year / Make / Model':
                return 'ymm';
            case 'VIN':
                return 'vin';
            case 'Trailer':
                return 'trailer';
            default:
                return 'none';
        }
    }
    static get watchers() { return {
        "questionGroup": ["onQuestionSetChange"]
    }; }
};
BpSdkVehicleGroup.style = BpSdkVehicleGroupStyle0;

const bpSdkVehicleInterfaceCss = "";
const BpSdkVehicleInterfaceStyle0 = bpSdkVehicleInterfaceCss;

const vehicleQuestionCodes = {
    year: 'mqs_vehicle_year',
    make: 'mqs_vehicle_make',
    model: 'mqs_vehicle_model',
    configuration: 'mqs_vehicle_submodel',
};
const BpSdkVehicleInterface = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.saveVehicle = index.createEvent(this, "saveVehicle", 7);
        this.questionGroup = undefined;
        this.canSave = true;
        this.isVehicleTrailer = false;
        this.useExternal = false;
        this.answerIdMap = {
            year: '',
            make: '',
            model: '',
            configuration: '',
        };
    }
    onQuestionGroupChange() {
        this.answerIdMap = this.buildAnswerIdMap();
    }
    resetState() {
        this.answerIdMap = {
            year: '',
            make: '',
            model: '',
            configuration: '',
        };
    }
    connectedCallback() {
        this.resetState();
    }
    componentWillLoad() {
        this.useExternal = !!customElements.get('bp-sdk-external-vehicle-interface');
        customElements.whenDefined('bp-sdk-external-vehicle-interface').then(() => {
            this.useExternal = true;
        });
        this.answerIdMap = this.buildAnswerIdMap();
    }
    render() {
        return [this.useExternal && this.renderExternal(), !this.useExternal && this.renderInternal()];
    }
    renderExternal() {
        return index.h("bp-sdk-external-vehicle-interface", { isVehicleTrailer: this.isVehicleTrailer, questionGroup: this.questionGroup });
    }
    renderInternal() {
        return (index.h("div", { class: "bp-sdk-vehicle-interface__container" }, index.h("bp-sdk-vehicle-years-container", { isVehicleTrailer: this.isVehicleTrailer, questionGroupId: index_esm_min$1.g1(this.questionGroup), code: vehicleQuestionCodes.year, answerId: this.answerIdMap.year, answeredBySource: this.answeredBySource(this.answerIdMap.year) }), index.h("bp-sdk-vehicle-makes-container", { isVehicleTrailer: this.isVehicleTrailer, questionGroupId: index_esm_min$1.g1(this.questionGroup), code: vehicleQuestionCodes.make, answerId: this.answerIdMap.make, answeredBySource: this.answeredBySource(this.answerIdMap.make) }), index.h("bp-sdk-vehicle-models-container", { isVehicleTrailer: this.isVehicleTrailer, questionGroupId: index_esm_min$1.g1(this.questionGroup), code: vehicleQuestionCodes.model, answerId: this.answerIdMap.model, answeredBySource: this.answeredBySource(this.answerIdMap.model) }), index.h("bp-sdk-vehicle-configurations-container", { questionGroupId: index_esm_min$1.g1(this.questionGroup), code: vehicleQuestionCodes.configuration, answerId: this.answerIdMap.configuration, answeredBySource: this.answeredBySource(this.answerIdMap.configuration) })));
    }
    buildAnswerIdMap() {
        var _a, _b, _c, _d, _e, _f;
        const answers = (_b = (_a = this.questionGroup) === null || _a === void 0 ? void 0 : _a.answers) !== null && _b !== void 0 ? _b : [];
        const yearAnswer = answers.find((answer) => answer.question.code === vehicleQuestionCodes.year);
        const makeAnswer = answers.find((answer) => answer.question.code === vehicleQuestionCodes.make);
        const modelAnswer = answers.find((answer) => answer.question.code === vehicleQuestionCodes.model);
        const configurationAnswer = answers.find((answer) => answer.question.code === vehicleQuestionCodes.configuration);
        return {
            year: (_c = yearAnswer === null || yearAnswer === void 0 ? void 0 : yearAnswer.id) !== null && _c !== void 0 ? _c : '',
            make: (_d = makeAnswer === null || makeAnswer === void 0 ? void 0 : makeAnswer.id) !== null && _d !== void 0 ? _d : '',
            model: (_e = modelAnswer === null || modelAnswer === void 0 ? void 0 : modelAnswer.id) !== null && _e !== void 0 ? _e : '',
            configuration: (_f = configurationAnswer === null || configurationAnswer === void 0 ? void 0 : configurationAnswer.id) !== null && _f !== void 0 ? _f : '',
        };
    }
    answeredBySource(answerId) {
        var _a, _b;
        const answers = (_b = (_a = this.questionGroup) === null || _a === void 0 ? void 0 : _a.answers) !== null && _b !== void 0 ? _b : [];
        const answerForId = answers.find((answer) => answer.id === answerId);
        if (answerForId === null || answerForId === void 0 ? void 0 : answerForId.answered_by_consumer) {
            return 'Consumer';
        }
        return answerForId === null || answerForId === void 0 ? void 0 : answerForId.answered_by_source;
    }
    static get watchers() { return {
        "questionGroup": ["onQuestionGroupChange"]
    }; }
};
BpSdkVehicleInterface.style = BpSdkVehicleInterfaceStyle0;

const bpSdkVehicleMakesCss = "";
const BpSdkVehicleMakesStyle0 = bpSdkVehicleMakesCss;

const BpSdkVehicleMakes = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.answerId = undefined;
        this.code = undefined;
        this.label = undefined;
        this.pristine = true;
        this.touched = false;
        this.errors = [];
        this.makes = [];
        this.selectedMakeId = undefined;
        this.isVehicleTrailer = false;
        this.answeredBySource = '';
        this.useExternal = false;
        this.fieldType = 'dropdown';
        this.inputComponentType = 'dropdown';
    }
    onIsVehicleTrailerChange(isTrailer) {
        this.fieldType = isTrailer ? 'vehicle' : 'dropdown';
        this.inputComponentType = isTrailer ? 'vehicle' : 'dropdown';
    }
    resetState() { }
    connectedCallback() {
        this.resetState();
    }
    componentWillLoad() {
        this.useExternal = !!customElements.get('bp-sdk-external-vehicle-makes');
        customElements.whenDefined('bp-sdk-external-vehicle-makes').then(() => {
            this.useExternal = true;
        });
        this.onIsVehicleTrailerChange(this.isVehicleTrailer);
    }
    render() {
        return [this.useExternal && this.renderExternal(), !this.useExternal && this.renderInternal()];
    }
    renderExternal() {
        return (index.h("bp-sdk-external-vehicle-makes", { answerId: this.answerId, code: this.code, errors: this.errors, isVehicleTrailer: this.isVehicleTrailer, label: this.label, makes: this.makes, pristine: this.pristine, selectedMakeId: this.selectedMakeId, touched: this.touched }));
    }
    renderInternal() {
        return (index.h("bp-sdk-dynamic-input", { answerId: this.answerId, choiceId: this.selectedMakeId, choices: this.makes, code: this.code, errors: this.errors, fieldType: this.fieldType, inputComponentType: this.inputComponentType, isAutocomplete: this.isVehicleTrailer, isLabelledField: true, isRequired: true, label: this.label, pristine: this.pristine, referenceType: "makes", touched: this.touched, answeredBySource: this.answeredBySource }));
    }
    static get watchers() { return {
        "isVehicleTrailer": ["onIsVehicleTrailerChange"]
    }; }
};
BpSdkVehicleMakes.style = BpSdkVehicleMakesStyle0;

const bpSdkVehicleMakesContainerCss = "";
const BpSdkVehicleMakesContainerStyle0 = bpSdkVehicleMakesContainerCss;

const BpSdkVehicleMakesContainer = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.ymmcUpdate = index.createEvent(this, "ymmcUpdate", 7);
        this.handleSubscriptions = () => {
            this.storeUnsubscribe && this.storeUnsubscribe();
            this.storeUnsubscribe = reduxStore_service.store.mapStateToProps(this, this.mapStateToProps);
        };
        this.mapStateToProps = (state) => {
            return {
                makeOptions: index_esm_min.Qp(state, this.questionGroupId),
                selectedVehicle: index_esm_min.Gp(state, this.questionGroupId),
            };
        };
        this.onFocusOut = () => {
            this.touched = true;
            this.updateErrors(this.pristine, true, this.value);
        };
        this.answerId = undefined;
        this.code = undefined;
        this.makeOptions = {};
        this.selectedVehicle = {};
        this.questionGroupId = undefined;
        this.isVehicleTrailer = false;
        this.answeredBySource = '';
        this.choices = [];
        this.filter = undefined;
        this.filteredChoices = [];
        this.useExternal = false;
        this.touched = false;
        this.pristine = true;
        this.value = undefined;
        this.errors = [];
    }
    resetState() {
        this.touched = false;
        this.pristine = true;
        this.value = undefined;
        this.errors = [];
    }
    connectedCallback() {
        this.resetState();
        this.handleSubscriptions();
    }
    componentWillLoad() {
        this.useExternal = !!customElements.get('bp-sdk-external-vehicle-makes-container');
        customElements.whenDefined('bp-sdk-external-vehicle-makes-container').then(() => {
            this.useExternal = true;
        });
        this.onQuestionGroupIdChange();
    }
    onQuestionGroupIdChange() {
        this.handleSubscriptions();
    }
    onMakesChange(makes) {
        if (makes) {
            this.choices = this.convertMakesToChoices(makes);
            this.updateValue(makes, this.selectedVehicle);
        }
        else {
            this.updateValue(undefined, undefined);
        }
    }
    onVehicleSelectionChange(selection) {
        if (!(selection === null || selection === void 0 ? void 0 : selection.makeId)) {
            this.touched = false;
            this.pristine = true;
        }
        this.updateValue(this.makeOptions, selection);
    }
    updateValue(makes, selection) {
        this.value = !!(makes && (selection === null || selection === void 0 ? void 0 : selection.makeId)) ? makes[selection.makeId] : undefined;
    }
    onUseExternalChange(useExternal) {
        if (!useExternal) {
            this.unloadFocusEvents();
        }
    }
    loadFocusEvents() {
        if (!this.useExternal) {
            this.el.addEventListener('focusout', this.onFocusOut);
        }
    }
    unloadFocusEvents() {
        this.el.removeEventListener('focusout', this.onFocusOut);
    }
    componentDidLoad() {
        this.loadFocusEvents();
    }
    disconnectedCallback() {
        this.unloadFocusEvents();
        this.storeUnsubscribe && this.storeUnsubscribe();
    }
    onFilterUpdate({ detail }) {
        var _a;
        this.filter = (_a = detail === null || detail === void 0 ? void 0 : detail.value) !== null && _a !== void 0 ? _a : '';
    }
    onFilterChange(filter) {
        this.updateChoices(this.choices, filter);
    }
    onChoicesChange(choices) {
        this.updateChoices(choices, this.filter);
    }
    updateChoices(choices, filter = '') {
        const regex = new RegExp(`.*${filter}.*`, 'gi');
        this.filteredChoices = choices.filter((choice) => !!choice.value.match(regex));
    }
    onValueUpdate(evt) {
        var _a, _b;
        if (this.useExternal) {
            return;
        }
        this.pristine = false;
        const value = ((_a = evt.detail) !== null && _a !== void 0 ? _a : [])[0];
        if (index_esm_min$1.j(value, this.value) && (this.errors.length === 0 || !!value)) {
            this.value = value;
            this.ymmcUpdate.emit({
                value,
                type: index_esm_min$2.k.Make,
                displayValue: (_b = this.makeOptions[value]) !== null && _b !== void 0 ? _b : value,
                freeform: this.makeOptions[value] == null,
            });
        }
    }
    onValueChange(value) {
        this.updateErrors(false, this.touched, value);
    }
    updateErrors(pristine, touched, value) {
        this.errors = index_esm_min$1.$w(pristine, touched, value) ? ['required'] : [];
    }
    onMakeDirty() {
        this.touched = true;
        this.pristine = false;
        this.updateErrors(false, this.touched, this.value);
    }
    render() {
        return [this.useExternal && this.renderExternal(), !this.useExternal && this.renderInternal()];
    }
    renderExternal() {
        return (index.h("bp-sdk-external-vehicle-makes-container", { answerId: this.answerId, code: this.code, isVehicleTrailer: this.isVehicleTrailer, makeOptions: this.makeOptions, questionGroupId: this.questionGroupId, selectedVehicle: this.selectedVehicle }));
    }
    convertMakesToChoices(makes) {
        const choices = [];
        for (const makeId of Object.keys(makes)) {
            choices.push({ id: makeId, value: makes[makeId] });
        }
        choices.sort((a, b) => a.value.localeCompare(b.value));
        return choices;
    }
    renderInternal() {
        var _a;
        return (this.choices.length > 0 && (index.h("bp-sdk-vehicle-makes", { answerId: this.answerId, code: this.code, errors: this.errors, isVehicleTrailer: this.isVehicleTrailer, label: "Enter vehicle make", makes: this.filteredChoices, pristine: this.pristine, selectedMakeId: (_a = this.selectedVehicle) === null || _a === void 0 ? void 0 : _a.makeId, touched: this.touched, answeredBySource: this.answeredBySource })));
    }
    get el() { return index.getElement(this); }
    static get watchers() { return {
        "questionGroupId": ["onQuestionGroupIdChange"],
        "makeOptions": ["onMakesChange"],
        "selectedVehicle": ["onVehicleSelectionChange"],
        "useExternal": ["onUseExternalChange"],
        "filter": ["onFilterChange"],
        "choices": ["onChoicesChange"],
        "value": ["onValueChange"]
    }; }
};
BpSdkVehicleMakesContainer.style = BpSdkVehicleMakesContainerStyle0;

const bpSdkVehicleModelsCss = "";
const BpSdkVehicleModelsStyle0 = bpSdkVehicleModelsCss;

const BpSdkVehicleModels = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.answerId = undefined;
        this.code = undefined;
        this.label = undefined;
        this.pristine = true;
        this.touched = false;
        this.errors = [];
        this.models = [];
        this.selectedModelId = undefined;
        this.isVehicleTrailer = false;
        this.answeredBySource = '';
        this.useExternal = false;
        this.fieldType = 'dropdown';
        this.inputComponentType = 'dropdown';
    }
    onIsVehicleTrailerChange(isTrailer) {
        this.fieldType = isTrailer ? 'vehicle' : 'dropdown';
        this.inputComponentType = isTrailer ? 'vehicle' : 'dropdown';
    }
    resetState() { }
    connectedCallback() {
        this.resetState();
    }
    componentWillLoad() {
        this.useExternal = !!customElements.get('bp-sdk-external-vehicle-models');
        customElements.whenDefined('bp-sdk-external-vehicle-models').then(() => {
            this.useExternal = true;
        });
        this.onIsVehicleTrailerChange(this.isVehicleTrailer);
    }
    render() {
        return [this.useExternal && this.renderExternal(), !this.useExternal && this.renderInternal()];
    }
    renderExternal() {
        return (index.h("bp-sdk-external-vehicle-models", { answerId: this.answerId, code: this.code, errors: this.errors, isVehicleTrailer: this.isVehicleTrailer, label: this.label, models: this.models, pristine: this.pristine, selectedModelId: this.selectedModelId, touched: this.touched }));
    }
    renderInternal() {
        return (index.h("bp-sdk-dynamic-input", { answerId: this.answerId, choiceId: this.selectedModelId, choices: this.models, code: this.code, errors: this.errors, fieldType: this.fieldType, inputComponentType: this.inputComponentType, isAutocomplete: this.isVehicleTrailer, isLabelledField: true, isRequired: true, label: this.label, pristine: this.pristine, referenceType: "models", touched: this.touched, answeredBySource: this.answeredBySource }));
    }
    static get watchers() { return {
        "isVehicleTrailer": ["onIsVehicleTrailerChange"]
    }; }
};
BpSdkVehicleModels.style = BpSdkVehicleModelsStyle0;

const bpSdkVehicleModelsContainerCss = "";
const BpSdkVehicleModelsContainerStyle0 = bpSdkVehicleModelsContainerCss;

const BpSdkVehicleModelsContainer = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.ymmcUpdate = index.createEvent(this, "ymmcUpdate", 7);
        this.handleSubscriptions = () => {
            this.storeUnsubscribe && this.storeUnsubscribe();
            this.storeUnsubscribe = reduxStore_service.store.mapStateToProps(this, this.mapStateToProps);
        };
        this.mapStateToProps = (state) => {
            return {
                modelOptions: index_esm_min.Up(state, this.questionGroupId),
                selectedVehicle: index_esm_min.Gp(state, this.questionGroupId),
            };
        };
        this.onFocusOut = () => {
            this.touched = true;
            this.updateErrors(this.pristine, true, this.value);
        };
        this.answerId = undefined;
        this.code = undefined;
        this.modelOptions = {};
        this.selectedVehicle = {};
        this.questionGroupId = undefined;
        this.isVehicleTrailer = false;
        this.answeredBySource = '';
        this.choices = [];
        this.useExternal = false;
        this.filter = undefined;
        this.filteredChoices = [];
        this.touched = false;
        this.pristine = true;
        this.value = undefined;
        this.errors = [];
    }
    resetState() {
        this.touched = false;
        this.pristine = true;
        this.value = undefined;
        this.errors = [];
    }
    connectedCallback() {
        this.resetState();
        this.handleSubscriptions();
    }
    componentWillLoad() {
        this.useExternal = !!customElements.get('bp-sdk-external-vehicle-models-container');
        customElements.whenDefined('bp-sdk-external-vehicle-models-container').then(() => {
            this.useExternal = true;
        });
        this.handleSubscriptions();
        this.onQuestionGroupIdChange();
    }
    onQuestionGroupIdChange() {
        this.handleSubscriptions();
    }
    onModelsChange(models) {
        this.choices = this.convertModelsToChoices(models);
        this.updateValue(models, this.selectedVehicle);
    }
    onSelectionChange(selection) {
        if (!(selection === null || selection === void 0 ? void 0 : selection.modelId)) {
            this.touched = false;
            this.pristine = true;
        }
        this.updateValue(this.modelOptions, selection);
    }
    onFilterUpdate({ detail }) {
        var _a;
        this.filter = (_a = detail === null || detail === void 0 ? void 0 : detail.value) !== null && _a !== void 0 ? _a : '';
    }
    onFilterChange(filter) {
        this.updateChoices(this.choices, filter);
    }
    onChoicesChange(choices) {
        this.updateChoices(choices, this.filter);
    }
    updateChoices(choices, filter = '') {
        const regex = new RegExp(`.*${filter}.*`, 'gi');
        this.filteredChoices = choices.filter((choice) => !!choice.value.match(regex));
    }
    updateValue(models, selection) {
        const newValue = !!(models && (selection === null || selection === void 0 ? void 0 : selection.modelId)) ? models[selection.modelId] : undefined;
        this.value = newValue;
    }
    componentDidLoad() {
        this.loadFocusEvents();
    }
    disconnectedCallback() {
        this.unloadFocusEvents();
        this.storeUnsubscribe && this.storeUnsubscribe();
    }
    onUseExternalChange(useExternal) {
        if (!useExternal) {
            this.unloadFocusEvents();
        }
    }
    loadFocusEvents() {
        if (!this.useExternal) {
            this.el.addEventListener('focusout', this.onFocusOut);
        }
    }
    unloadFocusEvents() {
        this.el.removeEventListener('focusout', this.onFocusOut);
    }
    onValueUpdate(evt) {
        var _a;
        if (this.useExternal) {
            return;
        }
        this.pristine = false;
        const value = ((_a = evt.detail) !== null && _a !== void 0 ? _a : [])[0];
        if (index_esm_min$1.j(value, this.value) && (this.errors.length === 0 || !!value)) {
            this.value = value;
            this.ymmcUpdate.emit({ type: index_esm_min$2.k.Model, value, freeform: this.modelOptions[value] == null });
        }
    }
    onValueChange(value) {
        this.updateErrors(false, this.touched, value);
    }
    updateErrors(pristine, touched, value) {
        this.errors = index_esm_min$1.$w(pristine, touched, value) ? ['required'] : [];
    }
    onMakeDirty() {
        this.touched = true;
        this.pristine = false;
        this.updateErrors(false, this.touched, this.value);
    }
    render() {
        return [this.useExternal && this.renderExternal(), !this.useExternal && this.renderInternal()];
    }
    renderExternal() {
        return (index.h("bp-sdk-external-vehicle-models-container", { answerId: this.answerId, code: this.code, isVehicleTrailer: this.isVehicleTrailer, modelOptions: this.modelOptions, questionGroupId: this.questionGroupId, selectedVehicle: this.selectedVehicle }));
    }
    convertModelsToChoices(models = {}) {
        const choices = [];
        for (const modelId of Object.keys(models)) {
            choices.push({ id: modelId, value: models[modelId] });
        }
        choices.sort((a, b) => a.value.localeCompare(b.value));
        return choices;
    }
    renderInternal() {
        var _a, _b;
        return ((((_a = this.selectedVehicle) === null || _a === void 0 ? void 0 : _a.makeId) || this.choices.length > 0) && (index.h("bp-sdk-vehicle-models", { answerId: this.answerId, code: this.code, errors: this.errors, isVehicleTrailer: this.isVehicleTrailer, label: "Enter vehicle model", models: this.filteredChoices, pristine: this.pristine, selectedModelId: (_b = this.selectedVehicle) === null || _b === void 0 ? void 0 : _b.modelId, touched: this.touched, answeredBySource: this.answeredBySource })));
    }
    get el() { return index.getElement(this); }
    static get watchers() { return {
        "questionGroupId": ["onQuestionGroupIdChange"],
        "modelOptions": ["onModelsChange"],
        "selectedVehicle": ["onSelectionChange"],
        "filter": ["onFilterChange"],
        "choices": ["onChoicesChange"],
        "useExternal": ["onUseExternalChange"],
        "value": ["onValueChange"]
    }; }
};
BpSdkVehicleModelsContainer.style = BpSdkVehicleModelsContainerStyle0;

const bpSdkVehiclePanelCss = "";
const BpSdkVehiclePanelStyle0 = bpSdkVehiclePanelCss;

const BpSdkVehiclePanel = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.onClick = () => {
            if (this.isExpanded) {
                this.handleClose();
            }
            else {
                this.handleOpen();
            }
        };
        this.code = undefined;
        this.answers = [];
        this.questionGroup = undefined;
        this.canEdit = false;
        this.isEditing = false;
        this.isExpanded = true;
        this.canDelete = false;
        this.canSave = true;
        this.handleClose = undefined;
        this.handleOpen = undefined;
        this.handleDelete = undefined;
        this.handleEdit = undefined;
        this.isValid = true;
        this.vehicleInformation = { year: '', make: '', model: '', configuration: '' };
        this.vehicleLabel = 'Add new vehicle';
        this.shouldShowTrailers = false;
        this.isVehicleTrailer = false;
        this.useExternal = false;
        this.icon = '';
        this.labelledBy = undefined;
        this.ids = {
            year: index_esm_min$1.e$(8),
            make: index_esm_min$1.e$(8),
            model: index_esm_min$1.e$(8),
            slot: index_esm_min$1.e$(8),
        };
    }
    onIsValidChange(isValid) {
        this.icon = isValid ? 'check_circle' : 'error_outline';
    }
    resetState() { }
    connectedCallback() {
        this.resetState();
    }
    componentWillLoad() {
        this.useExternal = !!customElements.get('bp-sdk-external-vehicle-panel');
        customElements.whenDefined('bp-sdk-external-vehicle-panel').then(() => {
            this.useExternal = true;
        });
    }
    onVehicleInformationChange(vehicleInformation) {
        this.labelledBy = index_esm_min$1.zh('', {
            [this.ids.year]: !!vehicleInformation.year,
            [this.ids.make]: !!vehicleInformation.make,
            [this.ids.model]: !!vehicleInformation.model,
        });
    }
    render() {
        return [this.useExternal && this.renderExternal(), !this.useExternal && this.renderInternal()];
    }
    renderExternal() {
        return (index.h("bp-sdk-external-vehicle-panel", { answers: this.answers, canDelete: this.canDelete, canEdit: this.canEdit, canSave: this.canSave, code: this.code, handleClose: this.handleClose, handleDelete: this.handleDelete, handleEdit: this.handleEdit, handleOpen: this.handleOpen, isEditing: this.isEditing, isExpanded: this.isExpanded, isValid: this.isValid, isVehicleTrailer: this.isVehicleTrailer, questionGroup: this.questionGroup, shouldShowTrailers: this.shouldShowTrailers, vehicleInformation: this.vehicleInformation, vehicleLabel: this.vehicleLabel }));
    }
    renderContent() {
        return (index.h("div", { class: "bp-sdk-vehicle-panel__content", slot: `${this.ids.slot}-content` }, this.isValid && (index.h("bp-sdk-vehicle-panel-content", { additionalAnswers: this.answers, questionGroup: this.questionGroup, labelledBy: this.labelledBy }))));
    }
    renderInternal() {
        return (index.h("div", { class: "bp-sdk-vehicle-panel__container" }, this.isEditing && [
            index.h("bp-sdk-vehicle-group", { canSave: this.canSave, questionGroup: this.questionGroup, shouldShowTrailers: this.shouldShowTrailers, isVehicleTrailer: this.isVehicleTrailer, handleDelete: this.handleDelete }),
            this.renderContent(),
        ], !this.isEditing && [
            index.h("bp-sdk-icon-container", { name: this.icon }),
            index.h("bp-sdk-vehicle-panel-label", { class: "bp-sdk-vehicle-panel__label", vehicleLabel: this.vehicleLabel, onClick: this.onClick }),
            index.h("bp-sdk-vehicle-panel-buttons", { class: "bp-sdk-vehicle-panel__buttons", canDelete: this.canDelete, canEdit: this.canEdit, handleDelete: this.handleDelete, handleEdit: this.handleEdit }),
            this.renderContent(),
        ]));
    }
    static get watchers() { return {
        "isValid": ["onIsValidChange"],
        "vehicleInformation": ["onVehicleInformationChange"]
    }; }
};
BpSdkVehiclePanel.style = BpSdkVehiclePanelStyle0;

const bpSdkVehiclePanelButtonsCss = "";
const BpSdkVehiclePanelButtonsStyle0 = bpSdkVehiclePanelButtonsCss;

const BpSdkVehiclePanelButtons = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.canDelete = false;
        this.canEdit = false;
        this.handleDelete = undefined;
        this.handleEdit = undefined;
        this.useExternal = false;
    }
    resetState() { }
    connectedCallback() {
        this.resetState();
    }
    componentWillLoad() {
        this.useExternal = !!customElements.get('bp-sdk-external-vehicle-panel-buttons');
        customElements.whenDefined('bp-sdk-external-vehicle-panel-buttons').then(() => {
            this.useExternal = true;
        });
    }
    render() {
        return [this.useExternal && this.renderExternal(), !this.useExternal && this.renderInternal()];
    }
    renderExternal() {
        return (index.h("bp-sdk-external-vehicle-panel-buttons", { canDelete: this.canDelete, canEdit: this.canEdit, handleDelete: this.handleDelete, handleEdit: this.handleEdit }));
    }
    renderInternal() {
        return (index.h("div", { class: "bp-sdk-vehicle-panel-buttons__container" }, this.canEdit && [
            this.canDelete && index.h("bp-sdk-vehicle-delete-button", { onClick: this.handleDelete }),
            index.h("bp-sdk-vehicle-edit-button", { onClick: this.handleEdit }),
        ]));
    }
};
BpSdkVehiclePanelButtons.style = BpSdkVehiclePanelButtonsStyle0;

const bpSdkVehiclePanelContentCss = "";
const BpSdkVehiclePanelContentStyle0 = bpSdkVehiclePanelContentCss;

const BpSdkVehiclePanelContent = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.additionalAnswers = [];
        this.labelledBy = undefined;
        this.questionGroup = undefined;
        this.useExternal = false;
    }
    resetState() { }
    connectedCallback() {
        this.resetState();
    }
    componentWillLoad() {
        this.useExternal = !!customElements.get('bp-sdk-external-vehicle-panel-content');
        customElements.whenDefined('bp-sdk-external-vehicle-panel-content').then(() => {
            this.useExternal = true;
        });
    }
    shouldRenderQuestionGroup(questionGroupsWithAnswersAsKey, answer) {
        return questionGroupsWithAnswersAsKey.has(answer.id);
    }
    render() {
        return [this.useExternal && this.renderExternal(), !this.useExternal && this.renderInternal()];
    }
    renderExternal() {
        return (index.h("bp-sdk-external-vehicle-panel-content", { additionalAnswers: this.additionalAnswers, labelledBy: this.labelledBy, questionGroup: this.questionGroup }));
    }
    renderInternal() {
        return this.additionalAnswers.map((answer) => {
            return this.renderAnswer(answer);
        });
    }
    renderAnswer(answer) {
        var _a, _b;
        if (!answer) {
            return null;
        }
        const nestedGroupToRender = (_b = (_a = this.questionGroup) === null || _a === void 0 ? void 0 : _a.nestedGroupsWithAnswers) === null || _b === void 0 ? void 0 : _b.get(answer.id);
        return [
            !nestedGroupToRender && index.h("bp-sdk-dynamic-input-redux-container", { answer: answer }),
            nestedGroupToRender && index.h("bp-sdk-question-group-container", { questionGroup: nestedGroupToRender }),
        ];
    }
};
BpSdkVehiclePanelContent.style = BpSdkVehiclePanelContentStyle0;

const bpSdkVehiclePanelLabelCss = "";
const BpSdkVehiclePanelLabelStyle0 = bpSdkVehiclePanelLabelCss;

const BpSdkVehiclePanelLabel = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.vehicleLabel = 'Add new vehicle';
        this.useExternal = false;
    }
    resetState() { }
    connectedCallback() {
        this.resetState();
    }
    componentWillLoad() {
        this.useExternal = !!customElements.get('bp-sdk-external-vehicle-panel-label');
        customElements.whenDefined('bp-sdk-external-vehicle-panel-label').then(() => {
            this.useExternal = true;
        });
    }
    render() {
        return [this.useExternal && this.renderExternal(), !this.useExternal && this.renderInternal()];
    }
    renderExternal() {
        return index.h("bp-sdk-external-vehicle-panel-label", { vehicleLabel: this.vehicleLabel });
    }
    renderInternal() {
        return (index.h("div", { class: "bp-sdk-vehicle-panel-label__container" }, index.h("span", null, this.vehicleLabel)));
    }
};
BpSdkVehiclePanelLabel.style = BpSdkVehiclePanelLabelStyle0;

const bpSdkVehicleSaveButtonCss = "";
const BpSdkVehicleSaveButtonStyle0 = bpSdkVehicleSaveButtonCss;

const BpSdkVehicleSaveButton = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.text = '';
        this.buttonId = index_esm_min$1.e$(8);
        this.buttonDisabled = false;
        this.useExternal = false;
    }
    resetState() { }
    connectedCallback() {
        this.resetState();
    }
    componentWillLoad() {
        this.useExternal = !!customElements.get('bp-sdk-external-vehicle-save-button');
        customElements.whenDefined('bp-sdk-external-vehicle-save-button').then(() => {
            this.useExternal = true;
        });
    }
    render() {
        return [this.useExternal && this.renderExternal(), !this.useExternal && this.renderInternal()];
    }
    renderExternal() {
        return index.h("bp-sdk-external-vehicle-save-button", { text: this.text, buttonId: this.buttonId, buttonDisabled: this.buttonDisabled });
    }
    renderInternal() {
        return (index.h("bp-sdk-button", { class: "bp-sdk-vehicle-save-button__container", text: this.text, buttonId: this.buttonId, buttonDisabled: this.buttonDisabled }));
    }
};
BpSdkVehicleSaveButton.style = BpSdkVehicleSaveButtonStyle0;

const bpSdkVehicleVinCss = "";
const BpSdkVehicleVinStyle0 = bpSdkVehicleVinCss;

const VIN = {
    min: 17,
    max: 17,
    placeholder: 'VIN',
    type: 'vin',
};
const ConfigCode = 'mqs_vehicle_submodel';
const BpSdkVehicleVin = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.answerId = undefined;
        this.code = undefined;
        this.isSearching = false;
        this.shouldSelectConfiguration = false;
        this.touched = false;
        this.pristine = true;
        this.label = undefined;
        this.errors = [];
        this.errorText = undefined;
        this.canSave = true;
        this.canSearch = true;
        this.hasResult = false;
        this.questionGroupId = undefined;
        this.value = undefined;
        this.answeredBySource = '';
        this.useExternal = false;
        this.labelId = index_esm_min$1.e$(8);
    }
    resetState() { }
    connectedCallback() {
        this.resetState();
    }
    componentWillLoad() {
        this.useExternal = !!customElements.get('bp-sdk-external-vehicle-vin');
        customElements.whenDefined('bp-sdk-external-vehicle-vin').then(() => {
            this.useExternal = true;
        });
    }
    render() {
        return [this.useExternal && this.renderExternal(), !this.useExternal && this.renderInternal()];
    }
    renderExternal() {
        return (index.h("bp-sdk-external-vehicle-vin", { answerId: this.answerId, canSave: this.canSave, canSearch: this.canSearch, code: this.code, errors: this.errors, errorText: this.errorText, hasResult: this.hasResult, isSearching: this.isSearching, label: this.label, labelId: this.labelId, questionGroupId: this.questionGroupId, pristine: this.pristine, shouldSelectConfiguration: this.shouldSelectConfiguration, touched: this.touched, answeredBySource: this.answeredBySource }));
    }
    renderInternal() {
        return (index.h("div", { class: "bp-sdk-vehicle-vin__container" }, index.h("div", { class: "bp-sdk-vehicle-vin__wrapper" }, index.h("bp-sdk-text-input", { answerId: this.answerId, code: this.code, errors: this.errors, errorText: this.errorText, fieldType: VIN.type, isEnabled: this.canSearch, label: this.label, labelId: this.labelId, max: VIN.max, min: VIN.min, placeholder: VIN.placeholder, pristine: this.pristine, questionId: this.labelId, touched: this.touched, text: this.value, answeredBySource: this.answeredBySource }), this.shouldSelectConfiguration && (index.h("bp-sdk-vehicle-configurations-container", { questionGroupId: this.questionGroupId, checkYmm: false, code: ConfigCode })))));
    }
};
BpSdkVehicleVin.style = BpSdkVehicleVinStyle0;

const bpSdkVehicleVinContainerCss = "";
const BpSdkVehicleVinContainerStyle0 = bpSdkVehicleVinContainerCss;

const BpSdkVehicleVinContainer = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.vinUpdate = index.createEvent(this, "vinUpdate", 7);
        this.ymmcUpdate = index.createEvent(this, "ymmcUpdate", 7);
        this.handleSubscriptions = () => {
            this.storeUnsubscribe && this.storeUnsubscribe();
            reduxStore_service.store.mapDispatchToProps(this, { loadVin: index_esm_min.N });
            this.storeUnsubscribe = reduxStore_service.store.mapStateToProps(this, this.mapStateToProps);
        };
        this.mapStateToProps = (state) => {
            return {
                config: index_esm_min.up(state),
                configurationOptions: index_esm_min.Bp(state, this.questionGroupId),
                vinOptions: index_esm_min.zp(state, this.questionGroupId),
                vinStatus: index_esm_min.RR(state, this.questionGroupId),
                answeredBySource: this.getAnsweredBySource(state),
            };
        };
        this.onFocusOut = () => {
            this.touched = true;
            this.updateErrors(this.pristine, true, this.value);
        };
        this.answerId = undefined;
        this.code = undefined;
        this.vinOptions = Object.assign({}, index_esm_min$2.qe);
        this.configurationOptions = {};
        this.vinStatus = index_esm_min$2.d.NotLoaded;
        this.questionGroupId = undefined;
        this.canSave = false;
        this.value = '';
        this.config = undefined;
        this.lastResponse = undefined;
        this.canSearch = undefined;
        this.useExternal = false;
        this.touched = false;
        this.pristine = true;
        this.errorText = undefined;
        this.hasResult = false;
        this.isSearching = false;
        this.shouldSelectConfiguration = false;
        this.errors = [];
        this.vinResource = undefined;
        this.answeredBySource = undefined;
    }
    resetState() {
        this.touched = false;
        this.pristine = true;
        this.errors = [];
        this.errorText = undefined;
    }
    connectedCallback() {
        this.resetState();
        this.handleSubscriptions();
    }
    componentWillLoad() {
        this.useExternal = !!customElements.get('bp-sdk-external-vehicle-vin-container');
        customElements.whenDefined('bp-sdk-external-vehicle-vin-container').then(() => {
            this.useExternal = true;
        });
        this.onQuestionGroupIdChange();
    }
    onQuestionGroupIdChange() {
        this.handleSubscriptions();
    }
    onVinOptionsChange(vinOptions) {
        var _a;
        this.canSearch = (_a = vinOptions === null || vinOptions === void 0 ? void 0 : vinOptions.isAvailable) !== null && _a !== void 0 ? _a : true;
        this.lastResponse = vinOptions === null || vinOptions === void 0 ? void 0 : vinOptions.lastResponse;
    }
    onVinStatusChange(vinStatus) {
        this.vinResource = vinStatus !== null && vinStatus !== void 0 ? vinStatus : index_esm_min$2.d.NotLoaded;
        this.isSearching = this.vinResource === index_esm_min$2.d.Loading;
    }
    onConfigurationOptionsChange(configurationOptions) {
        const configs = configurationOptions !== null && configurationOptions !== void 0 ? configurationOptions : {};
        const keys = Object.keys(configs);
        this.hasResult = keys.length > 0;
        this.updateShouldSelectConfiguration(this.value, configurationOptions);
        if (keys.length === 1) {
            this.ymmcUpdate.emit({ type: index_esm_min$2.k.Configuration, value: Object.keys(configurationOptions)[0] });
        }
    }
    loadFocusEvents() {
        if (!this.useExternal) {
            this.el.addEventListener('focusout', this.onFocusOut);
        }
    }
    unloadFocusEvents() {
        this.el.removeEventListener('focusout', this.onFocusOut);
    }
    componentDidLoad() {
        this.loadFocusEvents();
    }
    disconnectedCallback() {
        this.unloadFocusEvents();
        this.storeUnsubscribe && this.storeUnsubscribe();
    }
    onValueChange(value) {
        this.updateShouldSelectConfiguration(value, this.configurationOptions);
    }
    updateShouldSelectConfiguration(vin, configurations) {
        // spread operator on configurations guards against null/undefined
        this.shouldSelectConfiguration = !!vin && Object.keys(Object.assign({}, configurations)).length > 1;
    }
    setVin(vin) {
        this.pristine = false;
        this.value = vin;
        this.updateErrors(this.pristine, this.touched, vin);
        const hasErrors = this.errors.length > 0 || this.errorText;
        const hasValidLength = vehicleVin_service.VehicleVinService.hasValidLength(vin);
        this.canSave = !hasErrors && hasValidLength;
        if (!hasErrors) {
            if (hasValidLength) {
                this.loadVin({
                    vin,
                    config: this.config,
                    questionGroupId: this.questionGroupId,
                });
            }
            this.vinUpdate.emit({ vin, answerId: this.answerId });
        }
    }
    onValueUpdate({ detail }) {
        if (this.useExternal) {
            return;
        }
        const vin = detail !== null && detail !== void 0 ? detail : '';
        if (index_esm_min$1.j(this.value, vin)) {
            this.setVin(vin);
        }
    }
    updateErrors(pristine, touched, vin) {
        this.errors = index_esm_min$1.$w(pristine, touched, vin) ? ['required'] : [];
        this.errorText = vehicleVin_service.VehicleVinService.getValidationErrorMessage(vin);
    }
    onMakeDirty() {
        this.touched = true;
        this.pristine = false;
    }
    render() {
        return [this.useExternal && this.renderExternal(), !this.useExternal && this.renderInternal()];
    }
    renderExternal() {
        return (index.h("bp-sdk-external-vehicle-vin-container", { answerId: this.answerId, code: this.code, canSave: this.canSave, canSearch: this.canSearch, config: this.config, configurationOptions: this.configurationOptions, questionGroupId: this.questionGroupId, value: this.value, vinOptions: this.vinOptions, vinStatus: this.vinStatus, answeredBySource: this.answeredBySource }));
    }
    renderInternal() {
        return (index.h("bp-sdk-vehicle-vin", { answerId: this.answerId, canSave: this.canSave, code: this.code, label: "Enter vehicle VIN", isSearching: this.isSearching, hasResult: this.hasResult, touched: this.touched, pristine: this.pristine, errors: this.errors, shouldSelectConfiguration: this.shouldSelectConfiguration, questionGroupId: this.questionGroupId, errorText: this.errorText, value: this.value, answeredBySource: this.answeredBySource }));
    }
    getAnsweredBySource(state) {
        const questionSet = state.application.questionSets.list.find((qs) => qs.question_set.code === 'vehicle_pool_master_question_set');
        const answer = questionSet === null || questionSet === void 0 ? void 0 : questionSet.answers.find((answer) => answer.id === this.answerId);
        if (answer === null || answer === void 0 ? void 0 : answer.answered_by_consumer) {
            return 'Consumer';
        }
        return answer === null || answer === void 0 ? void 0 : answer.answered_by_source;
    }
    get el() { return index.getElement(this); }
    static get watchers() { return {
        "questionGroupId": ["onQuestionGroupIdChange"],
        "vinOptions": ["onVinOptionsChange"],
        "vinStatus": ["onVinStatusChange"],
        "configurationOptions": ["onConfigurationOptionsChange"],
        "value": ["onValueChange"]
    }; }
};
BpSdkVehicleVinContainer.style = BpSdkVehicleVinContainerStyle0;

const bpSdkVehicleYearsCss = "";
const BpSdkVehicleYearsStyle0 = bpSdkVehicleYearsCss;

const BpSdkVehicleYears = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.answerId = undefined;
        this.code = undefined;
        this.label = undefined;
        this.pristine = true;
        this.touched = false;
        this.errors = [];
        this.years = [];
        this.selectedYear = undefined;
        this.isVehicleTrailer = false;
        this.answeredBySource = '';
        this.fieldType = 'dropdown';
        this.inputComponentType = 'dropdown';
        this.useExternal = false;
    }
    resetState() { }
    connectedCallback() {
        this.resetState();
    }
    componentWillLoad() {
        this.useExternal = !!customElements.get('bp-sdk-external-vehicle-years');
        customElements.whenDefined('bp-sdk-external-vehicle-years').then(() => {
            this.useExternal = true;
        });
        this.onIsVehicleTrailerChange(this.isVehicleTrailer);
    }
    onIsVehicleTrailerChange(isTrailer) {
        this.fieldType = isTrailer ? 'vehicle' : 'dropdown';
        this.inputComponentType = isTrailer ? 'vehicle' : 'dropdown';
    }
    render() {
        return [this.useExternal && this.renderExternal(), !this.useExternal && this.renderInternal()];
    }
    renderExternal() {
        return (index.h("bp-sdk-external-vehicle-years", { answerId: this.answerId, code: this.code, errors: this.errors, isVehicleTrailer: this.isVehicleTrailer, label: this.label, pristine: this.pristine, selectedYear: this.selectedYear, touched: this.touched, years: this.years }));
    }
    renderInternal() {
        return (index.h("bp-sdk-dynamic-input", { answerId: this.answerId, choiceId: this.selectedYear, choices: this.years, code: this.code, errors: this.errors, fieldType: this.fieldType, inputComponentType: this.inputComponentType, isAutocomplete: this.isVehicleTrailer, isLabelledField: true, isRequired: true, label: this.label, pristine: this.pristine, referenceType: "years", touched: this.touched, answeredBySource: this.answeredBySource }));
    }
    static get watchers() { return {
        "isVehicleTrailer": ["onIsVehicleTrailerChange"]
    }; }
};
BpSdkVehicleYears.style = BpSdkVehicleYearsStyle0;

const bpSdkVehicleYearsContainerCss = "";
const BpSdkVehicleYearsContainerStyle0 = bpSdkVehicleYearsContainerCss;

const BpSdkVehicleYearsContainer = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.ymmcUpdate = index.createEvent(this, "ymmcUpdate", 7);
        this.handleSubscriptions = () => {
            reduxStore_service.store.mapDispatchToProps(this, {
                loadYears: index_esm_min.M,
            });
            this.storeUnsubscribe && this.storeUnsubscribe();
            this.storeUnsubscribe = reduxStore_service.store.mapStateToProps(this, this.mapStateToProps);
        };
        this.mapStateToProps = (state) => {
            return {
                config: index_esm_min.up(state),
                yearOptions: index_esm_min.Fp(state, this.questionGroupId),
                selectedVehicle: index_esm_min.Gp(state, this.questionGroupId),
            };
        };
        this.onFocusOut = () => {
            this.touched = true;
            this.updateErrors(this.pristine, true, this.value);
        };
        this.selectedVehicle = undefined;
        this.yearOptions = {};
        this.questionGroupId = undefined;
        this.isVehicleTrailer = false;
        this.config = undefined;
        this.answerId = undefined;
        this.code = undefined;
        this.answeredBySource = '';
        this.choices = [];
        this.filter = undefined;
        this.filteredChoices = [];
        this.useExternal = false;
        this.touched = false;
        this.pristine = true;
        this.value = undefined;
        this.errors = [];
    }
    resetState() {
        this.touched = false;
        this.pristine = true;
        this.value = undefined;
        this.errors = [];
    }
    connectedCallback() {
        this.resetState();
        this.handleSubscriptions();
    }
    componentWillLoad() {
        this.useExternal = !!customElements.get('bp-sdk-external-vehicle-years-container');
        customElements.whenDefined('bp-sdk-external-vehicle-years-container').then(() => {
            this.useExternal = true;
        });
        this.handleSubscriptions();
        this.onQuestionGroupIdChange();
    }
    fetchYears() {
        this.loadYears({ config: this.config, questionGroupId: this.questionGroupId });
    }
    onQuestionGroupIdChange() {
        this.handleSubscriptions();
    }
    onYearsChange(years) {
        if (years) {
            this.choices = this.convertYearsToChoices(years);
            this.updateValue(years, this.selectedVehicle);
        }
        else {
            this.fetchYears();
            this.updateValue(undefined, undefined);
        }
    }
    onVehicleSelectionChange(selection) {
        this.updateValue(this.yearOptions, selection);
    }
    updateValue(years, selection) {
        this.value = !!(years && (selection === null || selection === void 0 ? void 0 : selection.yearId) && years[selection.yearId]) ? years[selection.yearId].toString() : undefined;
    }
    onUseExternalChange(useExternal) {
        if (!useExternal) {
            this.unloadFocusEvents();
        }
    }
    loadFocusEvents() {
        if (!this.useExternal) {
            this.el.addEventListener('focusout', this.onFocusOut);
        }
    }
    unloadFocusEvents() {
        this.el.removeEventListener('focusout', this.onFocusOut);
    }
    componentDidLoad() {
        this.loadFocusEvents();
    }
    disconnectedCallback() {
        this.unloadFocusEvents();
        this.storeUnsubscribe && this.storeUnsubscribe();
    }
    onFilterUpdate({ detail }) {
        var _a;
        this.filter = (_a = detail === null || detail === void 0 ? void 0 : detail.value) !== null && _a !== void 0 ? _a : '';
    }
    onFilterChange(filter) {
        this.updateChoices(this.choices, filter);
    }
    onChoicesChange(choices) {
        this.updateChoices(choices, this.filter);
    }
    updateChoices(choices, filter = '') {
        const regex = new RegExp(`.*${filter}.*`, 'gi');
        this.filteredChoices = choices.filter((choice) => !!choice.value.match(regex));
    }
    onValueUpdate(evt) {
        var _a;
        if (this.useExternal) {
            return;
        }
        this.pristine = false;
        const value = ((_a = evt.detail) !== null && _a !== void 0 ? _a : [])[0];
        const num = Number(value);
        const isNumber = !Number.isNaN(num);
        this.updateErrors(false, this.touched, value);
        if (this.errors.length === 0 && isNumber && index_esm_min$1.j(value, this.value)) {
            this.value = value;
            this.ymmcUpdate.emit({ type: index_esm_min$2.k.Year, value });
            this.filter = '';
        }
    }
    onValueChange(value) {
        this.updateErrors(false, this.touched, value);
    }
    updateErrors(pristine, touched, value) {
        this.errors = index_esm_min$1.$w(pristine, touched, value) ? ['required'] : [];
    }
    onMakeDirty() {
        this.touched = true;
        this.pristine = false;
        this.updateErrors(false, this.touched, this.value);
    }
    render() {
        return [this.useExternal && this.renderExternal(), !this.useExternal && this.renderInternal()];
    }
    renderExternal() {
        return (index.h("bp-sdk-external-vehicle-years-container", { answerId: this.answerId, code: this.code, config: this.config, isVehicleTrailer: this.isVehicleTrailer, questionGroupId: this.questionGroupId, selectedVehicle: this.selectedVehicle, yearOptions: this.yearOptions }));
    }
    convertYearsToChoices(years) {
        const choices = [];
        for (const year of Object.keys(years)) {
            choices.push({ id: year, value: year });
        }
        choices.sort((a, b) => parseFloat(b.value) - parseFloat(a.value));
        return choices;
    }
    renderInternal() {
        var _a, _b;
        return (this.choices.length > 0 && (index.h("bp-sdk-vehicle-years", { answerId: this.answerId, code: this.code, errors: this.errors, isVehicleTrailer: this.isVehicleTrailer, label: "Enter vehicle year", pristine: this.pristine, selectedYear: (_b = (_a = this.selectedVehicle) === null || _a === void 0 ? void 0 : _a.yearId) === null || _b === void 0 ? void 0 : _b.toString(), touched: this.touched, years: this.filteredChoices, answeredBySource: this.answeredBySource })));
    }
    get el() { return index.getElement(this); }
    static get watchers() { return {
        "questionGroupId": ["onQuestionGroupIdChange"],
        "yearOptions": ["onYearsChange"],
        "selectedVehicle": ["onVehicleSelectionChange"],
        "useExternal": ["onUseExternalChange"],
        "filter": ["onFilterChange"],
        "choices": ["onChoicesChange"],
        "value": ["onValueChange"]
    }; }
};
BpSdkVehicleYearsContainer.style = BpSdkVehicleYearsContainerStyle0;

exports.bp_sdk_question_group = BpSdkQuestionGroup;
exports.bp_sdk_question_group_container = BpSdkQuestionGroupContainer;
exports.bp_sdk_vehicle_delete_button = BpSdkVehicleDeleteButton;
exports.bp_sdk_vehicle_edit_button = BpSdkVehicleEditButton;
exports.bp_sdk_vehicle_group = BpSdkVehicleGroup;
exports.bp_sdk_vehicle_interface = BpSdkVehicleInterface;
exports.bp_sdk_vehicle_makes = BpSdkVehicleMakes;
exports.bp_sdk_vehicle_makes_container = BpSdkVehicleMakesContainer;
exports.bp_sdk_vehicle_models = BpSdkVehicleModels;
exports.bp_sdk_vehicle_models_container = BpSdkVehicleModelsContainer;
exports.bp_sdk_vehicle_panel = BpSdkVehiclePanel;
exports.bp_sdk_vehicle_panel_buttons = BpSdkVehiclePanelButtons;
exports.bp_sdk_vehicle_panel_content = BpSdkVehiclePanelContent;
exports.bp_sdk_vehicle_panel_label = BpSdkVehiclePanelLabel;
exports.bp_sdk_vehicle_save_button = BpSdkVehicleSaveButton;
exports.bp_sdk_vehicle_vin = BpSdkVehicleVin;
exports.bp_sdk_vehicle_vin_container = BpSdkVehicleVinContainer;
exports.bp_sdk_vehicle_years = BpSdkVehicleYears;
exports.bp_sdk_vehicle_years_container = BpSdkVehicleYearsContainer;
