import { RatingChangeEvent as KendoRatingChangeEvent } from "@progress/kendo-react-inputs";
import { RatingItemFocusEvent as KendoRatingItemFocusEvent } from "@progress/kendo-react-inputs";
import { RatingItemMouseEvent as KendoRatingItemMouseEvent } from "@progress/kendo-react-inputs";
import { RatingKeyboardEvent as KendoRatingKeyboardEvent } from "@progress/kendo-react-inputs";

export interface RatingProps {
  dataTestId?: string;
  ariaDescribedBy?: string;
  ariaLabelledBy?: string;
  children?: React.ReactNode;
  className?: string;
  defaultValue?: number;
  dir?: string;
  disabled?: boolean;
  half?: boolean;
  icon?: string;
  id?: string;
  item?: React.ComponentType<any>;
  label?: string;
  max?: number;
  min?: number;
  name?: string;
  precision?: "item" | "half";
  readonly?: boolean;
  required?: boolean;
  selection?: "single" | "continues";
  step?: number;
  style?: React.CSSProperties;
  svgIcon?: any;
  svgIconOutline?: any;
  tabIndex?: number;
  valid?: boolean;
  validationMessage?: string;
  validityStyles?: boolean;
  value?: number;
  onBlur?: (event: KendoRatingItemFocusEvent) => void;
  onChange?: (event: KendoRatingChangeEvent) => void;
  onClick?: (event: KendoRatingItemMouseEvent) => void;
  onFocus?: (event: KendoRatingItemFocusEvent) => void;
  onKeyDown?: (event: KendoRatingKeyboardEvent) => void;
}

export interface RatingItemFocusEvent {
  syntheticEvent: React.FocusEvent<any>;
  target: RatingItemHandle;
}
export interface RatingChangeEvent {
  syntheticEvent: React.FocusEvent<any>;
  target: RatingItemHandle;
  value: number;
}

export interface RatingItemMouseEvent {
  syntheticEvent: React.MouseEvent<any>;
  target: RatingItemHandle;
}

export interface RatingKeyboardEvent {
  syntheticEvent: React.KeyboardEvent<any>;
  target: RatingHandle;
}

export interface RatingHandle {
  element: null | HTMLDivElement;
  props: RatingProps;
}

export interface RatingItemHandle {
  element: null | HTMLDivElement;
  props: RatingProps;
  value: number;
}