@scania/tegel/dist/components/p-d0cf68be.js

Tegel Design System

import { p as proxyCustomElement, H, h, c as Host } from './p-28ef5186.js';
import { g as getPreviousNestedChildOfSiblingsMatching, i as isHeadingElement } from './p-859e3ebf.js';

const headerDropdownListCss = ":host{display:block;width:190px;padding:0;margin:0;list-style:none;border-radius:unset;background-color:var(--tds-header-app-launcher-menu-bg)}@media all and (max-width: 384px){:host{width:100vw}}:host([size=lg]){width:320px}";
const TdsHeaderDropdownListStyle0 = headerDropdownListCss;

const TdsHeaderDropdownList = /*@__PURE__*/ proxyCustomElement(class TdsHeaderDropdownList extends H {
    constructor() {
        super();
        this.__registerHost();
        this.__attachShadow();
        // A Map to store the slots and their associated slotchange listeners.
        this.slotListeners = new Map();
        this.size = 'md';
        this.headingElement = undefined;
    }
    componentWillLoad() {
        const { children } = this.host;
        // Set the size prop for each child, if they have such a property
        for (let i = 0; i < children.length; i++) {
            const child = children[i];
            if ('size' in child) {
                child.size = this.size;
            }
        }
        let listRoot = this.host;
        if (this.host.parentElement.tagName.toLowerCase() === 'tds-header-launcher-list') {
            listRoot = this.host.parentElement;
        }
        const headingEl = getPreviousNestedChildOfSiblingsMatching(listRoot, isHeadingElement);
        if (headingEl) {
            this.headingElement = headingEl;
        }
        else {
            console.warn('Heading element for list not found');
        }
    }
    componentDidLoad() {
        this.host.shadowRoot.querySelectorAll('slot').forEach((slot) => {
            // Add the slotchange event listener.
            const onSlotChange = (e) => {
                this.processAssignedElements(e.target);
            };
            slot.addEventListener('slotchange', onSlotChange);
            onSlotChange({ target: slot });
            // Store the slot and its listener in the Map.
            this.slotListeners.set(slot, onSlotChange);
        });
    }
    processAssignedElements(slot) {
        const nodes = slot.assignedElements();
        nodes.forEach((node) => {
            // Add a listitem role to the assigned element if needed.
            if (node.tagName.toLowerCase() !== 'li' &&
                node.tagName.toLowerCase() !== 'slot' &&
                node.getAttribute('role') !== 'listitem') {
                node.setAttribute('role', 'listitem');
            }
            // If the assigned element is a slot, process its assigned elements recursively.
            if (node.tagName.toLowerCase() === 'slot') {
                this.processAssignedElements(node);
            }
        });
    }
    disconnectedCallback() {
        this.slotListeners.forEach((listener, slot) => {
            // Remove the slotchange event listener and delete the entry from the Map.
            slot.removeEventListener('slotchange', listener);
            this.slotListeners.delete(slot);
        });
    }
    render() {
        var _a;
        const attributes = {
            'role': 'list',
            'aria-labelledby': (_a = this.headingElement) === null || _a === void 0 ? void 0 : _a.id,
        };
        return (h(Host, Object.assign({ key: '3eeb33a5a5ba4afbfa21bd65fc4ad8ca7d8feddf' }, attributes), h("slot", { key: '5561862a0377a76cae8d781849c4de10c9e8cdeb' })));
    }
    get host() { return this; }
    static get style() { return TdsHeaderDropdownListStyle0; }
}, [1, "tds-header-dropdown-list", {
        "size": [513],
        "headingElement": [32]
    }]);
function defineCustomElement() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["tds-header-dropdown-list"];
    components.forEach(tagName => { switch (tagName) {
        case "tds-header-dropdown-list":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, TdsHeaderDropdownList);
            }
            break;
    } });
}
defineCustomElement();

export { TdsHeaderDropdownList as T, defineCustomElement as d };