import { h } from "@stencil/core";
import Tabs from "@ecl/tabs";
export class EclTabs {
    constructor() {
        this.styleClass = '';
        this.noScript = false;
        this.colorMode = '';
        this.prevLabel = 'Previous';
        this.nextLabel = 'Next';
        this.moreLabel = 'Show %d more items';
        this.withoutContent = false;
    }
    getClass() {
        const styleClasses = [
            `ecl-tabs`,
            this.styleClass
        ];
        if (this.colorMode) {
            styleClasses.push(`ecl-color-mode--${this.colorMode}`);
        }
        return styleClasses.join(' ');
    }
    componentWillLoad() {
        var _a;
        this.theme = (_a = document.documentElement.getAttribute('data-ecl-theme')) !== null && _a !== void 0 ? _a : (this.theme || 'ec');
    }
    componentDidLoad() {
        if (!this.noScript) {
            ;
            window.ECL = window.ECL || {};
            ECL.Tabs = Tabs;
            const tabs = new Tabs(this.el.firstElementChild);
            tabs.init();
        }
    }
    render() {
        return (h("div", Object.assign({ key: 'e74a295ffcf5296a8c523f33c06b2314536f8f8d', class: this.getClass() }, (!this.withoutContent ? { 'data-ecl-tabs-with-content': '' } : {})), h("div", { key: 'edbede2d082bc426387d50f42ee6badd0b601efb', class: "ecl-tabs__container" }, h("div", { key: 'c70951ea2e2dc5b17b4be9c731d8882ef75942cf', class: "ecl-tabs__list", role: "tablist" }, h("slot", { key: '4e6718cd25515bbedb10aecd1e0927100fe63087' }), h("div", { key: 'f81daca3f7baa4bef380a42e2fe7e1077c7ec0fe', class: "ecl-tabs__item ecl-tabs__item--more" })), h("ecl-button", { key: 'a90a8d805ed96f50d584eba340b6094be76abb8b', "style-class": `ecl-tabs__toggle sc-ecl-tabs-${this.theme}`, variant: "tertiary", type: "button", tabindex: "-1" }, this.moreLabel, h("ecl-icon", { key: '5d3fd197c5b73fe1d1d48bb8631820e0a97defd9', slot: "icon-after", icon: "corner-arrow", size: "fluid", rotate: "180" }))), h("div", { key: 'e12c4ce988d9c032396a88405049a0ec73f2db28', class: "ecl-tabs__controls" }, h("ecl-button", { key: '55e045a1c54cb0952d59b8f920a70711a94c7ded', variant: "tertiary", type: "button", "hide-label": true, "style-class": `ecl-tabs__prev ecl-tabs__item--hidden sc-ecl-tabs-${this.theme}` }, this.prevLabel, h("ecl-icon", { key: 'acfcbf1684a553c6f37b79304853f360b893c80c', slot: "icon-after", icon: "corner-arrow", size: "s", rotate: "270" })), h("ecl-button", { key: '5c029232ff70cf6232f5f9fba5d4fbd2fc3e02b0', variant: "tertiary", type: "button", "hide-label": true, "style-class": `ecl-tabs__next ecl-tabs__item--hidden sc-ecl-tabs-${this.theme}` }, this.nextLabel, h("ecl-icon", { key: '40a21e98d9b6ce39c3850cff64d93a04c49586a3', slot: "icon-after", icon: "corner-arrow", size: "s", rotate: "90" })))));
    }
    static get is() { return "ecl-tabs"; }
    static get encapsulation() { return "scoped"; }
    static get originalStyleUrls() {
        return {
            "ec": ["./build/styles/ecl-tabs-ec.css"],
            "eu": ["./build/styles/ecl-tabs-eu.css"]
        };
    }
    static get styleUrls() {
        return {
            "ec": ["build/styles/ecl-tabs-ec.css"],
            "eu": ["build/styles/ecl-tabs-eu.css"]
        };
    }
    static get properties() {
        return {
            "styleClass": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "style-class",
                "defaultValue": "''"
            },
            "noScript": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "no-script",
                "defaultValue": "false"
            },
            "theme": {
                "type": "string",
                "mutable": true,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "theme"
            },
            "colorMode": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "color-mode",
                "defaultValue": "''"
            },
            "prevLabel": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "prev-label",
                "defaultValue": "'Previous'"
            },
            "nextLabel": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "next-label",
                "defaultValue": "'Next'"
            },
            "moreLabel": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "more-label",
                "defaultValue": "'Show %d more items'"
            },
            "withoutContent": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "without-content",
                "defaultValue": "false"
            }
        };
    }
    static get elementRef() { return "el"; }
}
