import { p as proxyCustomElement, H, h } from './p-604af0ee.js';
import { d as defineCustomElement$2 } from './p-115ed7c3.js';
import { d as defineCustomElement$1 } from './p-42103fc2.js';

const TabLink = /*@__PURE__*/ proxyCustomElement(class TabLink extends H {
    constructor() {
        super();
        this.__registerHost();
        this.type = 'parent';
        this.onColor = false;
        this.level = 1;
        this.externalLink = false;
        this.text = 'link';
        this.link = '/pages';
        this.expanded = false;
        this.disabled = false;
        this.isExpanded = this.expanded;
    }
    toggleTab(e) {
        var _a;
        if (this.type === 'parent') {
            e.preventDefault();
            this.isExpanded = !this.isExpanded;
            (_a = this.onExpand) === null || _a === void 0 ? void 0 : _a.call(this, this.isExpanded);
        }
    }
    handleMouseEvents(event) {
        const method = event === 'add' ? 'add' : 'remove';
        this.tabRef.classList[method]('pressed');
    }
    render() {
        const commonProps = {
            class: `${this.type === 'parent' ? 'sidepanel__menu-tab' : 'sidepanel__submenu-tab'} 
              ${this.level > 1 ? 'sidepanel__submenu--sublevel' : ''} 
              ${this.disabled ? 'disabled' : ''} 
              ${this.isExpanded ? 'active' : ''}`,
            onMouseDown: () => this.handleMouseEvents('add'),
            onMouseUp: () => this.handleMouseEvents('remove'),
            onMouseOut: () => this.handleMouseEvents('remove'),
            //   ref: (el: HTMLElement) => (this.tabRef = el),
            ref: el => (this.tabRef = el),
        };
        // External link case
        if (this.externalLink) {
            return (h("a", Object.assign({ href: this.link }, commonProps, { tabindex: "0" }), this.icon && h("span", { class: "sidepanel__menu-tab-icon" }, h("dga-icon-v2", Object.assign({}, this.icon))), h("span", { class: "sidepanel__menu-tab-label" }, this.text), this.type === 'parent' && (h("span", { class: "sidepanel__menu-tab-arrow" }, h("i", { class: "hgi-stroke hgi-arrow-down-01", style: { fontSize: '16px' } }), " ")), this.badge !== undefined && h("dga-tag", { color: this.onColor ? 'on-color' : 'gray', label: this.badge >= 100 ? '+99' : this.badge.toString(), size: "sm" })));
        }
        // Parent tab case
        if (this.type === 'parent') {
            console.log(this.icon, "this.iconthis.icon");
            return (h("a", Object.assign({ href: "#" }, commonProps, { onClick: e => this.toggleTab(e), tabindex: "0" }), this.icon && h("span", { class: "sidepanel__menu-tab-icon" }, h("dga-icon-v2", Object.assign({}, this.icon))), h("span", { class: "sidepanel__menu-tab-label" }, this.text), h("span", { class: "sidepanel__menu-tab-arrow" }, h("i", { class: "hgi-stroke hgi-arrow-down-01", style: { fontSize: '16px' } }), " "), this.badge !== undefined && h("dga-tag", { color: this.onColor ? 'on-color' : 'gray', label: this.badge >= 100 ? '+99' : this.badge.toString(), size: "sm" })));
        }
        // Child tab case (regular link)
        return (h("stencil-route-link", Object.assign({ url: this.link }, commonProps, { tabindex: "0" }), this.icon && h("span", { class: "sidepanel__menu-tab-icon" }, h("dga-icon-v2", Object.assign({}, this.icon))), h("span", { class: "sidepanel__menu-tab-label" }, this.text), this.badge !== undefined && h("dga-tag", { color: this.onColor ? 'on-color' : 'gray', label: this.badge >= 100 ? '+99' : this.badge.toString(), size: "sm" })));
    }
}, [0, "tab-link", {
        "type": [1],
        "onColor": [4, "on-color"],
        "level": [2],
        "badge": [2],
        "icon": [16],
        "externalLink": [4, "external-link"],
        "text": [1],
        "link": [1],
        "expanded": [4],
        "onExpand": [16],
        "disabled": [4],
        "isExpanded": [32]
    }]);
function defineCustomElement() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["tab-link", "dga-icon-v2", "dga-tag"];
    components.forEach(tagName => { switch (tagName) {
        case "tab-link":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, TabLink);
            }
            break;
        case "dga-icon-v2":
            if (!customElements.get(tagName)) {
                defineCustomElement$2();
            }
            break;
        case "dga-tag":
            if (!customElements.get(tagName)) {
                defineCustomElement$1();
            }
            break;
    } });
}

export { TabLink as T, defineCustomElement as d };

//# sourceMappingURL=p-66861708.js.map