@mui/x-charts/esm/Gauge/GaugeReferenceArc.js

The community edition of MUI X Charts components.

'use client';

import _extends from "@babel/runtime/helpers/esm/extends";
import * as React from 'react';
import { arc as d3Arc } from '@mui/x-charts-vendor/d3-shape';
import { styled } from '@mui/material/styles';
import { useGaugeState } from "./GaugeProvider.js";
import { jsx as _jsx } from "react/jsx-runtime";
const StyledPath = styled('path', {
  name: 'MuiGauge',
  slot: 'ReferenceArc'
})(({
  theme
}) => ({
  fill: (theme.vars || theme).palette.divider
}));
export function GaugeReferenceArc(props) {
  const {
    startAngle,
    endAngle,
    outerRadius,
    innerRadius,
    cornerRadius,
    cx,
    cy
  } = useGaugeState();
  return /*#__PURE__*/_jsx(StyledPath, _extends({
    transform: `translate(${cx}, ${cy})`,
    d: d3Arc().cornerRadius(cornerRadius)({
      startAngle,
      endAngle,
      innerRadius,
      outerRadius
    })
  }, props));
}