import React from "react";

export interface ListBoxProps {
  dataTestId?: string;
  className?: string;
  data: any[];
  draggable?: boolean;
  item?: React.ComponentType<any>;
  selectedField?: string;
  size?: null | "small" | "medium" | "large";
  style?: React.CSSProperties;
  textField: string;
  toolbar?: null | React.ComponentType<any>;
  toolbarPosition?: string;
  valueField?: string;
  onDragLeave?: (event: ListBoxDragLeaveEvent) => void;
  onDragOver?: (event: ListBoxDragEvent) => void;
  onDragStart?: (event: ListBoxDragEvent) => void;
  onDrop?: (event: ListBoxDragEvent) => void;
  onItemClick?: (event: ListBoxItemClickEvent) => void;
  onKeyDown?: (event: ListBoxKeyDownEvent) => void;
}

type ListBox = any;

export interface ListBoxDragEvent {
  dataItem?: any;
  nativeEvent: any;
  syntheticEvent: React.SyntheticEvent<any>;
  target: ListBox;
}

export interface ListBoxDragLeaveEvent {
  nativeEvent: any;
  syntheticEvent: React.SyntheticEvent<any>;
  target: ListBox;
}

export interface ListBoxItemClickEvent {
  dataItem?: any;
  nativeEvent: any;
  syntheticEvent: React.SyntheticEvent<any>;
  target: ListBox;
}

export interface ListBoxKeyDownEvent {
  nativeEvent: any;
  syntheticEvent: React.SyntheticEvent<any>;
  target: ListBox;
}
