import { DatePicker as KendoDatePicker } from "@progress/kendo-react-dateinputs";
import {
  DateFormatOptions,
  DateInputFormatPlaceholder,
} from "../DateInput/DateInputProps";

export interface DatePickerChangeEvent {
  nativeEvent?: any;
  syntheticEvent: React.SyntheticEvent<any>;
  value: Date | null;
  show: boolean;
  target: KendoDatePicker;
}

export interface DatePickerCloseEvent {
  target: KendoDatePicker;
}

export interface DatePickerOpenEvent {
  target: KendoDatePicker;
}

export interface DateInputsPopupSettings {
  animate?: boolean;
  appendTo?: HTMLElement;
  popupClass?: string;
}

export interface DatePickerProps {
  dataTestId?: string;
  adaptive?: boolean;
  adaptiveTitle?: string;
  ariaDescribedBy?: string;
  ariaLabel?: string;
  ariaLabelledBy?: string;
  calendar?: React.ComponentType<any>;
  className?: string;
  dateInput?: React.ComponentType<any>;
  defaultShow?: boolean;
  defaultValue?: null | Date;
  disabled?: boolean;
  fillMode?: null | "flat" | "outline" | "solid";
  focusedDate?: Date;
  format?: string | DateFormatOptions;
  formatPlaceholder?: DateInputFormatPlaceholder;
  id?: string;
  label?: string;
  max?: Date;
  min?: Date;
  name?: string;
  pickerWrap?: React.ComponentType<any>;
  placeholder?: null | string;
  popup?: React.ComponentType<any>;
  popupSettings?: DateInputsPopupSettings;
  required?: boolean;
  rounded?: null | "small" | "medium" | "full" | "large";
  show?: boolean;
  size?: null | "small" | "medium" | "large";
  tabIndex?: number;
  title?: string;
  toggleButton?: React.ComponentType<any>;
  valid?: boolean;
  validationMessage?: string;
  validityStyles?: boolean;
  value?: null | Date;
  weekNumber?: boolean;
  width?: string | number;
  onBlur?: (
    event: React.FocusEvent<HTMLSpanElement | HTMLDivElement | HTMLInputElement>
  ) => void;
  onChange?: (event: DatePickerChangeEvent) => void;
  onClose?: (event: DatePickerCloseEvent) => void;

  onFocus?: (
    event: React.FocusEvent<HTMLSpanElement | HTMLDivElement | HTMLInputElement>
  ) => void;
  onOpen?: (event: DatePickerOpenEvent) => void;
}