import { h } from "@stencil/core";
import { logger } from "../../../global/utils/logger";
import { randomIdGenerator } from "../../../global/utils/randomIdGenerator";
import { _t } from "../../../text";
/**
 * @slot default - Ska inehålla länkelement med href-attribut.
 * @swedishName Brödsmulor
 */
export class NavigationBreadcrumbs {
    constructor() {
        this.linkItems = [];
        this.currentPage = undefined;
        this.afAriaLabel = _t.breadcrumbs;
        this.afId = randomIdGenerator('digi-navigation-breadcrumbs');
        this.afCurrentPage = undefined;
    }
    onAfCurrentPage(afCurrentPage) {
        this.currentPage = afCurrentPage;
    }
    componentDidLoad() {
        this.getBreadcrumbs();
    }
    getBreadcrumbs() {
        const elements = this._observer.children;
        if (!elements || (elements === null || elements === void 0 ? void 0 : elements.length) <= 0) {
            logger.warn(`The slot contains no link elements.`, this.hostElement);
            return;
        }
        this.linkItems = [...elements]
            .filter((element) => element.tagName.toLowerCase() === 'a')
            .map((element) => {
            return {
                text: element.textContent,
                href: element.getAttribute('href') || ''
            };
        });
    }
    clickHandler(e) {
        this.afOnClick.emit(e);
    }
    render() {
        var _a;
        return (h("nav", { key: '2eb7edfb17175dbbb23060e1ef082c26cc7ec00c', class: "digi-navigation-breadcrumbs", "aria-label": this.afAriaLabel }, h("ol", { key: 'c3324fc686e3399ee2d1a62b4a81704c35d0dd0f', class: "digi-navigation-breadcrumbs__items" }, this.linkItems.map((item) => {
            return (h("li", { class: "digi-navigation-breadcrumbs__item" }, h("a", { class: "digi-navigation-breadcrumbs__link", onClick: (e) => this.clickHandler(e), href: item.href }, item.text)));
        }), h("li", { key: 'b201285474d818da3a92c5182afe8d468cc9bb8e', class: "digi-navigation-breadcrumbs__item", "aria-current": "page" }, (_a = this.currentPage) !== null && _a !== void 0 ? _a : this.afCurrentPage), h("digi-util-mutation-observer", { key: '5fed828c087cb38c8e428f8343403f388d9c21c1', onAfOnChange: () => this.getBreadcrumbs(), ref: (el) => (this._observer = el), hidden: true }, h("slot", { key: 'beb32e05a1727e010ad5b169d6d335294ec4351b' })))));
    }
    static get is() { return "digi-navigation-breadcrumbs"; }
    static get encapsulation() { return "scoped"; }
    static get originalStyleUrls() {
        return {
            "$": ["navigation-breadcrumbs.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["navigation-breadcrumbs.css"]
        };
    }
    static get properties() {
        return {
            "afAriaLabel": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Set `aria-label` attribute on the nav element."
                        }],
                    "text": "S\u00E4tter attributet 'aria-label' p\u00E5 navelementet."
                },
                "getter": false,
                "setter": false,
                "attribute": "af-aria-label",
                "reflect": false,
                "defaultValue": "_t.breadcrumbs"
            },
            "afId": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Input id attribute. Defaults to random string."
                        }],
                    "text": "S\u00E4tter attributet 'id'. Om inget v\u00E4ljs s\u00E5 skapas ett slumpm\u00E4ssigt id."
                },
                "getter": false,
                "setter": false,
                "attribute": "af-id",
                "reflect": false,
                "defaultValue": "randomIdGenerator('digi-navigation-breadcrumbs')"
            },
            "afCurrentPage": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": true,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Set text for the active page"
                        }],
                    "text": "S\u00E4tter texten f\u00F6r den aktiva sidan"
                },
                "getter": false,
                "setter": false,
                "attribute": "af-current-page",
                "reflect": false
            }
        };
    }
    static get states() {
        return {
            "linkItems": {},
            "currentPage": {}
        };
    }
    static get events() {
        return [{
                "method": "afOnClick",
                "name": "afOnClick",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "The link elements' 'onclick' events."
                        }],
                    "text": "L\u00E4nkelementens 'onclick'-event."
                },
                "complexType": {
                    "original": "any",
                    "resolved": "any",
                    "references": {}
                }
            }];
    }
    static get elementRef() { return "hostElement"; }
    static get watchers() {
        return [{
                "propName": "afCurrentPage",
                "methodName": "onAfCurrentPage"
            }];
    }
}
