import React from "react";
import { DateTimePickerProps } from "./DateTimePickerProps";
import { DateTimePicker as KendoDateTimePicker } from "@progress/kendo-react-dateinputs";

const DateTimePicker: React.FC<DateTimePickerProps> = ({
  dataTestId,
  adaptive,
  adaptiveTitle,
  ariaDescribedBy,
  ariaLabelledBy,
  calendar,
  cancelButton,
  className,
  dateInput,
  defaultShow,
  defaultValue,
  disabled,
  fillMode,
  focusedDate,
  format,
  formatPlaceholder,
  id,
  label,
  max,
  maxTime,
  min,
  minTime,
  name,
  placeholder,
  popup,
  required,
  rounded,
  show,
  size,
  steps,
  tabIndex,
  title,
  valid,
  validationMessage,
  validityStyles,
  value,
  weekNumber,
  width,
  onBlur,
  onChange,
  onClose,
  onFocus,
  onOpen,
}) => (
  <div data-test-id={dataTestId}>
    <KendoDateTimePicker
      data-testid={id}
      adaptive={adaptive}
      adaptiveTitle={adaptiveTitle}
      ariaDescribedBy={ariaDescribedBy}
      ariaLabelledBy={ariaLabelledBy}
      calendar={calendar}
      cancelButton={cancelButton}
      className={className}
      dateInput={dateInput}
      defaultShow={defaultShow}
      defaultValue={defaultValue}
      disabled={disabled}
      fillMode={fillMode}
      focusedDate={focusedDate}
      format={format}
      formatPlaceholder={formatPlaceholder}
      id={id}
      label={label}
      max={max}
      maxTime={maxTime}
      min={min}
      minTime={minTime}
      name={name}
      placeholder={placeholder}
      popup={popup}
      required={required}
      rounded={rounded}
      show={show}
      size={size}
      steps={steps}
      tabIndex={tabIndex}
      title={title}
      valid={valid}
      validationMessage={validationMessage}
      validityStyles={validityStyles}
      value={value}
      weekNumber={weekNumber}
      width={width}
      onBlur={onBlur}
      onChange={onChange}
      onClose={onClose}
      onFocus={onFocus}
      onOpen={onOpen}
    />
  </div>
);
export default DateTimePicker;