import { Host, h } from "@stencil/core";
/**
 * Display a simple row of selectable tabs. This is a controlled element.
 * The parent must adjust selectedTab as selection events are fired.
 *
 * ```ts
 * <verdocs-tabs tabs={[...tabs]} />
 * ```
 */
export class VerdocsTabs {
    constructor() {
        /**
         * The tabs to display
         */
        this.tabs = [];
        /**
         * The index of the tab to show selected.
         */
        this.selectedTab = 0;
    }
    handleSelectTab(index) {
        var _a;
        (_a = this.selectTab) === null || _a === void 0 ? void 0 : _a.emit({ tab: this.tabs[index], index });
    }
    render() {
        return (h(Host, { key: '6de4c126c0d4efe31e925569090af9dd032fae0c' }, this.tabs.map((tab, index) => (h("div", { class: `tab ${index === this.selectedTab ? 'active' : ''} ${tab.disabled ? 'disabled' : ''}`, onClick: tab.disabled ? () => { } : () => this.handleSelectTab(index) }, tab.label))), h("div", { key: 'a3aba39b6b1a758ea4ed7a87860108bbe9367565', class: "flex flex-1" }), h("slot", { key: '0bda7a4123dcab3d4aef3e65cadad14bcdba6312' }, h("div", { key: '7033a1cb8eefd67ae7c621bcd6a5c3b348d1b3fe' }))));
    }
    static get is() { return "verdocs-tabs"; }
    static get originalStyleUrls() {
        return {
            "$": ["verdocs-tabs.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["verdocs-tabs.css"]
        };
    }
    static get properties() {
        return {
            "tabs": {
                "type": "unknown",
                "attribute": "tabs",
                "mutable": false,
                "complexType": {
                    "original": "ITab[]",
                    "resolved": "ITab[]",
                    "references": {
                        "ITab": {
                            "location": "local",
                            "path": "/Users/chad/projects/verdocs/web-sdk/verdocs-web-sdk/src/components/controls/verdocs-tabs/verdocs-tabs.tsx",
                            "id": "src/components/controls/verdocs-tabs/verdocs-tabs.tsx::ITab"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "The tabs to display"
                },
                "getter": false,
                "setter": false,
                "defaultValue": "[]"
            },
            "selectedTab": {
                "type": "number",
                "attribute": "selected-tab",
                "mutable": false,
                "complexType": {
                    "original": "number",
                    "resolved": "number",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "The index of the tab to show selected."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "defaultValue": "0"
            }
        };
    }
    static get events() {
        return [{
                "method": "selectTab",
                "name": "selectTab",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Event fired when the user clicks a template to view it. Typically the host application will use this to navigate\nto the template preview. This is also fired when the user selects \"Preview/Send\" fropm the dropdown menu."
                },
                "complexType": {
                    "original": "{tab: ITab; index: number}",
                    "resolved": "{ tab: ITab; index: number; }",
                    "references": {
                        "ITab": {
                            "location": "local",
                            "path": "/Users/chad/projects/verdocs/web-sdk/verdocs-web-sdk/src/components/controls/verdocs-tabs/verdocs-tabs.tsx",
                            "id": "src/components/controls/verdocs-tabs/verdocs-tabs.tsx::ITab"
                        }
                    }
                }
            }];
    }
}
//# sourceMappingURL=verdocs-tabs.js.map
