import { Host, h } from "@stencil/core";
import { onComponentRequiredPropUndefined } from "../../utils/helpers";
export class TabGroup {
    constructor() {
        /**
         * If `true`, the tabs and tab panels will be positioned separately.
         */
        this.inline = false;
        /** @internal Determines whether black variant of the tabs should be displayed. */
        this.monochrome = false;
        /** @internal Determines whether the light or dark variant of the tabs should be displayed. */
        this.theme = "inherit";
    }
    componentDidLoad() {
        onComponentRequiredPropUndefined([{ prop: this.label, propName: "label" }], "Tab Group");
    }
    render() {
        const { inline, theme, label, monochrome } = this;
        return (h(Host, { key: 'd4354a73edcfe5ed044e2acf6d04256eddcb7f40', role: "tablist", "aria-label": label, class: {
                ["ic-tab-group-inline"]: !!inline,
                [`ic-theme-${theme}`]: theme !== "inherit",
                ["ic-tab-group-monochrome"]: !!monochrome,
            } }, h("ic-horizontal-scroll", { key: '42cf7391e17b38a3489e77bc3d882aa31902c14a', theme: theme, "focus-trigger": "tabFocus", monochrome: monochrome }, h("div", { key: '81270d7ad5567b23ab8098679705c3818b3bfd35', class: "tabs-container" }, h("slot", { key: 'ee7b2ece3edc06146170b759f2c08e22bca9fc7f' })))));
    }
    static get is() { return "ic-tab-group"; }
    static get encapsulation() { return "shadow"; }
    static get delegatesFocus() { return true; }
    static get originalStyleUrls() {
        return {
            "$": ["ic-tab-group.css"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["ic-tab-group.css"]
        };
    }
    static get properties() {
        return {
            "inline": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "If `true`, the tabs and tab panels will be positioned separately."
                },
                "getter": false,
                "setter": false,
                "attribute": "inline",
                "reflect": true,
                "defaultValue": "false"
            },
            "label": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": true,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "The label to describe the purpose of the set of tabs to screen reader users."
                },
                "getter": false,
                "setter": false,
                "attribute": "label",
                "reflect": false
            },
            "monochrome": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean | undefined",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [{
                            "name": "internal",
                            "text": "Determines whether black variant of the tabs should be displayed."
                        }],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "attribute": "monochrome",
                "reflect": false,
                "defaultValue": "false"
            },
            "theme": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "IcThemeMode",
                    "resolved": "\"dark\" | \"inherit\" | \"light\" | undefined",
                    "references": {
                        "IcThemeMode": {
                            "location": "import",
                            "path": "../../utils/types",
                            "id": "src/utils/types.ts::IcThemeMode"
                        }
                    }
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [{
                            "name": "internal",
                            "text": "Determines whether the light or dark variant of the tabs should be displayed."
                        }],
                    "text": ""
                },
                "getter": false,
                "setter": false,
                "attribute": "theme",
                "reflect": false,
                "defaultValue": "\"inherit\""
            }
        };
    }
}
//# sourceMappingURL=ic-tab-group.js.map
