/// <reference types="react" />

import * as React from "react";

interface HTMLAttributesWeak extends React.HTMLAttributes<HTMLElement> {
  onClick?: any;
}

export interface ItemProps extends HTMLAttributesWeak {
  /**
   * 样式类名的品牌前缀
   */
  prefix?: string;

  /**
   * 自定义类名
   */
  className?: string;

  /**
   * 自定义内联样式
   */
  style?: React.CSSProperties;

  /**
   * 显示在菜单右侧的帮助文本，通常用于一些附加信息
   */
  helper?: string;

  /**
   * 禁用当前菜单项, 被禁用不会触发事件, 也无法选中Checkbox/Radio
   */
  disabled?: boolean;

  /**
   * 当前的菜单项是否被选中, 优先级比Menu传入的selectedKeys要高
   */
  selected?: boolean;

  /**
   * 点击了菜单项触发的事件
   */
  onClick?: (key: string, e: any) => void;

  /**
   * 是否显示选中图标
   */
  hasSelectedIcon?: boolean;

  /**
   * 是否显示缩进
   */
  needIndent?: boolean;
}

export class Item extends React.Component<ItemProps, any> {}

export interface SubMenuProps extends React.HTMLAttributes<HTMLElement> {
  /**
   * 样式类名的品牌前缀
   */
  prefix?: string;

  /**
   * 自定义类名
   */
  className?: string;

  /**
   * 自定义内联样式
   */
  style?: React.CSSProperties;

  /**
   * 子菜单的标签
   */
  label?: any;

  /**
   * 设置子菜单表现的形式
   */
  mode?: "inline" | "popup";

  /**
   * 设置子菜单显示触发的类型
   */
  triggerType?: "click" | "hover";

  /**
   * 设置子菜单的label是否可以被选中
   */
  selectable?: boolean;

  /**
   * 设置子菜单的跟随类型
   */
  align?: "outside" | "follow";
}

export class SubMenu extends React.Component<SubMenuProps, any> {}

export interface GroupProps extends React.HTMLAttributes<HTMLElement> {
  /**
   * 样式类名的品牌前缀
   */
  prefix?: string;

  /**
   * 自定义类名
   */
  className?: string;

  /**
   * 自定义内联样式
   */
  style?: React.CSSProperties;

  /**
   * 分组的标签
   */
  label?: any;
}

export class Group extends React.Component<GroupProps, any> {}

export interface DividerProps extends React.HTMLAttributes<HTMLElement> {
  /**
   * 样式类名的品牌前缀
   */
  prefix?: string;

  /**
   * 自定义类名
   */
  className?: string;

  /**
   * 自定义内联样式
   */
  style?: React.CSSProperties;
}

export class Divider extends React.Component<DividerProps, any> {}

export interface PopupItemProps extends React.HTMLAttributes<HTMLElement> {
  /**
   * 样式类名的品牌前缀
   */
  prefix?: string;

  /**
   * 自定义类名
   */
  className?: string;

  /**
   * 自定义内联样式
   */
  style?: React.CSSProperties;

  /**
   * 禁用当前菜单项, 被禁用不会触发事件
   */
  disabled?: boolean;

  /**
   * 菜单项的标签
   */
  label?: any;

  /**
   * 是否自动让弹出层的宽度和菜单项保持一致，逻辑是如果弹出层的宽度比菜单项小的话和菜单项保持一致，如果宽度大于菜单项则不做处理
   */
  autoWidth?: boolean;
}

export class PopupItem extends React.Component<PopupItemProps, any> {}

interface HTMLAttributesWeak extends React.HTMLAttributes<HTMLElement> {
  onClick?: any;
  onChange?: any;
}

export interface RadioItemProps extends HTMLAttributesWeak {
  /**
   * 样式类名的品牌前缀
   */
  prefix?: string;

  /**
   * 自定义类名
   */
  className?: string;

  /**
   * 自定义内联样式
   */
  style?: React.CSSProperties;

  /**
   * 显示在菜单右侧的帮助文本，通常用于一些附加信息
   */
  helper?: string;

  /**
   * 禁用当前菜单项, 被禁用不会触发事件, 也无法选中Checkbox/Radio
   */
  disabled?: boolean;

  /**
   * 点击了菜单项触发的事件
   */
  onClick?: (key: string, e: any) => void;

