@mui/x-charts 6.18.2 → 6.18.4

package/models/axis.d.ts

@@ -2,7 +2,7 @@
 import type { ScaleBand, ScaleLogarithmic, ScalePower, ScaleTime, ScaleLinear, ScalePoint } from 'd3-scale';
 import { ChartsAxisClasses } from '../ChartsAxis/axisClasses';
 import type { TickParams } from '../hooks/useTicks';
-import { ChartsTextProps } from '../internals/components/ChartsText';
+import { ChartsTextProps } from '../ChartsText';
 export type D3Scale<Domain extends {
     toString(): string;
 } = number | Date | string, Range = number, Output = number> = ScaleBand<Domain> | ScaleLogarithmic<Range, Output> | ScalePoint<Domain> | ScalePower<Range, Output> | ScaleTime<Range, Output> | ScaleLinear<Range, Output>;

package/models/seriesType/config.d.ts

@@ -46,7 +46,11 @@ export type ChartSeries<T extends ChartSeriesType> = ChartsSeriesConfig[T] exten
 } ? ChartsSeriesConfig[T]['seriesInput'] & {
     stackedData: [number, number][];
 } : ChartsSeriesConfig[T]['seriesInput'];
-export type ChartSeriesDefaultized<T extends ChartSeriesType> = ChartsSeriesConfig[T]['series'] & ChartSeries<T>;
+export type ChartSeriesDefaultized<T extends ChartSeriesType> = ChartsSeriesConfig[T] extends {
+    canBeStacked: true;
+} ? ChartsSeriesConfig[T]['series'] & {
+    stackedData: [number, number][];
+} : ChartsSeriesConfig[T]['series'];
 export type ChartItemIdentifier<T extends ChartSeriesType> = ChartsSeriesConfig[T]['itemIdentifier'];
 type ExtremumGetterParams<T extends ChartSeriesType> = {
     series: {
@@ -73,10 +77,11 @@ export type FormatterResult<T extends ChartSeriesType> = {
 } ? {
     stackingGroups: StackingGroupsType;
 } : {});
-export type DatasetType<T extends number | string | Date = number | string | Date> = {
+export type DatasetElementType<T> = {
     [key: string]: T;
-}[];
-export type Formatter<T extends ChartSeriesType> = (params: FormatterParams<T>, dataset?: DatasetType<number>) => FormatterResult<T>;
+};
+export type DatasetType<T = number | string | Date | null | undefined> = DatasetElementType<T>[];
+export type Formatter<T extends ChartSeriesType> = (params: FormatterParams<T>, dataset?: DatasetType) => FormatterResult<T>;
 export type LegendParams = {
     /**
      * The color used in the legend

package/models/seriesType/pie.d.ts

@@ -17,14 +17,18 @@ export interface PieSeriesType<Tdata = PieValueType> extends CommonSeriesType<Td
     data: Tdata[];
     /**
      * The radius between circle center and the begining of the arc.
+     * Can be a number (in px) or a string with a percentage such as '50%'.
+     * The '100%' is the maximal radius that fit into the drawing area.
      * @default 0
      */
-    innerRadius?: number;
+    innerRadius?: number | string;
     /**
      * The radius between circle center and the end of the arc.
-     * @default R_max The maximal radius that fit into the drawing area.
+     * Can be a number (in px) or a string with a percentage such as '50%'.
+     * The '100%' is the maximal radius that fit into the drawing area.
+     * @default '100%'
      */
-    outerRadius?: number;
+    outerRadius?: number | string;
     /**
      * The radius applied to arc corners (similar to border radius).
      * @default 0
@@ -56,14 +60,18 @@ export interface PieSeriesType<Tdata = PieValueType> extends CommonSeriesType<Td
     arcLabelMinAngle?: number;
     /**
      * The x coordinate of the pie center.
-     * @default width/2 the center of the drawing area.
+     * Can be a number (in px) or a string with a percentage such as '50%'.
+     * The '100%' is the width the drawing area.
+     * @default '50%'
      */
-    cx?: number;
+    cx?: number | string;
     /**
      * The y coordinate of the pie center.
-     * @default height/2 the center of the drawing area.
+     * Can be a number (in px) or a string with a percentage such as '50%'.
+     * The '100%' is the height the drawing area.
+     * @default '50%'
      */
-    cy?: number;
+    cy?: number | string;
     /**
      * Override the arc attibutes when it is highlighted.
      */
@@ -107,3 +115,17 @@ export type PieItemIdentifier = {
 export interface DefaultizedPieSeriesType extends DefaultizedProps<PieSeriesType, CommonDefaultizedProps> {
     data: DefaultizedPieValueType[];
 }
+/**
+ * Props received when the parent components has done the percentage conversion.
+ */
+export interface ComputedPieRadius {
+    /**
+     * The radius between circle center and the begining of the arc.
+     * @default 0
+     */
+    innerRadius?: number;
+    /**
+     * The radius between circle center and the end of the arc.
+     */
+    outerRadius: number;
+}

package/models/seriesType/scatter.d.ts

@@ -20,5 +20,5 @@ export type ScatterItemIdentifier = {
     seriesId: DefaultizedScatterSeriesType['id'];
     dataIndex: number;
 };
-export interface DefaultizedScatterSeriesType extends DefaultizedProps<ScatterSeriesType, CommonDefaultizedProps> {
+export interface DefaultizedScatterSeriesType extends DefaultizedProps<ScatterSeriesType, CommonDefaultizedProps | 'color'> {
 }

package/modern/BarChart/BarElement.js

@@ -2,6 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 const _excluded = ["id", "dataIndex", "classes", "color", "highlightScope", "slots", "slotProps", "style"];
 import * as React from 'react';
+import PropTypes from 'prop-types';
 import composeClasses from '@mui/utils/composeClasses';
 import { useSlotProps } from '@mui/base/utils';
 import generateUtilityClass from '@mui/utils/generateUtilityClass';
@@ -39,7 +40,7 @@ export const BarElementPath = styled(animated.rect, {
   transition: 'opacity 0.2s ease-in, fill 0.2s ease-in',
   opacity: ownerState.isFaded && 0.3 || 1
 }));
-export function BarElement(props) {
+function BarElement(props) {
   const {
       id,
       dataIndex,
@@ -89,4 +90,27 @@ export function BarElement(props) {
     ownerState
   });
   return /*#__PURE__*/_jsx(Bar, _extends({}, barProps));
-}
+}
+process.env.NODE_ENV !== "production" ? BarElement.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  classes: PropTypes.object,
+  dataIndex: PropTypes.number.isRequired,
+  highlightScope: PropTypes.shape({
+    faded: PropTypes.oneOf(['global', 'none', 'series']),
+    highlighted: PropTypes.oneOf(['item', 'none', 'series'])
+  }),
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps: PropTypes.object,
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots: PropTypes.object
+} : void 0;
+export { BarElement };

package/modern/BarChart/BarPlot.js

@@ -8,7 +8,8 @@ import { SeriesContext } from '../context/SeriesContextProvider';
 import { CartesianContext } from '../context/CartesianContextProvider';
 import { BarElement } from './BarElement';
 import { isBandScaleConfig } from '../models/axis';
-import { jsx as _jsx } from "react/jsx-runtime";
+import { DEFAULT_X_AXIS_KEY, DEFAULT_Y_AXIS_KEY } from '../constants';
+
 /**
  * Solution of the equations
  * W = barWidth * N + offset * (N-1)
@@ -18,6 +19,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
  * @param gapRatio The ratio of the gap between bars over the bar width.
  * @returns The bar width and the offset between bars.
  */
+import { jsx as _jsx } from "react/jsx-runtime";
 function getBandSize({
   bandWidth: W,
   numberOfGroups: N,
@@ -67,18 +69,18 @@ const useCompletedData = () => {
       let baseScaleConfig;
       if (verticalLayout) {
         if (!isBandScaleConfig(xAxisConfig)) {
-          throw new Error(`Axis with id "${xAxisKey}" shoud be of type "band" to display the bar series of id "${seriesId}"`);
+          throw new Error(`MUI-X-Charts: ${xAxisKey === DEFAULT_X_AXIS_KEY ? 'The first `xAxis`' : `The x-axis with id "${xAxisKey}"`} shoud be of type "band" to display the bar series of id "${seriesId}"`);
         }
         if (xAxis[xAxisKey].data === undefined) {
-          throw new Error(`Axis with id "${xAxisKey}" shoud have data property`);
+          throw new Error(`MUI-X-Charts: ${xAxisKey === DEFAULT_X_AXIS_KEY ? 'The first `xAxis`' : `The x-axis with id "${xAxisKey}"`} shoud have data property`);
         }
         baseScaleConfig = xAxisConfig;
       } else {
         if (!isBandScaleConfig(yAxisConfig)) {
-          throw new Error(`Axis with id "${yAxisKey}" shoud be of type "band" to display the bar series of id "${seriesId}"`);
+          throw new Error(`MUI-X-Charts: ${yAxisKey === DEFAULT_Y_AXIS_KEY ? 'The first `yAxis`' : `The y-axis with id "${yAxisKey}"`} shoud be of type "band" to display the bar series of id "${seriesId}"`);
         }
         if (yAxis[yAxisKey].data === undefined) {
-          throw new Error(`Axis with id "${xAxisKey}" shoud have data property`);
+          throw new Error(`MUI-X-Charts: ${yAxisKey === DEFAULT_Y_AXIS_KEY ? 'The first `yAxis`' : `The y-axis with id "${yAxisKey}"`} shoud have data property`);
         }
         baseScaleConfig = yAxisConfig;
       }

package/modern/BarChart/formatter.js

@@ -2,6 +2,7 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import { stack as d3Stack } from 'd3-shape';
 import { getStackingGroups } from '../internals/stackSeries';
 import defaultizeValueFormatter from '../internals/defaultizeValueFormatter';
+let warnOnce = false;
 const formatter = (params, dataset) => {
   const {
     seriesOrder,
@@ -24,7 +25,7 @@ const formatter = (params, dataset) => {
         }
       });
     } else if (dataset === undefined) {
-      throw new Error([`MUI: bar series with id='${id}' has no data.`, 'Either provide a data property to the series or use the dataset prop.'].join('\n'));
+      throw new Error([`MUI-X-Charts: bar series with id='${id}' has no data.`, 'Either provide a data property to the series or use the dataset prop.'].join('\n'));
     }
   });
   const completedSeries = {};
@@ -39,13 +40,24 @@ const formatter = (params, dataset) => {
       // Use dataKey if needed and available
       const dataKey = series[id].dataKey;
       return series[id].data === undefined && dataKey !== undefined ? dataKey : id;
-    })).order(stackingOrder).offset(stackingOffset)(d3Dataset);
+    })).value((d, key) => d[key] ?? 0) // defaultize null value to 0
+    .order(stackingOrder).offset(stackingOffset)(d3Dataset);
     ids.forEach((id, index) => {
       const dataKey = series[id].dataKey;
       completedSeries[id] = _extends({
         layout: 'vertical'
       }, series[id], {
-        data: dataKey ? dataset.map(d => d[dataKey]) : series[id].data,
+        data: dataKey ? dataset.map(data => {
+          const value = data[dataKey];
+          if (typeof value !== 'number') {
+            if (process.env.NODE_ENV !== 'production' && !warnOnce && value !== null) {
+              warnOnce = true;
+              console.error([`MUI-X charts: your dataset key "${dataKey}" is used for plotting bars, but contains nonnumerical elements.`, 'Bar plots only support numbers and null values.']);
+            }
+            return 0;
+          }
+          return value;
+        }) : series[id].data,
         stackedData: stackedSeries[index].map(([a, b]) => [a, b])
       });
     });

