'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-a0b63bee.js');

const SubmenuComponent = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
    }
    handleExpanded(expanded) {
        if (expanded) {
            this.submenuElement.style.maxHeight = 'fit-content';
        }
        else {
            this.submenuElement.style.maxHeight = '';
        }
        const subHeight = this.submenuElement.scrollHeight;
        this.onChildExpanded(expanded, subHeight);
    }
    render() {
        if (!this.childRoute.children || this.childRoute.children.length === 0) {
            return (index.h("li", { key: this.childRoute.path }, index.h("tab-link", { text: this.childRoute.name, link: `${this.route.path}${this.childRoute.path}`, level: this.childRoute.level, type: "child", icon: this.childRoute.icon, badge: this.childRoute.badge, disabled: this.childRoute.disabled })));
        }
        return (index.h("li", { key: this.childRoute.path }, index.h("tab-link", { text: this.childRoute.name, link: `${this.route.path}${this.childRoute.path}`, type: "parent", icon: this.childRoute.icon, disabled: this.childRoute.disabled, onExpand: this.handleExpanded.bind(this) }), index.h("ul", { class: "sidepanel__submenu-list", ref: el => (this.submenuElement = el) }, this.childRoute.children.map((subSubRoute, index$1) => (index.h("submenu-component", { key: index$1, route: this.route, childRoute: subSubRoute }))))));
    }
};

const TabLink = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        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 (index.h("a", Object.assign({ href: this.link }, commonProps, { tabindex: "0" }), this.icon && index.h("span", { class: "sidepanel__menu-tab-icon" }, index.h("dga-icon-v2", Object.assign({}, this.icon))), index.h("span", { class: "sidepanel__menu-tab-label" }, this.text), this.type === 'parent' && (index.h("span", { class: "sidepanel__menu-tab-arrow" }, index.h("i", { class: "hgi-stroke hgi-arrow-down-01", style: { fontSize: '16px' } }), " ")), this.badge !== undefined && index.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 (index.h("a", Object.assign({ href: "#" }, commonProps, { onClick: e => this.toggleTab(e), tabindex: "0" }), this.icon && index.h("span", { class: "sidepanel__menu-tab-icon" }, index.h("dga-icon-v2", Object.assign({}, this.icon))), index.h("span", { class: "sidepanel__menu-tab-label" }, this.text), index.h("span", { class: "sidepanel__menu-tab-arrow" }, index.h("i", { class: "hgi-stroke hgi-arrow-down-01", style: { fontSize: '16px' } }), " "), this.badge !== undefined && index.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 (index.h("stencil-route-link", Object.assign({ url: this.link }, commonProps, { tabindex: "0" }), this.icon && index.h("span", { class: "sidepanel__menu-tab-icon" }, index.h("dga-icon-v2", Object.assign({}, this.icon))), index.h("span", { class: "sidepanel__menu-tab-label" }, this.text), this.badge !== undefined && index.h("dga-tag", { color: this.onColor ? 'on-color' : 'gray', label: this.badge >= 100 ? '+99' : this.badge.toString(), size: "sm" })));
    }
};

exports.submenu_component = SubmenuComponent;
exports.tab_link = TabLink;

//# sourceMappingURL=submenu-component_2.cjs.entry.js.map