/* ===================== AUTOGENERATED SOURCE IMPORT ===================== */

import Template from "/emcJS/util/html/template/HTMLTemplate.js";

const TPL = new Template(`
    <slot id="target"></slot>
`);

import GlobalStyle from "/emcJS/util/html/template/CSSTemplate.js";

const STYLE = new GlobalStyle(`
    :host {
        display: inline-flex;
        pointer-events: none;
        user-select: none;
        align-items: center;
        justify-content: center;
        line-height: normal;
    }
    
    :host(.header) {
        margin: 5px 0px 2px;
        font-size: 1.5em;
    }
    
    #target {
        display: inline;
        overflow: inherit;
        text-overflow: inherit;
    }
    
`);

/* ======================================================================= */

import CustomElement from "../element/CustomElement.js";
import I18nMixin from "../mixin/I18nMixin.js";

export default class I18nLabel extends I18nMixin(CustomElement) {

    constructor() {
        super();
        this.shadowRoot.append(TPL.generate());
        STYLE.apply(this.shadowRoot);
    }

    set i18nValue(val) {
        if (val != null) {
            this.setAttribute("i18n-value", val);
        } else {
            this.removeAttribute("i18n-value");
        }
    }

    get i18nValue() {
        return this.getAttribute("i18n-value") || "";
    }

    static get i18nObservedAttributes() {
        return ["i18n-value"];
    }

    applyI18n(key, value) {
        switch (key) {
            case "i18n-value": {
                this.innerText = value;
            } break;
        }
    }

    static getLabel(label) {
        if (label instanceof I18nLabel) {
            return label;
        } else if (label instanceof HTMLElement) {
            const el = document.createElement("emc-i18n-label");
            el.i18nValue = label.innerText;
            return el;
        } else if (typeof label === "function") {
            return I18nLabel.getLabel(label());
        } else if (typeof label !== "object") {
            const el = document.createElement("emc-i18n-label");
            el.i18nValue = label;
            return el;
        }
        return document.createElement("emc-i18n-label");
    }

    get comparatorText() {
        return this.innerText;
    }

}

customElements.define("emc-i18n-label", I18nLabel);
