import { SVGIcon } from "@progress/kendo-react-common";
import { CSSProperties, ReactNode } from "react";
import { MenuSelectEvent as KendoMenuSelectEvent } from "@progress/kendo-react-layout";

export interface MenuItemModel {
  contentRender?: ReactNode;
  cssClass?: string;
  cssStyle?: CSSProperties;
  data?: any;
  disabled?: boolean;
  icon?: string;
  items?: MenuItemModel[];
  linkRender?: ReactNode;
  render?: ReactNode;
  svgIcon?: SVGIcon;
  text?: string;
  url?: string;
}

export interface MenuProps {
  dataTestId?: string;
  children?: React.ReactNode;
  className?: string;
  customCloseItemIds?: string[];
  dir?: string;
  hoverCloseDelay?: number;
  hoverOpenDelay?: number;
  itemRender?: any;
  items?: MenuItemModel[];
  linkRender?: any;
  openOnClick?: boolean;
  style?: React.CSSProperties;
  vertical?: boolean;
  onSelect?: (event: KendoMenuSelectEvent) => void;
}

export interface MenuSelectEvent {
  item: MenuItemModel;
  itemId: string;
  nativeEvent: any;
  syntheticEvent: React.SyntheticEvent;
  target: Menu;
}

export interface Menu {
  element: null | HTMLDivElement;
  props: Readonly<MenuProps>;
}