import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';

const pdsTabpanelCss = ":host{display:block}.pds-tabpanel{display:none;margin-top:var(--spacing-panel-margin-top);padding:var(--spacing-panel-padding)}.pds-tabpanel.is-active{display:block}";
const PdsTabpanelStyle0 = pdsTabpanelCss;

const PdsTabpanel$1 = /*@__PURE__*/ proxyCustomElement(class PdsTabpanel extends HTMLElement {
    constructor() {
        super();
        this.__registerHost();
        this.name = undefined;
        this.parentComponentId = undefined;
        this.variant = undefined;
        this.selected = false;
    }
    render() {
        return (h(Host, { key: 'b071d63a6211e70b09f11a18609d15728eb485c6', slot: "tabpanels" }, h("div", { key: 'ab8de65d7142136888c853170b7b8b190f21abcc', role: "tabpanel", id: this.parentComponentId + "__" + this.name + '-panel', tabindex: "0", "aria-labelledby": this.parentComponentId + "__" + this.name, class: this.selected ? "pds-tabpanel is-active" : "pds-tabpanel" }, h("slot", { key: '0cac8366d5502be7033d1b71b681bf564aa557e8' }))));
    }
    get el() { return this; }
    static get style() { return PdsTabpanelStyle0; }
}, [4, "pds-tabpanel", {
        "name": [1],
        "parentComponentId": [1, "parent-component-id"],
        "variant": [1],
        "selected": [1028]
    }]);
function defineCustomElement$1() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["pds-tabpanel"];
    components.forEach(tagName => { switch (tagName) {
        case "pds-tabpanel":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, PdsTabpanel$1);
            }
            break;
    } });
}

const PdsTabpanel = PdsTabpanel$1;
const defineCustomElement = defineCustomElement$1;

export { PdsTabpanel, defineCustomElement };

//# sourceMappingURL=pds-tabpanel.js.map