import React from "react";
import { RatingProps } from "./RatingProps";
import { Rating as KendoRating } from "@progress/kendo-react-inputs";

const Rating: React.FC<RatingProps> = ({
  dataTestId,
  ariaDescribedBy,
  ariaLabelledBy,
  children,
  className,
  defaultValue,
  dir,
  disabled,
  half,
  icon,
  id,
  item,
  label,
  max,
  min,
  name,
  precision,
  readonly,
  required,
  selection,
  step,
  style,
  svgIcon,
  svgIconOutline,
  tabIndex,
  valid,
  validationMessage,
  validityStyles,
  value,
  onBlur,
  onChange,
  onClick,
  onFocus,
  onKeyDown,
}) => (
  <div data-test-id={dataTestId}>
    <KendoRating
      ariaDescribedBy={ariaDescribedBy}
      ariaLabelledBy={ariaLabelledBy}
      children={children}
      className={className}
      defaultValue={defaultValue}
      dir={dir}
      disabled={disabled}
      half={half}
      icon={icon}
      id={id}
      item={item}
      label={label}
      max={max}
      min={min}
      name={name}
      precision={precision}
      readonly={readonly}
      required={required}
      selection={selection}
      step={step}
      style={style}
      svgIcon={svgIcon}
      svgIconOutline={svgIconOutline}
      tabIndex={tabIndex}
      valid={valid}
      validationMessage={validationMessage}
      validityStyles={validityStyles}
      value={value}
      onBlur={onBlur}
      onChange={onChange}
      onClick={onClick}
      onFocus={onFocus}
      onKeyDown={onKeyDown}
    />
  </div>
);

export default Rating;
