import React from "react";
import { CircularGaugeProps } from "./CircularGaugeProps";
import { CircularGauge as KendoCircularGauge } from "@progress/kendo-react-gauges";

const CircularGauge: React.FC<CircularGaugeProps> = ({
  dataTestId,
  children,
  className,
  color,
  colors,
  dir,
  opacity,
  renderAs,
  scale,
  style,
  transitions,
  value,
  centerRender,
}) => (
  <div data-test-id={dataTestId}>
    <KendoCircularGauge
      className={className}
      color={color}
      colors={colors}
      dir={dir}
      opacity={opacity}
      renderAs={renderAs}
      scale={scale}
      style={style}
      transitions={transitions}
      value={value}
      centerRender={centerRender}
    >
      {children}
    </KendoCircularGauge>
  </div>
);

export default CircularGauge;