// Angular
import { ContentChild, Directive, HostBinding, Input, TemplateRef } from '@angular/core';

// Style definitions
import { MenuEntry, MenuItemText } from './entities/menu-entry.model';

@Directive()
export abstract class PiBaseMenuComponent {
  @HostBinding('class') baseClassName = 'pi-menu pi-menu__parent';

  isMouseOver = false;

  @Input()
  label: string;

  _menuItems: Array<MenuEntry> = [];

  @Input()
  set menuItems(menuItems: MenuEntry[]) {
    this._menuItems = menuItems;
  }

  get menuItems(): MenuEntry[] {
    return this._menuItems;
  }

  /**
   * Parent Menu
   */
  @ContentChild('parentMenuTemplate', { static: false })
  parentMenuTemplateRef: TemplateRef<unknown> | undefined;

  /**
   * Children Menu (Level 1)
   */
  @ContentChild('childMenuTemplate', { static: false })
  childMenuTemplateRef: TemplateRef<unknown> | undefined;

  /**
   * Additional Children Menu (Level 1)
   */
  @ContentChild('childAsideMenuTemplate', { static: false })
  childAsideMenuTemplateRef: TemplateRef<unknown> | undefined;

  /**
   * Additional Children Menu (Level 1)
   */
  @ContentChild('asideMenuTemplate', { static: false })
  asideMenuTemplateRef: TemplateRef<unknown> | undefined;

  trackByFn(index: number, item: MenuEntry): MenuItemText | string | undefined {
    return item.label;
  }
}