package/modern/BarChart/index.js

@@ -1,2 +1,3 @@
-export { BarPlot } from './BarPlot';
-export { BarChart } from './BarChart';
+export * from './BarChart';
+export * from './BarPlot';
+export * from './BarElement';

package/modern/ChartsAxis/ChartsAxis.js

@@ -58,16 +58,16 @@ function ChartsAxis(props) {
   const topId = getAxisId(topAxis);
   const rightId = getAxisId(rightAxis);
   if (topId !== null && !xAxis[topId]) {
-    throw Error(`MUI: id used for top axis "${topId}" is not defined`);
+    throw Error([`MUI-X-Charts: id used for top axis "${topId}" is not defined.`, `Available ids are: ${xAxisIds.join(', ')}.`].join('\n'));
   }
   if (leftId !== null && !yAxis[leftId]) {
-    throw Error(`MUI: id used for left axis "${leftId}" is not defined`);
+    throw Error([`MUI-X-Charts: id used for left axis "${leftId}" is not defined.`, `Available ids are: ${yAxisIds.join(', ')}.`].join('\n'));
   }
   if (rightId !== null && !yAxis[rightId]) {
-    throw Error(`MUI: id used for right axis "${rightId}" is not defined`);
+    throw Error([`MUI-X-Charts: id used for right axis "${rightId}" is not defined.`, `Available ids are: ${yAxisIds.join(', ')}.`].join('\n'));
   }
   if (bottomId !== null && !xAxis[bottomId]) {
-    throw Error(`MUI: id used for bottom axis "${bottomId}" is not defined`);
+    throw Error([`MUI-X-Charts: id used for bottom axis "${bottomId}" is not defined.`, `Available ids are: ${xAxisIds.join(', ')}.`].join('\n'));
   }
   const topAxisProps = mergeProps(topAxis, slots, slotProps);
   const bottomAxisProps = mergeProps(bottomAxis, slots, slotProps);

package/modern/ChartsLegend/ChartsLegend.js

@@ -11,7 +11,8 @@ import { DrawingContext } from '../context/DrawingProvider';
 import { getSeriesToDisplay } from './utils';
 import { SeriesContext } from '../context/SeriesContextProvider';
 import { getLegendUtilityClass } from './chartsLegendClasses';
-import { ChartsText, getWordsByLines } from '../internals/components/ChartsText';
+import { ChartsText } from '../ChartsText';
+import { getWordsByLines } from '../internals/getWordsByLines';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const useUtilityClasses = ownerState => {

package/modern/ChartsLegend/index.js

@@ -1,2 +1,3 @@
 export * from './ChartsLegend';
-export * from './chartsLegendClasses';
+export * from './chartsLegendClasses';
+export * from './utils';

package/modern/ChartsReferenceLine/ChartsReferenceLine.js

@@ -6,10 +6,10 @@ import { ChartsYReferenceLine } from './ChartsYReferenceLine';
 import { jsx as _jsx } from "react/jsx-runtime";
 function ChartsReferenceLine(props) {
   if (props.x !== undefined && props.y !== undefined) {
-    throw new Error('MUI-X: The ChartsReferenceLine can not have both `x` and `y` props set.');
+    throw new Error('MUI-X-Charts: The ChartsReferenceLine can not have both `x` and `y` props set.');
   }
   if (props.x === undefined && props.y === undefined) {
-    throw new Error('MUI-X: The ChartsReferenceLine should have a value in `x` or `y` prop.');
+    throw new Error('MUI-X-Charts: The ChartsReferenceLine should have a value in `x` or `y` prop.');
   }
   if (props.x !== undefined) {
     return /*#__PURE__*/_jsx(ChartsXReferenceLine, _extends({}, props));

package/modern/ChartsReferenceLine/ChartsXReferenceLine.js

@@ -3,7 +3,7 @@ import * as React from 'react';
 import composeClasses from '@mui/utils/composeClasses';
 import { useDrawingArea, useXScale } from '../hooks';
 import { ReferenceLineRoot } from './common';
-import { ChartsText } from '../internals/components/ChartsText';
+import { ChartsText } from '../ChartsText';
 import { getReferenceLineUtilityClass } from './chartsReferenceLineClasses';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";

package/modern/ChartsReferenceLine/ChartsYReferenceLine.js

@@ -3,7 +3,7 @@ import * as React from 'react';
 import composeClasses from '@mui/utils/composeClasses';
 import { useDrawingArea, useYScale } from '../hooks';
 import { ReferenceLineRoot } from './common';
-import { ChartsText } from '../internals/components/ChartsText';
+import { ChartsText } from '../ChartsText';
 import { getReferenceLineUtilityClass } from './chartsReferenceLineClasses';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";

package/modern/{internals/components → ChartsText}/ChartsText.js

@@ -1,23 +1,15 @@
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 const _excluded = ["x", "y", "style", "text", "ownerState"],
   _excluded2 = ["angle", "textAnchor", "dominantBaseline"];
 import * as React from 'react';
-import { getStringSize } from '../domUtils';
+import PropTypes from 'prop-types';
+import { getWordsByLines } from '../internals/getWordsByLines';
 import { jsx as _jsx } from "react/jsx-runtime";
-export function getWordsByLines({
-  style,
-  needsComputation,
-  text
-}) {
-  return text.split('\n').map(subText => _extends({
-    text: subText
-  }, needsComputation ? getStringSize(subText, style) : {
-    width: 0,
-    height: 0
-  }));
-}
-export function ChartsText(props) {
+/**
+ * Helper component to manage multiline text in SVG
+ */
+function ChartsText(props) {
   const {
       x,
       y,
@@ -74,4 +66,29 @@ export function ChartsText(props) {
       children: line.text
     }, index))
   }));
-}
+}
+process.env.NODE_ENV !== "production" ? ChartsText.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  /**
+   * Height of a text line (in `em`).
+   */
+  lineHeight: PropTypes.number,
+  /**
+   * If `true`, the line width is computed.
+   * @default false
+   */
+  needsComputation: PropTypes.bool,
+  ownerState: PropTypes.any,
+  /**
+   * Style applied to text elements.
+   */
+  style: PropTypes.object,
+  /**
+   * Text displayed.
+   */
+  text: PropTypes.string.isRequired
+} : void 0;
+export { ChartsText };

