import * as React from 'react';
import { OmitPolyfill } from '../common';

export type SidebarSubMenuWithAsProp<T> =
  | SidebarSubMenuAsButtonProps<T>
  | SidebarSubMenuAsAnchorProps<T>
  | SidebarSubMenuGenericProps<T>
  | SidebarSubMenuAsComponentProps<T>;

type SidebarSubMenuAsButtonProps<T> = React.ButtonHTMLAttributes<HTMLButtonElement> &
  T & {
    as?: 'button';
    onClick?: React.MouseEventHandler<HTMLButtonElement>;
  };

type SidebarSubMenuAsAnchorProps<T> = React.AnchorHTMLAttributes<HTMLAnchorElement> &
  T & {
    as: 'a';
    onClick?: React.MouseEventHandler<HTMLAnchorElement>;
  };

type SidebarSubMenuGenericProps<T> = T & {
  as: keyof OmitPolyfill<HTMLElementTagNameMap, 'a' | 'button'>;
  onClick?: React.MouseEventHandler<HTMLElement>;
  [additionalProps: string]: any;
};

type SidebarSubMenuAsComponentProps<T> = T & {
  as: React.ComponentType<any>;
  onClick?: React.MouseEventHandler<HTMLElement>;
  [additionalProps: string]: any;
};

export type SidebarSubMenuNextProps = SidebarSubMenuWithAsProp<{
  dataHook?: string;
  className?: string;
  disabled?: boolean;
  itemKey?: string;
}>

export default class SidebarSubMenuNext extends React.PureComponent<SidebarSubMenuNextProps>{}