@mui/x-charts/Gauge/GaugeReferenceArc.mjs

The community edition of MUI X Charts components.

'use client';

import _extends from "@babel/runtime/helpers/esm/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
const _excluded = ["className"];
import * as React from 'react';
import { arc as d3Arc } from '@mui/x-charts-vendor/d3-shape';
import { styled } from '@mui/material/styles';
import clsx from 'clsx';
import { useGaugeState } from "./GaugeProvider.mjs";
import { gaugeClasses } from "./gaugeClasses.mjs";
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(_ref) {
  let {
      className
    } = _ref,
    other = _objectWithoutPropertiesLoose(_ref, _excluded);
  const {
    startAngle,
    endAngle,
    outerRadius,
    innerRadius,
    cornerRadius,
    cx,
    cy
  } = useGaugeState();
  return /*#__PURE__*/_jsx(StyledPath, _extends({
    className: clsx(gaugeClasses.referenceArc, className),
    transform: `translate(${cx}, ${cy})`,
    d: d3Arc().cornerRadius(cornerRadius)({
      startAngle,
      endAngle,
      innerRadius,
      outerRadius
    })
  }, other));
}