  /**
   * 是否显示缩进
   */
  needIndent?: boolean;

  /**
   * 当前的菜单项是否被选中, 优先级比Menu传入的selectedKeys要高
   */
  checked?: boolean;

  /**
   * 选择被改变的时候触发的事件
   */
  onChange?: (checked: boolean) => void;
}

export class RadioItem extends React.Component<RadioItemProps, any> {}

interface HTMLAttributesWeak extends React.HTMLAttributes<HTMLElement> {
  onClick?: any;
  onChange?: any;
}

export interface CheckboxItemProps extends HTMLAttributesWeak {
  /**
   * 样式类名的品牌前缀
   */
  prefix?: string;

  /**
   * 自定义类名
   */
  className?: string;

  /**
   * 自定义内联样式
   */
  style?: React.CSSProperties;

  /**
   * 显示在菜单右侧的帮助文本，通常用于一些附加信息
   */
  helper?: string;

  /**
   * 禁用当前菜单项, 被禁用不会触发事件, 也无法选中Checkbox/Radio
   */
  disabled?: boolean;

  /**
   * 点击了菜单项触发的事件
   */
  onClick?: (key: string, e: any) => void;

  /**
   * 是否显示缩进
   */
  needIndent?: boolean;

  /**
   * 当前的菜单项是否被选中, 优先级比Menu传入的selectedKeys要高
   */
  checked?: boolean;

  /**
   * 选择被改变的时候触发的事件
   */
  onChange?: (checked: boolean) => void;
}

export class CheckboxItem extends React.Component<CheckboxItemProps, any> {}
interface HTMLAttributesWeak extends React.HTMLAttributes<HTMLElement> {
  onClick?: any;
  onSelect?: any;
}

export interface MenuProps extends HTMLAttributesWeak {
  /**
   * 样式类名的品牌前缀
   */
  prefix?: string;

  /**
   * 自定义类名
   */
  className?: string;

  /**
   * 自定义内联样式
   */
  style?: React.CSSProperties;

  /**
   * 点击菜单项触发的事件
   */
  onClick?: (selectedKeys: Array<any>, menuItem: any, meta: {}) => void;

  /**
   * 当前选中的菜单项, 设置此属性，组件的选中变为受控状态
   */
  selectedKeys?: Array<any>;

  /**
   * 初始化选中的菜单项，只在组件初次render的时候生效
   */
  defaultSelectedKeys?: Array<any>;

  /**
   * 菜单选择的模式，支持单选和多选
   */
  selectMode?: "single" | "multiple";

  /**
   * 选中/取消选中了任意MenuItem
   */
  onSelect?: (selectedKeys: Array<any>, menuItem: any, meta: {}) => void;

  /**
   * 取消选中的菜单项
   */
  onDeselect?: (selectedKey: string) => void;

  /**
   * 如果此属性为true，表明只会选中第一级的菜单
   */
  shallowSelect?: boolean;

  /**
   * 当前打开的菜单项，设置此属性，组件的打开变为受控状态
   */
  openKeys?: Array<any>;

  /**
   * 初始化打开的菜单项，只在组件初次render的时候生效
   */
  defaultOpenKeys?: Array<any>;

  /**
   * 子菜单同时打开模式，是多个还是一个
   */
  openMode?: "single" | "multiple";

  /**
   * 打开子菜单的时候触发的事件
   */
  onOpen?: (openKeys: Array<any>) => void;

  /**
   * 级联菜单下面缩进的尺寸
   */
  indentSize?: number;

  /**
   * 配置菜单的头部
   */
  header?: any;

  /**
   * 配置菜单的底部
   */
  footer?: any;

  /**
   * 是否启用多列模式
   */
  multipleCol?: boolean;

  /**
   * 是否启用设置焦点功能
   */
  autoFocus?: boolean;

  /**
   * 菜单的方向
   */
  direction?: "ver" | "hoz";
}

export default class Menu extends React.Component<MenuProps, any> {
  static Item: typeof Item;
  static SubMenu: typeof SubMenu;
  static Group: typeof Group;
  static Divider: typeof Divider;
  static PopupItem: typeof PopupItem;
  static RadioItem: typeof RadioItem;
  static CheckboxItem: typeof CheckboxItem;
}