import { h } from "@stencil/core";
import { NavLinkItem } from "./bal-nav-link-item";
import { NavMenuLinkItem } from "./bal-nav-menu-link-item";
import { AccordionButton } from "../components/accordion-button";
import { OverviewLink } from "../components/overview-link";
import { BEM } from "../../../utils/bem";
export class NavMetaLinkItem extends NavLinkItem {
  constructor(item, observer) {
    super(item, observer);
    this.mainLinkItems = [];
    this.id = `nav-meta-link-item-${NavMetaLinkItemIDs++}`;
    this.value = item.value || this.id;
    this.mainLinkItems = (item.mainLinkItems || []).map(item => new NavMenuLinkItem(item, observer));
    this.overviewLink = item.overviewLink ? new NavLinkItem(item.overviewLink, observer) : undefined;
  }
  get type() {
    return 'NavMetaLinkItem';
  }
  renderTouch(context) {
    const block = BEM.block('nav');
    const isSelected = (context === null || context === void 0 ? void 0 : context.activeMetaLinkValue) === this.value;
    return (h("li", null, h(AccordionButton, { id: this.id, level: "meta", label: this.label, open: isSelected, link: this.isLink, href: this.href, target: this.target, onClick: ev => this.onAccordionClick(ev) }), isSelected ? h(OverviewLink, { item: this.overviewLink, onClick: ev => this.onClick(ev) }) : '', isSelected ? (h("hr", { class: Object.assign(Object.assign({}, block.element('line').class()), block.element('line').modifier('up').class()) })) : (''), isSelected && this.mainLinkItems && this.mainLinkItems.length > 0 ? (h("ul", { class: Object.assign({}, block.element('mobile-menu-list').class()) }, this.mainLinkItems.map(item => item.renderTouch({
      activeMetaLinkValue: context.activeMetaLinkValue,
      activeMenuLinkValue: context.activeMenuLinkValue,
    })))) : (''), h("hr", { class: Object.assign({}, block.element('line').class()) })));
  }
  render() {
    if (this.isLink) {
      return h("bal-tab-item", { label: this.label, value: this.value, href: this.href, target: this.target });
    }
    return (h("bal-tab-item", { label: this.label, value: this.value, onBalNavigate: ev => {
        if (this.onClick) {
          this.onClick(ev.detail);
        }
      } }));
  }
}
let NavMetaLinkItemIDs = 0;
