import { Host, h } from "@stencil/core";
export class SpwBreadcrumbItem {
    constructor() {
        /** Permet de définir un lien sur l'élément du breadcrumb */
        this.href = '';
        this.surface = 'light';
    }
    surfaceChanged() {
        this.updateSurfaceClass();
    }
    componentWillLoad() {
        this.getSurfaceFromParent();
    }
    getSurfaceFromParent() {
        let parent = this.el.parentElement;
        while (parent) {
            if (parent.tagName.toLowerCase() === 'spw-breadcrumb') {
                this.surface = parent.getAttribute('surface');
                if (!this.surface) {
                    this.surface = 'light';
                }
                this.updateSurfaceClass();
                break;
            }
            if (parent.shadowRoot) {
                parent = parent.shadowRoot.host;
            }
            else {
                parent = parent.parentElement;
            }
        }
    }
    updateSurfaceClass() {
        this.el.classList.remove('spw-breadcrumb-item--light', 'spw-breadcrumb-item--dark');
        this.el.classList.add(`spw-breadcrumb-item--${this.surface}`);
    }
    render() {
        return (h(Host, { key: '68661d36076f8e2ded2e0d3d438157e4bf5eeba7' }, h("div", { key: '9bbabf1f3d7a3d5655b08670e4f021adc48c50c3', role: "listitem", class: `spw-breadcrumb-item spw-breadcrumb-item--${this.surface}` }, this.href ? (h("spw-link", { href: this.href, surface: this.surface }, h("slot", null))) : (h("span", { class: "spw-breadcrumb-item__text", "aria-current": "page" }, h("slot", null))))));
    }
    static get is() { return "spw-breadcrumb-item"; }
    static get encapsulation() { return "shadow"; }
    static get originalStyleUrls() {
        return {
            "$": ["spw-breadcrumb-item.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["spw-breadcrumb-item.css"]
        };
    }
    static get properties() {
        return {
            "href": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Permet de d\u00E9finir un lien sur l'\u00E9l\u00E9ment du breadcrumb"
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "href",
                "defaultValue": "''"
            }
        };
    }
    static get states() {
        return {
            "surface": {}
        };
    }
    static get elementRef() { return "el"; }
    static get watchers() {
        return [{
                "propName": "surface",
                "methodName": "surfaceChanged"
            }];
    }
}
