'use strict';

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

const index = require('./index-9a9efa1c.js');
const index$1 = require('./index-61ff1b55.js');
const plus = require('./plus-339686b5.js');
const v4 = require('./v4-9b297151.js');

const translations = {
    'sv': {
        dropdownPlaceholder: 'Välj ett alternativ',
    },
    'en': {
        dropdownPlaceholder: 'Select an option',
    },
    'da': {
        dropdownPlaceholder: 'Vælg en mulighed',
    },
};

const pnDropdownWithMultiInputRowsCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}pn-dropdown-with-multi-input-rows .dropdown-with-multi-input-element__row{margin-bottom:1rem}pn-dropdown-with-multi-input-rows .dropdown-with-multi-input-element__delete{display:flex;gap:1rem;margin-bottom:1rem;padding:1rem;background-color:#f9f8f8}pn-dropdown-with-multi-input-rows .dropdown-with-multi-input-element__delete pn-button{margin-top:0.9rem}pn-dropdown-with-multi-input-rows .dropdown-with-multi-input-element__label-row{display:flex;gap:1rem}pn-dropdown-with-multi-input-rows .dropdown-with-multi-input-element__label{width:30%;font-size:0.875em;color:#5e554a}pn-dropdown-with-multi-input-rows .sum-row{display:flex;justify-content:space-between}pn-dropdown-with-multi-input-rows .dropdown-with-multi-input-element__dropdown{display:inline-flex;align-items:center}pn-dropdown-with-multi-input-rows small{max-width:70%;margin:1rem;align-self:center;position:relative;top:1rem}pn-dropdown-with-multi-input-rows .dropdown-with-multi-input-element__row .dropdown-with-multi-input-element__dropdown .pn-row-select-dropdown .pn-select .pn-select-input .pn-select-content{width:18rem}";
const PnDropdownWithMultiInputRowsStyle0 = pnDropdownWithMultiInputRowsCss;

const PnDropdownWithMultiInputRows = class {
    get hostElement() { return index.getElement(this); }
    pnFirstDropdown = null;
    pnSecondDropdown = null;
    pnSumField = null;
    pnConfirmDeleteButton = null;
    pnAbortDeleteButton = null;
    allFormValues;
    _firstDropdownSelection = null;
    _secondDropdownSelection = null;
    _defaultRow;
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.allFormValues = index.createEvent(this, "allFormValues", 7);
        this.dropdownData = null;
        this.languageCode = null;
        this.firstDropdownLabel = null;
        this.firstDropdownHelperText = null;
        this.secondDropdownLabel = null;
        this.secondDropdownHelperText = null;
        this.secondDropdownMax = null;
        this.deleteMultipleRowsWarningText = null;
        this.confirmDeleteButtonText = null;
        this.abortDeleteButtonText = null;
        this.firstInputLabel = null;
        this.firstInputPlaceholder = null;
        this.firstInputMin = null;
        this.firstInputMax = null;
        this.firstInputWarning = null;
        this.firstInputWarningText = null;
        this.firstInputLowErrorText = null;
        this.firstInputHighErrorText = null;
        this.secondInputLabel = null;
        this.secondInputPlaceholder = null;
        this.secondInputMin = null;
        this.secondInputMax = null;
        this.secondInputWarning = null;
        this.secondInputWarningText = null;
        this.secondInputLowErrorText = null;
        this.secondInputHighErrorText = null;
        this.disabledDates = null;
        this.dateLabel = null;
        this.datePlaceholder = null;
        this.dateDaysFromToday = 1;
        this.yearsToAddToEndDate = null;
        this.sumFieldLabel = null;
        this.addRowText = null;
        this.elementHelperText = null;
        this.dropdownDataRoot = null;
        this.secondDropdownArr = [];
        this.rowData = null;
        this.formValues = null;
        this.firstValidDateString = '';
        this.lastValidDateString = '';
        this.rowSum = null;
        this.minRowCount = null;
        this.showDeleteConfirm = false;
        this.i18n = undefined;
        this._defaultRow = {
            id: this.generateUniqueId(),
            firstInput: '',
            secondInput: this.secondInputWarning !== null ? this.secondInputWarning.toString() : '',
            date: '',
        };
    }
    componentWillLoad() {
        this.formValues = [];
        this.setDropDownData();
        this.updateSecondDropdown();
        this.setRowData();
        this.setFirstValidDate();
        this.setTranslations();
    }
    setTranslations() {
        this.i18n = translations[this.languageCode] || translations['en'];
    }
    componentDidLoad() {
        this.updateSum();
    }
    setDropDownData() {
        if (typeof this.dropdownData === 'string') {
            this.dropdownDataRoot = JSON.parse(this.dropdownData);
        }
        else {
            this.dropdownDataRoot = this.dropdownData;
        }
        if (this.dropdownDataRoot?.length) {
            this.dropdownDataRoot.forEach(element => {
                if (!element.value) {
                    element.value = 0;
                }
            });
        }
        if (this.dropdownDataRoot.length > 0) {
            this.dropdownDataRoot[0].checked = true;
            this._firstDropdownSelection = this.dropdownDataRoot[0].label;
            this._secondDropdownSelection = this.dropdownDataRoot[0].value;
            this.minRowCount = this.dropdownDataRoot[0].value;
        }
    }
    updateSecondDropdown() {
        const selectedItem = this.dropdownDataRoot.find(arr => arr.checked === true);
        this.secondDropdownArr = [];
        for (let index = selectedItem.value; index <= this.secondDropdownMax; index++) {
            this.secondDropdownArr.push(index);
        }
    }
    updateSelectItemArr(arr, caption) {
        arr.forEach(item => {
            if (item.label === caption) {
                item.checked = !item.checked;
            }
            else {
                item.checked = false;
            }
        });
        return arr;
    }
    setRowData() {
        this.rowData = [];
        for (let index = 0; index < this._secondDropdownSelection; index++) {
            const row = Object.assign({}, this._defaultRow);
            row.id = this.generateUniqueId();
            this.rowData = [...this.rowData, row];
        }
    }
    generateUniqueId() {
        return v4.v4();
    }
    setFirstValidDate() {
        const yearsToadd = this.yearsToAddToEndDate ? this.yearsToAddToEndDate : 2;
        const date = new Date();
        date.setDate(date.getDate() + this.dateDaysFromToday);
        const year = date.getFullYear();
        const month = (date.getMonth() + 1).toString().padStart(2, '0');
        const day = date.getDate().toString().padStart(2, '0');
        const endYear = year + yearsToadd;
        this.firstValidDateString = `${year.toString()}-${month}-${day}`;
        this.lastValidDateString = `${endYear.toString()}-${month}-${day}`;
    }
    addRow(newRowId) {
        const newRow = Object.assign({}, this.rowData[0]);
        newRow.id = newRowId ? newRowId : this.generateUniqueId();
        newRow.date = '';
        this.rowData = [...this.rowData, newRow];
        this.secondDropdownArr = [...this.secondDropdownArr];
        this.updateSum();
        this.emitValuesIfValid();
    }
    handleFirstDropdown = index$1.debounce((e) => {
        const selected = e.target;
        const selectedValue = selected?.value;
        if (!selectedValue?.length) {
            return;
        }
        const selectionRoot = this.dropdownDataRoot.find(x => x.value.toString() === selectedValue);
        this.minRowCount = selectionRoot.value;
        if (selectionRoot.value > this._secondDropdownSelection) {
            this.dropdownDataRoot = [...this.dropdownDataRoot];
            for (let index = this.rowData?.length; index < selectionRoot.value; index++) {
                this.addRow(this.generateUniqueId());
            }
        }
        this.updateSecondDropdown();
        this.updateSum();
        this.emitValuesIfValid();
    });
    handleSecondDropdown = index$1.debounce((e) => {
        const target = e.target;
        const selectedOption = target?.value;
        if (!selectedOption) {
            return;
        }
        const selectedValue = selectedOption;
        if (!selectedValue?.length) {
            return;
        }
        const value = parseInt(selectedValue);
        if (value < this._secondDropdownSelection) {
            this.showDeleteConfirm = true;
        }
        else {
            for (let index = this.rowData?.length; index < value; index++) {
                this.addRow(this.generateUniqueId());
            }
        }
        this._secondDropdownSelection = value;
        this.updateSum();
        this.emitValuesIfValid();
    });
    predefinedValueChange(e) {
        const indexToUpdate = this.rowData?.findIndex(data => data.id === e.detail.id);
        const val = e.detail;
        this.rowData[indexToUpdate] = {
            ...this.rowData[indexToUpdate],
            firstInput: val.firstInput,
            secondInput: val.secondInput,
            date: val.date,
        };
        if (e.type === 'firstInputChange' && indexToUpdate === 0) {
            this.updateFirstInputOfRows(val.firstInput);
        }
        if (e.type === 'secondInputChange' && indexToUpdate === 0) {
            this.updateSecondInputOfRows(val.secondInput);
        }
        this.rowData = [...this.rowData];
        this.emitValuesIfValid();
        this.updateSum();
    }
    updateFirstInputOfRows(value) {
        for (let index = 1; index < this.rowData?.length; index++) {
            this.rowData[index] = {
                ...this.rowData[index],
                firstInput: value,
            };
        }
    }
    updateSecondInputOfRows(value) {
        for (let index = 1; index < this.rowData?.length; index++) {
            this.rowData[index] = {
                ...this.rowData[index],
                secondInput: value,
            };
        }
    }
    deleteRowEvent(e) {
        const indexToRemove = this.rowData?.findIndex(data => data.id === e.detail);
        if (indexToRemove < 0) {
            return;
        }
        this.rowData?.splice(indexToRemove, 1);
        this.rowData = [...this.rowData];
        this.secondDropdownArr = [...this.secondDropdownArr];
        this.emitValuesIfValid();
        this.updateSum();
    }
    updateSum() {
        this.rowSum = '';
        let sum = 0;
        this.rowData?.forEach(element => {
            if (element?.firstInput?.length) {
                sum += parseInt(element.firstInput);
            }
        });
        this.rowSum = sum.toString();
    }
    deleteExcessRows() {
        if (this._secondDropdownSelection === null) {
            return;
        }
        const rowsToDelete = this.rowData?.length - this._secondDropdownSelection;
        for (let index = 0; index < rowsToDelete; index++) {
            this.rowData?.pop();
        }
        this.rowData = [...this.rowData];
        this.showDeleteConfirm = false;
        this.updateSum();
    }
    abortDeleteRows() {
        this.showDeleteConfirm = false;
    }
    emitValuesIfValid() {
        this.formValues = [];
        this.rowData?.forEach(item => {
            const rowValue = { row: [] };
            if (this._firstDropdownSelection?.length) {
                const dropDownValue = { name: this.firstDropdownLabel, value: this._firstDropdownSelection };
                rowValue.row.push(dropDownValue);
            }
            if (item.firstInput?.length) {
                const firstInputValue = { name: this.firstInputLabel, value: item.firstInput };
                rowValue.row.push(firstInputValue);
            }
            if (item.secondInput?.length) {
                const secondInputValue = { name: this.secondInputLabel, value: item.secondInput };
                rowValue.row.push(secondInputValue);
            }
            if (item.date) {
                const dateValue = { name: this.dateLabel, value: item.date };
                rowValue.row.push(dateValue);
            }
            if (rowValue.row.length === 4) {
                this.formValues.push(rowValue);
            }
        });
        if (this.formValues.length === this.rowData?.length) {
            const valueJsonString = JSON.stringify(this.formValues);
            this.allFormValues.emit(valueJsonString);
        }
        else {
            this.allFormValues.emit('');
        }
    }
    render() {
        return (index.h(index.Host, { key: 'a36c4aaa149ea44a8fe2a5ba317da7ac573d74a9', class: "dropdown-with-multi-input-element" }, index.h("div", { key: 'f0db29797e6cae79982185f5739bb94a14edf08e', class: "dropdown-with-multi-input-element__row" }, index.h("div", { key: 'a4378d62e4066b8eca52641dfdb946b6a8836a69', class: "dropdown-with-multi-input-element__dropdown" }, index.h("pn-select", { key: 'f030749e5dd3d867061d484e92387bb2088fadbb', ref: el => (this.pnFirstDropdown = el), onChange: index$1.debounce(this.handleFirstDropdown.bind(this), 500), class: "pn-row-select-dropdown dropDown1-dropdown", label: this.firstDropdownLabel, language: this.languageCode }, index.h("option", { key: 'c96e514377fe340c9ce40006af64c2e6f9c09734', value: "", disabled: true, selected: true }, this.i18n.dropdownPlaceholder), this.dropdownDataRoot?.map((item) => (index.h("option", { value: item.value }, item.label)))), this.firstDropdownHelperText?.length ? index.h("small", null, this.firstDropdownHelperText) : null)), index.h("div", { key: 'bd14511d43ac708adf22bcc525ae4d001568a529', class: "dropdown-with-multi-input-element__row" }, index.h("div", { key: '25a682c29e11d27a10b8e5072f252e740c9c0859', class: "dropdown-with-multi-input-element__dropdown" }, index.h("pn-select", { key: 'ae6b8bfea4668fd3c4873c4c627afee05ac647c6', ref: el => (this.pnSecondDropdown = el), onChange: index$1.debounce(this.handleSecondDropdown.bind(this), 500), class: "pn-row-select-dropdown dropDown2-dropdown", label: this.secondDropdownLabel, language: this.languageCode }, index.h("option", { key: '198778933f0ed26709a99dbe409d3a2a49884ab9', value: "", disabled: true, selected: true }, this.i18n.dropdownPlaceholder), this.secondDropdownArr?.map((item) => (index.h("option", { value: item }, item)))), this.secondDropdownHelperText?.length ? index.h("small", null, this.secondDropdownHelperText) : null)), this.showDeleteConfirm ? (index.h("div", { class: "dropdown-with-multi-input-element__delete" }, index.h("p", null, this.deleteMultipleRowsWarningText), index.h("pn-button", { ref: el => (this.pnConfirmDeleteButton = el), small: "true", appearance: "warning", onClick: this.deleteExcessRows.bind(this) }, this.confirmDeleteButtonText), index.h("pn-button", { ref: el => (this.pnAbortDeleteButton = el), small: "true", appearance: "light", onClick: this.abortDeleteRows.bind(this) }, this.abortDeleteButtonText))) : null, index.h("div", { key: '408ce54d7f35a8c32f681bfccd999223c1319048', class: "dropdown-with-multi-input-element__label-row" }, index.h("div", { key: '77e0d10422301c5d392c462c327a84402f1c301d', class: "dropdown-with-multi-input-element__label" }, index.h("label", { key: '1136e30608e99d5bfdf0c661da2055df7d5d0f49' }, this.firstInputLabel)), index.h("div", { key: 'f2c97b957c1e158521aacd2abb1f9218a91733a0', class: "dropdown-with-multi-input-element__label" }, index.h("label", { key: 'e9a3c4822837ceca87093989a5d9888ac3c5f1c8' }, this.secondInputLabel)), index.h("div", { key: 'df04f7c65236f0a08e1119d3ab7b5283ff792799', class: "dropdown-with-multi-input-element__label" }, index.h("label", { key: 'a59ae55157f5ae993abe02e1d70580c81c8b7e15' }, this.dateLabel))), this.rowData?.map((data, i) => {
            return (index.h("div", { class: 'dropdown-with-multi-input-element__row generated-row-' + i, id: 'generated-row-' + i }, index.h("pn-dropdown-with-multi-input-rows-row", { "language-code": this.languageCode, "first-input-placeholder": this.firstInputPlaceholder, "first-input-min": this.firstInputMin, "first-input-max": this.firstInputMax, "first-input-warning": this.firstInputWarning, "first-input-warning-text": this.firstInputWarningText, "first-input-low-error-text": this.firstInputLowErrorText, "first-input-high-error-text": this.firstInputHighErrorText, "second-input-placeholder": this.secondInputPlaceholder, "second-input-min": this.secondInputMin, "second-input-max": this.secondInputMax, "second-input-warning": this.secondInputWarning, "second-input-warning-text": this.secondInputWarningText, "second-input-low-error-text": this.secondInputLowErrorText, "second-input-high-error-text": this.secondInputHighErrorText, datePlaceholder: this.datePlaceholder, firstValidDate: this.firstValidDateString, lastValidDate: this.lastValidDateString, "predefined-value": JSON.stringify(data), "min-row-count": this.minRowCount, "row-index": i, "disabled-dates": this.disabledDates })));
        }), index.h("div", { key: 'dbf0c28a2893081884009177ce4c4d382e598906', class: "dropdown-with-multi-input-element__row sum-row" }, index.h("pn-input", { key: '7518ff5a32236320c710618db2a2f32c5c74c5f7', disabled: true, ref: el => (this.pnSumField = el), type: "number", value: this.rowSum, label: this.sumFieldLabel }), index.h("pn-button", { key: '00b8be5ea7f5753676db44b9f1eb0bb06769b6a2', tooltip: this.addRowText ? this.addRowText : null, "left-icon": "true", arialabel: "Add", icon: plus.plus, appearance: "light", variant: "borderless", class: "connected-dropdown__button-right", onClick: () => {
                this.addRow(this.generateUniqueId());
            } }, this.addRowText)), this.elementHelperText?.length ? index.h("div", { class: "dropdown-with-multi-input-element__row" }, this.elementHelperText) : null));
    }
    static get watchers() { return {
        "languageCode": ["setTranslations"]
    }; }
};
PnDropdownWithMultiInputRows.style = PnDropdownWithMultiInputRowsStyle0;

exports.pn_dropdown_with_multi_input_rows = PnDropdownWithMultiInputRows;

//# sourceMappingURL=pn-dropdown-with-multi-input-rows.cjs.entry.js.map