package/modern/ChartsText/index.js

@@ -0,0 +1 @@
+export { ChartsText } from './ChartsText';

package/modern/ChartsTooltip/ChartsAxisTooltipContent.js

@@ -1,81 +1,12 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
-import clsx from 'clsx';
-import Typography from '@mui/material/Typography';
+import PropTypes from 'prop-types';
 import { useSlotProps } from '@mui/base/utils';
 import { SeriesContext } from '../context/SeriesContextProvider';
 import { CartesianContext } from '../context/CartesianContextProvider';
-import { ChartsTooltipCell, ChartsTooltipPaper, ChartsTooltipTable, ChartsTooltipMark, ChartsTooltipRow } from './ChartsTooltipTable';
+import { DefaultChartsAxisTooltipContent } from './DefaultChartsAxisTooltipContent';
 import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-export function DefaultChartsAxisContent(props) {
-  const {
-    series,
-    axis,
-    dataIndex,
-    axisValue,
-    sx,
-    classes
-  } = props;
-  if (dataIndex == null) {
-    return null;
-  }
-  const axisFormatter = axis.valueFormatter ?? (v => v.toLocaleString());
-  return /*#__PURE__*/_jsx(ChartsTooltipPaper, {
-    sx: sx,
-    className: classes.root,
-    children: /*#__PURE__*/_jsxs(ChartsTooltipTable, {
-      className: classes.table,
-      children: [axisValue != null && !axis.hideTooltip && /*#__PURE__*/_jsx("thead", {
-        children: /*#__PURE__*/_jsx(ChartsTooltipRow, {
-          children: /*#__PURE__*/_jsx(ChartsTooltipCell, {
-            colSpan: 3,
-            children: /*#__PURE__*/_jsx(Typography, {
-              children: axisFormatter(axisValue)
-            })
-          })
-        })
-      }), /*#__PURE__*/_jsx("tbody", {
-        children: series.map(({
-          color,
-          id,
-          label,
-          valueFormatter,
-          data
-        }) => {
-          const formattedValue = valueFormatter(data[dataIndex]);
-          if (formattedValue == null) {
-            return null;
-          }
-          return /*#__PURE__*/_jsxs(ChartsTooltipRow, {
-            className: classes.row,
-            children: [/*#__PURE__*/_jsx(ChartsTooltipCell, {
-              className: clsx(classes.markCell, classes.cell),
-              children: /*#__PURE__*/_jsx(ChartsTooltipMark, {
-                ownerState: {
-                  color
-                },
-                boxShadow: 1,
-                className: classes.mark
-              })
-            }), /*#__PURE__*/_jsx(ChartsTooltipCell, {
-              className: clsx(classes.labelCell, classes.cell),
-              children: label ? /*#__PURE__*/_jsx(Typography, {
-                children: label
-              }) : null
-            }), /*#__PURE__*/_jsx(ChartsTooltipCell, {
-              className: clsx(classes.valueCell, classes.cell),
-              children: /*#__PURE__*/_jsx(Typography, {
-                children: formattedValue
-              })
-            })]
-          }, id);
-        })
-      })]
-    })
-  });
-}
-export function ChartsAxisTooltipContent(props) {
+function ChartsAxisTooltipContent(props) {
   const {
     content,
     contentProps,
@@ -110,7 +41,7 @@ export function ChartsAxisTooltipContent(props) {
   const relevantAxis = React.useMemo(() => {
     return isXaxis ? xAxis[USED_AXIS_ID] : yAxis[USED_AXIS_ID];
   }, [USED_AXIS_ID, isXaxis, xAxis, yAxis]);
-  const Content = content ?? DefaultChartsAxisContent;
+  const Content = content ?? DefaultChartsAxisTooltipContent;
   const chartTooltipContentProps = useSlotProps({
     elementType: Content,
     externalSlotProps: contentProps,
@@ -126,4 +57,94 @@ export function ChartsAxisTooltipContent(props) {
     ownerState: {}
   });
   return /*#__PURE__*/_jsx(Content, _extends({}, chartTooltipContentProps));
-}
+}
+process.env.NODE_ENV !== "production" ? ChartsAxisTooltipContent.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  axisData: PropTypes.shape({
+    x: PropTypes.shape({
+      index: PropTypes.number,
+      value: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]).isRequired
+    }),
+    y: PropTypes.shape({
+      index: PropTypes.number,
+      value: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]).isRequired
+    })
+  }).isRequired,
+  classes: PropTypes.object.isRequired,
+  content: PropTypes.elementType,
+  contentProps: PropTypes.shape({
+    axis: PropTypes.shape({
+      axisId: PropTypes.string,
+      classes: PropTypes.object,
+      data: PropTypes.array,
+      dataKey: PropTypes.string,
+      disableLine: PropTypes.bool,
+      disableTicks: PropTypes.bool,
+      fill: PropTypes.string,
+      hideTooltip: PropTypes.bool,
+      id: PropTypes.string.isRequired,
+      label: PropTypes.string,
+      labelFontSize: PropTypes.number,
+      labelStyle: PropTypes.object,
+      max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+      min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
+      position: PropTypes.oneOf(['bottom', 'left', 'right', 'top']),
+      scale: PropTypes.func.isRequired,
+      scaleType: PropTypes.oneOf(['time']).isRequired,
+      slotProps: PropTypes.object,
+      slots: PropTypes.object,
+      stroke: PropTypes.string,
+      tickFontSize: PropTypes.number,
+      tickInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.array, PropTypes.func]),
+      tickLabelInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.func]),
+      tickLabelStyle: PropTypes.object,
+      tickMaxStep: PropTypes.number,
+      tickMinStep: PropTypes.number,
+      tickNumber: PropTypes.number.isRequired,
+      tickSize: PropTypes.number,
+      valueFormatter: PropTypes.func
+    }),
+    axisData: PropTypes.shape({
+      x: PropTypes.shape({
+        index: PropTypes.number,
+        value: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]).isRequired
+      }),
+      y: PropTypes.shape({
+        index: PropTypes.number,
+        value: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]).isRequired
+      })
+    }),
+    axisValue: PropTypes.any,
+    classes: PropTypes.object,
+    dataIndex: PropTypes.number,
+    series: PropTypes.arrayOf(PropTypes.shape({
+      area: PropTypes.bool,
+      color: PropTypes.string.isRequired,
+      connectNulls: PropTypes.bool,
+      curve: PropTypes.oneOf(['catmullRom', 'linear', 'monotoneX', 'monotoneY', 'natural', 'step', 'stepAfter', 'stepBefore']),
+      data: PropTypes.arrayOf(PropTypes.number).isRequired,
+      dataKey: PropTypes.string,
+      disableHighlight: PropTypes.bool,
+      highlightScope: PropTypes.shape({
+        faded: PropTypes.oneOf(['global', 'none', 'series']),
+        highlighted: PropTypes.oneOf(['item', 'none', 'series'])
+      }),
+      id: PropTypes.string.isRequired,
+      label: PropTypes.string,
+      showMark: PropTypes.oneOfType([PropTypes.func, PropTypes.bool]),
+      stack: PropTypes.string,
+      stackOffset: PropTypes.oneOf(['diverging', 'expand', 'none', 'silhouette', 'wiggle']),
+      stackOrder: PropTypes.oneOf(['appearance', 'ascending', 'descending', 'insideOut', 'none', 'reverse']),
+      type: PropTypes.oneOf(['line']).isRequired,
+      valueFormatter: PropTypes.func.isRequired,
+      xAxisKey: PropTypes.string,
+      yAxisKey: PropTypes.string
+    })),
+    sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+  }),
+  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
+} : void 0;
+export { ChartsAxisTooltipContent };