import { DateInput as KendoDateInput } from "@progress/kendo-react-dateinputs";

export interface DateInputChangeEvent<T = KendoDateInput> {
  nativeEvent?: any;
  syntheticEvent: React.SyntheticEvent<any>;
  value: Date | null;
  target: T;
}

export interface DateFormatOptions {
  skeleton?: string;
  pattern?: string;
  date?: "short" | "medium" | "long" | "full";
  time?: "short" | "medium" | "long" | "full";
  datetime?: "short" | "medium" | "long" | "full";
  era?: "narrow" | "short" | "long";
  year?: "numeric" | "2-digit";
  month?: "numeric" | "2-digit" | "narrow" | "short" | "long";
  day?: "numeric" | "2-digit";
  weekday?: "narrow" | "short" | "long";
  hour?: "numeric" | "2-digit";
  hour12?: boolean;
  minute?: "numeric" | "2-digit";
  second?: "numeric" | "2-digit";
  timeZoneName?: "short" | "long";
}

export interface DateInputFormatPlaceholder {
  year?: string;
  month?: string;
  day?: string;
  hour?: string;
  minute?: string;
  second?: string;
}

export interface DateInputIncrementalSteps {
  year?: number;
  month?: number;
  day?: number;
  hour?: number;
  minute?: number;
  second?: number;
}

export interface DateInputProps {
  dataTestId?: string;
  ariaControls?: string;
  ariaDescribedBy?: string;
  ariaExpanded?: boolean;
  ariaHasPopup?: boolean | "grid" | "dialog";
  ariaLabel?: string;
  ariaLabelledBy?: string;
  ariaRole?: string;
  className?: string;
  defaultValue?: null | Date;
  dir?: string;
  disabled?: boolean;
  fillMode?: null | "flat" | "outline" | "solid";
  format?: string | DateFormatOptions;
  formatPlaceholder?: DateInputFormatPlaceholder;
  id?: string;
  label?: string;
  max?: Date;
  maxTime?: Date;
  min?: Date;
  minTime?: Date;
  name?: string;
  placeholder?: null | string;
  readonly?: boolean;
  required?: boolean;
  rounded?: null | "small" | "medium" | "full" | "large";
  size?: null | "small" | "medium" | "large";
  spinners?: boolean;
  steps?: DateInputIncrementalSteps;
  tabIndex?: number;
  title?: string;
  valid?: boolean;
  validationMessage?: string;
  validityStyles?: boolean;
  value?: null | Date;
  width?: string | number;
  onChange?: (event: DateInputChangeEvent) => void;
}