import React from "react";
import { Input as KendoInput } from "@progress/kendo-react-inputs";
import { InputProps } from "./InputProps";

const Input: React.FC<InputProps> = ({
  dataTestId,
  id,
  ariaDescribedBy,
  ariaLabel,
  ariaLabelledBy,
  defaultValue,
  label,
  labelClassName,
  valid,
  validationMessage,
  validityStyles,
  value,
  onChange,
}) => (
  <div data-test-id={dataTestId}>
    <KendoInput
      id={id}
      ariaDescribedBy={ariaDescribedBy}
      ariaLabel={ariaLabel}
      ariaLabelledBy={ariaLabelledBy}
      defaultValue={defaultValue}
      label={label}
      labelClassName={labelClassName}
      valid={valid}
      validationMessage={validationMessage}
      validityStyles={validityStyles}
      value={value}
      onChange={onChange}
    />
  </div>
);

export default Input;