/**
 *
 * TabMenu is a navigation component that displays items as tab headers. Example below uses nested routes with TabMenu.
 *
 * [Live Demo](https://www.WangsVue.org/tabmenu/)
 *
 * @module tabmenu
 *
 */

import { TabMenuProps as WangsUITabMenuProps } from '@wangs-ui/core';

import { MenuItem } from '../menuitem';
import { ClassComponent } from '../ts-helpers.d';

/**
 * Custom change event.
 * @see {@link TabMenuEmits['tab-change']}
 */
export interface TabMenuChangeEvent {
  /**
   * Browser event
   */
  originalEvent: Event;
  /**
   * Index of the selected tab
   */
  index: number;
}

/**
 * Defines valid router binding props in TabMenu component.
 */
export interface TabMenuRouterBindProps {
  /**
   * Action element binding
   */
  action: object;
  /**
   * Icon element binding
   */
  icon: object;
  /**
   * Label element binding
   */
  label: object;
}

/**
 * Defines valid properties in TabMenu component.
 */
export interface TabMenuProps extends WangsUITabMenuProps {
  /**
   * An array of menuitems.
   */
  menu?: MenuItem[] | undefined;
  /**
   * Defines type of TabMenu.
   * @defaultValue 'tab'
   */
  type?: 'tab' | 'pill' | 'segmented';
  /**
   * Active index of menuitem.
   * @defaultValue 0
   */
  activeIndex?: number | undefined;
  /**
   * Whether to use trailing line at the end of tab menu.
   * @defaultValue true - when type is tab, otherwise true
   */
  useTrailingLine?: boolean | undefined;
}

/**
 * Defines valid emits in TabMenu component.
 */
export type TabMenuEmits = {
  /**
   * Callback to invoke when an active tab is changed.
   * @param {TabMenuChangeEvent} event - Custom tab change event.
   */
  'tabChange': [event: TabMenuChangeEvent];
  'update:activeIndex': [index: number];
};

/**
 * **WangsVue - TabMenu**
 *
 * _TabMenu is a navigation component that displays items as tab headers. Example below uses nested routes with TabMenu._
 *
 * [Live Demo](https://www.WangsVue.org/tabmenu/)
 * --- ---
 * ![WangsVue](https://primefaces.org/cdn/WangsVue/images/logo-100.png)
 *
 * @group Component
 *
 */
declare class TabMenu extends ClassComponent<
  TabMenuProps,
  unknown,
  TabMenuEmits
> {}

export default TabMenu;