import { r as registerInstance, c as createEvent, a as getElement, h } from './index-Cby2wKoI.js';

const listCss = () => `.link-wrapper{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:8px}`;

const List = class {
    constructor(hostRef) {
        registerInstance(this, hostRef);
        this.ifxListUpdate = createEvent(this, "ifxListUpdate", 7);
    }
    get el() { return getElement(this); }
    expanded = false;
    showMore = false;
    selectedCount = 0;
    totalItems = 0;
    name = "";
    maxVisibleItems = 6;
    type = "checkbox"; //default value
    resetTrigger;
    internalResetTrigger = false;
    ifxListUpdate;
    observer;
    handleTypeChange(newType) {
        this.updateListEntriesType(newType);
    }
    resetTriggerChanged(newValue) {
        if (newValue) {
            this.reset();
            this.resetTrigger = false; // Resetting the trigger after the action is performed
        }
    }
    componentWillLoad() {
        this.setupListenersAndObservers();
        this.initializeList();
    }
    disconnectedCallback() {
        this.cleanupListenersAndObservers();
    }
    reset() {
        this.resetListEntries();
        this.expanded = false;
        this.showMore = false;
        this.selectedCount = 0;
        this.ifxListUpdate.emit({ name: this.name, selectedItems: [] });
    }
    render() {
        return this.renderList();
    }
    // Refactored methods for clarity and maintainability
    setupListenersAndObservers() {
        this.el.addEventListener("ifxListEntryChange", this.handleCheckedChange);
        this.observer = new MutationObserver(this.handleMutation);
        this.observer.observe(this.el, { childList: true });
    }
    cleanupListenersAndObservers() {
        this.el.removeEventListener("ifxListEntryChange", this.handleCheckedChange);
        this.observer.disconnect();
    }
    initializeList() {
        this.selectedCount = this.getSelectedItems(this.el).length;
        this.totalItems = this.getTotalItems();
        this.updateListEntriesType(this.type);
        this.checkRadioButtonConstraint();
    }
    updateListEntriesType(newType) {
        const listEntries = Array.from(this.el.querySelectorAll("ifx-list-entry"));
        listEntries.forEach((entry) => entry.setAttribute("type", newType));
    }
    resetListEntries() {
        const listEntries = Array.from(this.el.querySelectorAll("ifx-list-entry"));
        listEntries.forEach((entry) => {
            entry.value = false;
            entry.setAttribute("value", "false");
        });
    }
    handleMutation = () => {
        const newTotalItems = this.getTotalItems();
        if (newTotalItems !== this.totalItems) {
            this.totalItems = newTotalItems;
            this.handleCheckedChange();
        }
        this.updateListEntriesType(this.type);
    };
    checkRadioButtonConstraint() {
        if (this.type === "radio-button" && this.selectedCount > 1) {
            this.resetListEntries(); // Reset all and let the user select again
            this.selectedCount = 0;
        }
    }
    getTotalItems() {
        return this.el.querySelectorAll("ifx-list-entry").length;
    }
    toggleShowMore = (event) => {
        event.stopPropagation();
        this.showMore = !this.showMore;
    };
    getSelectedItems(el) {
        return Array.from(el.querySelectorAll("ifx-list-entry"))
            .filter((entry) => entry.getAttribute("value") === "true")
            .map((entry) => ({
            label: entry.getAttribute("label"),
            value: entry.getAttribute("value"),
            type: entry.getAttribute("type"),
            element: entry,
        }));
    }
    handleCheckedChange = (event) => {
        // If the type of the changed entry is 'radio-button' and its value is true, deselect all other radio buttons
        if (event && event.detail.type === "radio-button" && event.detail.value) {
            const otherRadioButtons = Array.from(this.el.querySelectorAll("ifx-list-entry")).filter((entry) => entry.getAttribute("type") === "radio-button" &&
                entry !== event.target);
            otherRadioButtons.forEach((radioButton) => radioButton.setAttribute("value", "false"));
        }
        const selectedItems = this.getSelectedItems(this.el);
        this.selectedCount = selectedItems.length;
        this.ifxListUpdate.emit({ name: this.name, selectedItems });
    };
    renderList() {
        const listEntries = Array.from(this.el.querySelectorAll("ifx-list-entry"));
        const visibleItems = this.showMore
            ? listEntries
            : listEntries.slice(0, this.maxVisibleItems);
        const remainingItems = listEntries.length - visibleItems.length;
        return (h("div", { class: "list-wrapper" }, visibleItems.map((entry) => (h("slot", { name: entry.getAttribute("slot") }))), (remainingItems > 0 || this.showMore) && (h("div", { class: "link-wrapper", onClick: this.toggleShowMore }, h("ifx-icon", { key: this.showMore.toString(), icon: this.showMore ? "chevron-up-16" : "chevron-down-16" }), h("ifx-link", { size: "s", href: "", target: "_blank", variant: "underlined", disabled: false }, this.showMore ? "Show less" : `Show ${remainingItems} more`)))));
    }
    static get watchers() { return {
        "type": [{
                "handleTypeChange": 0
            }],
        "resetTrigger": [{
                "resetTriggerChanged": 0
            }]
    }; }
};
List.style = listCss();

export { List as ifx_list };
//# sourceMappingURL=ifx-list.entry.js.map

//# sourceMappingURL=ifx-list.entry.js.map