import React from "react";
import { ArcGaugeProps } from "./ArcGaugeProps";
import { ArcGauge as KendoArcGauge } from "@progress/kendo-react-gauges";

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

export default ArcGauge;