import React from "react";
import { ListBoxProps } from "./ListBoxProps";
import { ListBox as KendoListBox } from "@progress/kendo-react-listbox";

const ListBox: React.FC<ListBoxProps> = ({
  dataTestId,
  className,
  data,
  draggable,
  item,
  selectedField,
  size,
  style,
  textField,
  toolbar,
  toolbarPosition,
  valueField,
  onDragLeave,
  onDragOver,
  onDragStart,
  onDrop,
  onItemClick,
  onKeyDown,
}) => {
  return (
    <div data-test-id={dataTestId}>
      <KendoListBox
        className={className}
        data={data}
        draggable={draggable}
        item={item}
        selectedField={selectedField}
        size={size}
        style={style}
        textField={textField}
        toolbar={toolbar}
        toolbarPosition={toolbarPosition}
        valueField={valueField}
        onDragLeave={onDragLeave}
        onDragOver={onDragOver}
        onDragStart={onDragStart}
        onDrop={onDrop}
        onItemClick={onItemClick}
        onKeyDown={onKeyDown}
      />
    </div>
  );
};

export default ListBox;