@mui/x-charts 7.0.0-beta.1 → 7.0.0-beta.2

package/ChartsLegend/index.d.ts

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

package/ChartsLegend/index.js

@@ -14,6 +14,17 @@ Object.keys(_ChartsLegend).forEach(function (key) {
     }
   });
 });
+var _DefaultChartsLegend = require("./DefaultChartsLegend");
+Object.keys(_DefaultChartsLegend).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _DefaultChartsLegend[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _DefaultChartsLegend[key];
+    }
+  });
+});
 var _chartsLegendClasses = require("./chartsLegendClasses");
 Object.keys(_chartsLegendClasses).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/ChartsReferenceLine/ChartsReferenceLine.js

@@ -19,7 +19,7 @@ function ChartsReferenceLine(props) {
     y
   } = props;
   if (x !== undefined && y !== undefined) {
-    throw new Error('MUI X Charts: The ChartsReferenceLine can not have both `x` and `y` props set.');
+    throw new Error('MUI X Charts: The ChartsReferenceLine cannot have both `x` and `y` props set.');
   }
   if (x === undefined && y === undefined) {
     throw new Error('MUI X Charts: The ChartsReferenceLine should have a value in `x` or `y` prop.');
@@ -38,7 +38,7 @@ process.env.NODE_ENV !== "production" ? ChartsReferenceLine.propTypes = {
    * The id of the axis used for the reference value.
    * @default The `id` of the first defined axis.
    */
-  axisId: _propTypes.default.string,
+  axisId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
   /**
    * Override or extend the styles applied to the component.
    */

package/ChartsReferenceLine/common.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="react" />
 import { ChartsReferenceLineClasses } from './chartsReferenceLineClasses';
 import { ChartsTextStyle } from '../ChartsText';
+import { AxisId } from '../models/axis';
 export type CommonChartsReferenceLineProps = {
     /**
      * The alignment if the label is in the chart drawing area.
@@ -24,7 +25,7 @@ export type CommonChartsReferenceLineProps = {
      * The id of the axis used for the reference value.
      * @default The `id` of the first defined axis.
      */
-    axisId?: string;
+    axisId?: AxisId;
     /**
      * The style applied to the label.
      */

package/ChartsTooltip/ChartsItemTooltipContent.js

@@ -48,7 +48,7 @@ process.env.NODE_ENV !== "production" ? ChartsItemTooltipContent.propTypes = {
     classes: _propTypes.default.object,
     itemData: _propTypes.default.shape({
       dataIndex: _propTypes.default.number,
-      seriesId: _propTypes.default.string.isRequired,
+      seriesId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired,
       type: _propTypes.default.oneOf(['bar', 'line', 'pie', 'scatter']).isRequired
     }),
     series: _propTypes.default.object,
@@ -56,7 +56,7 @@ process.env.NODE_ENV !== "production" ? ChartsItemTooltipContent.propTypes = {
   }),
   itemData: _propTypes.default.shape({
     dataIndex: _propTypes.default.number,
-    seriesId: _propTypes.default.string.isRequired,
+    seriesId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired,
     type: _propTypes.default.oneOf(['bar', 'line', 'pie', 'scatter']).isRequired
   }).isRequired,
   sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object])

package/ChartsTooltip/DefaultChartsAxisTooltipContent.js

@@ -26,7 +26,7 @@ function DefaultChartsAxisTooltipContent(props) {
   if (dataIndex == null) {
     return null;
   }
-  const axisFormatter = axis.valueFormatter ?? (v => v.toLocaleString());
+  const axisFormatter = axis.valueFormatter ?? (v => axis.scaleType === 'utc' ? (0, _utils.utcFormatter)(v) : v.toLocaleString());
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsTooltipTable.ChartsTooltipPaper, {
     sx: sx,
     className: classes.root,

package/ChartsTooltip/DefaultChartsItemTooltipContent.js

@@ -76,7 +76,7 @@ process.env.NODE_ENV !== "production" ? DefaultChartsItemTooltipContent.propType
    */
   itemData: _propTypes.default.shape({
     dataIndex: _propTypes.default.number,
-    seriesId: _propTypes.default.string.isRequired,
+    seriesId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired,
     type: _propTypes.default.oneOf(['bar', 'line', 'pie', 'scatter']).isRequired
   }).isRequired,
   /**

package/ChartsTooltip/utils.d.ts

@@ -24,3 +24,4 @@ export type TriggerOptions = 'item' | 'axis' | 'none';
 export declare function getTooltipHasData(trigger: TriggerOptions, displayedData: null | AxisInteractionData | ItemInteractionData<ChartSeriesType>): boolean;
 export declare function isCartesianSeriesType(seriesType: string): seriesType is CartesianChartSeriesType;
 export declare function isCartesianSeries(series: ChartSeriesDefaultized<ChartSeriesType>): series is ChartSeriesDefaultized<CartesianChartSeriesType>;
+export declare function utcFormatter(v: string | number | Date): string;

package/ChartsTooltip/utils.js

@@ -8,6 +8,7 @@ exports.getTooltipHasData = getTooltipHasData;
 exports.isCartesianSeries = isCartesianSeries;
 exports.isCartesianSeriesType = isCartesianSeriesType;
 exports.useMouseTracker = useMouseTracker;
+exports.utcFormatter = utcFormatter;
 var React = _interopRequireWildcard(require("react"));
 var _DrawingProvider = require("../context/DrawingProvider");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
@@ -96,4 +97,10 @@ function isCartesianSeriesType(seriesType) {
 }
 function isCartesianSeries(series) {
   return isCartesianSeriesType(series.type);
+}
+function utcFormatter(v) {
+  if (v instanceof Date) {
+    return v.toUTCString();
+  }
+  return v.toLocaleString();
 }

package/ChartsXAxis/ChartsXAxis.js

@@ -22,7 +22,7 @@ var _geometry = require("../internals/geometry");
 var _useMounted = require("../hooks/useMounted");
 var _getWordsByLines = require("../internals/getWordsByLines");
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["scale", "tickNumber"];
+const _excluded = ["scale", "tickNumber", "reverse"];
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 const useUtilityClasses = ownerState => {
@@ -43,6 +43,7 @@ const useUtilityClasses = ownerState => {
 function addLabelDimension(xTicks, {
   tickLabelStyle: style,
   tickLabelInterval,
+  reverse,
   isMounted
 }) {
   const withDimension = xTicks.map(tick => {
@@ -69,8 +70,9 @@ function addLabelDimension(xTicks, {
   }
 
   // Filter label to avoid overlap
-  let textStart = 0;
-  let textEnd = 0;
+  let currentTextLimit = 0;
+  let previouseTextLimit = 0;
+  const direction = reverse ? -1 : 1;
   return withDimension.map((item, labelIndex) => {
     const {
       width,
@@ -82,15 +84,15 @@ function addLabelDimension(xTicks, {
     const textPosition = offset + labelOffset;
     const gapRatio = 1.2; // Ratio applied to the minimal distance to add some margin.
 
-    textStart = textPosition - gapRatio * distance / 2;
-    if (labelIndex > 0 && textStart < textEnd) {
+    currentTextLimit = textPosition - direction * (gapRatio * distance) / 2;
+    if (labelIndex > 0 && direction * currentTextLimit < direction * previouseTextLimit) {
       // Except for the first label, we skip all label that overlap with the last accepted.
-      // Notice that the early return prevents `textEnd` from being updated.
+      // Notice that the early return prevents `previouseTextLimit` from being updated.
       return (0, _extends2.default)({}, item, {
         skipLabel: true
       });
     }
-    textEnd = textPosition + gapRatio * distance / 2;
+    previouseTextLimit = textPosition + direction * (gapRatio * distance) / 2;
     return item;
   });
 }
@@ -124,7 +126,8 @@ function ChartsXAxis(inProps) {
       xAxis: {
         [_ref]: {
           scale: xScale,
-          tickNumber
+          tickNumber,
+          reverse
         }
       }
     } = _React$useContext,
@@ -186,6 +189,7 @@ function ChartsXAxis(inProps) {
   const xTicksWithDimension = addLabelDimension(xTicks, {
     tickLabelStyle: axisTickLabelProps.style,
     tickLabelInterval,
+    reverse,
     isMounted
   });
   const labelRefPoint = {
@@ -249,7 +253,7 @@ process.env.NODE_ENV !== "production" ? ChartsXAxis.propTypes = {
    * The id of the axis to render.
    * If undefined, it will be the first defined axis.
    */
-  axisId: _propTypes.default.string,
+  axisId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
   /**
    * Override or extend the styles applied to the component.
    */

package/ChartsYAxis/ChartsYAxis.js

@@ -183,7 +183,7 @@ process.env.NODE_ENV !== "production" ? ChartsYAxis.propTypes = {
    * The id of the axis to render.
    * If undefined, it will be the first defined axis.
    */
-  axisId: _propTypes.default.string,
+  axisId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
   /**
    * Override or extend the styles applied to the component.
    */

package/LineChart/AnimatedArea.js

@@ -99,7 +99,7 @@ process.env.NODE_ENV !== "production" ? AnimatedArea.propTypes = {
   ownerState: _propTypes.default.shape({
     classes: _propTypes.default.object,
     color: _propTypes.default.string.isRequired,
-    id: _propTypes.default.string.isRequired,
+    id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired,
     isFaded: _propTypes.default.bool.isRequired,
     isHighlighted: _propTypes.default.bool.isRequired
   }).isRequired,

package/LineChart/AnimatedLine.js

@@ -101,7 +101,7 @@ process.env.NODE_ENV !== "production" ? AnimatedLine.propTypes = {
   ownerState: _propTypes.default.shape({
     classes: _propTypes.default.object,
     color: _propTypes.default.string.isRequired,
-    id: _propTypes.default.string.isRequired,
+    id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired,
     isFaded: _propTypes.default.bool.isRequired,
     isHighlighted: _propTypes.default.bool.isRequired
   }).isRequired,

package/LineChart/AreaElement.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { HighlightScope } from '../context/HighlightProvider';
 import { AnimatedAreaProps } from './AnimatedArea';
+import { SeriesId } from '../models/seriesType/common';
 export interface AreaElementClasses {
     /** Styles applied to the root element. */
     root: string;
@@ -11,7 +12,7 @@ export interface AreaElementClasses {
 }
 export type AreaElementClassKey = keyof AreaElementClasses;
 export interface AreaElementOwnerState {
-    id: string;
+    id: SeriesId;
     color: string;
     isFaded: boolean;
     isHighlighted: boolean;

package/LineChart/AreaElement.js

@@ -107,7 +107,7 @@ process.env.NODE_ENV !== "production" ? AreaElement.propTypes = {
     faded: _propTypes.default.oneOf(['global', 'none', 'series']),
     highlighted: _propTypes.default.oneOf(['item', 'none', 'series'])
   }),
-  id: _propTypes.default.string.isRequired,
+  id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired,
   /**
    * If `true`, animations are skipped.
    * @default false

package/LineChart/LineChart.js

@@ -151,7 +151,7 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
    * @default xAxisIds[0] The id of the first provided axis
    */
   bottomAxis: _propTypes.default.oneOfType([_propTypes.default.shape({
-    axisId: _propTypes.default.string,
+    axisId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
     classes: _propTypes.default.object,
     disableLine: _propTypes.default.bool,
     disableTicks: _propTypes.default.bool,
@@ -205,7 +205,7 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
    * @default yAxisIds[0] The id of the first provided axis
    */
   leftAxis: _propTypes.default.oneOfType([_propTypes.default.shape({
-    axisId: _propTypes.default.string,
+    axisId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
     classes: _propTypes.default.object,
     disableLine: _propTypes.default.bool,
     disableTicks: _propTypes.default.bool,
@@ -268,7 +268,7 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
    * @default null
    */
   rightAxis: _propTypes.default.oneOfType([_propTypes.default.shape({
-    axisId: _propTypes.default.string,
+    axisId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
     classes: _propTypes.default.object,
     disableLine: _propTypes.default.bool,
     disableTicks: _propTypes.default.bool,
@@ -321,7 +321,7 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
    * @default null
    */
   topAxis: _propTypes.default.oneOfType([_propTypes.default.shape({
-    axisId: _propTypes.default.string,
+    axisId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
     classes: _propTypes.default.object,
     disableLine: _propTypes.default.bool,
     disableTicks: _propTypes.default.bool,
@@ -358,7 +358,7 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
    * If not provided, a default axis config is used with id set to `DEFAULT_X_AXIS_KEY`.
    */
   xAxis: _propTypes.default.arrayOf(_propTypes.default.shape({
-    axisId: _propTypes.default.string,
+    axisId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
     classes: _propTypes.default.object,
     data: _propTypes.default.array,
     dataKey: _propTypes.default.string,
@@ -366,13 +366,14 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
     disableTicks: _propTypes.default.bool,
     fill: _propTypes.default.string,
     hideTooltip: _propTypes.default.bool,
-    id: _propTypes.default.string,
+    id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
     label: _propTypes.default.string,
     labelFontSize: _propTypes.default.number,
     labelStyle: _propTypes.default.object,
     max: _propTypes.default.oneOfType([_propTypes.default.instanceOf(Date), _propTypes.default.number]),
     min: _propTypes.default.oneOfType([_propTypes.default.instanceOf(Date), _propTypes.default.number]),
     position: _propTypes.default.oneOf(['bottom', 'left', 'right', 'top']),
+    reverse: _propTypes.default.bool,
     scaleType: _propTypes.default.oneOf(['band', 'linear', 'log', 'point', 'pow', 'sqrt', 'time', 'utc']),
     slotProps: _propTypes.default.object,
     slots: _propTypes.default.object,
@@ -392,7 +393,7 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
    * If not provided, a default axis config is used with id set to `DEFAULT_Y_AXIS_KEY`.
    */
   yAxis: _propTypes.default.arrayOf(_propTypes.default.shape({
-    axisId: _propTypes.default.string,
+    axisId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
     classes: _propTypes.default.object,
     data: _propTypes.default.array,
     dataKey: _propTypes.default.string,
@@ -400,13 +401,14 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
     disableTicks: _propTypes.default.bool,
     fill: _propTypes.default.string,
     hideTooltip: _propTypes.default.bool,
-    id: _propTypes.default.string,
+    id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
     label: _propTypes.default.string,
     labelFontSize: _propTypes.default.number,
     labelStyle: _propTypes.default.object,
     max: _propTypes.default.oneOfType([_propTypes.default.instanceOf(Date), _propTypes.default.number]),
     min: _propTypes.default.oneOfType([_propTypes.default.instanceOf(Date), _propTypes.default.number]),
     position: _propTypes.default.oneOf(['bottom', 'left', 'right', 'top']),
+    reverse: _propTypes.default.bool,
     scaleType: _propTypes.default.oneOf(['band', 'linear', 'log', 'point', 'pow', 'sqrt', 'time', 'utc']),
     slotProps: _propTypes.default.object,
     slots: _propTypes.default.object,

package/LineChart/LineElement.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { HighlightScope } from '../context/HighlightProvider';
 import { AnimatedLineProps } from './AnimatedLine';
+import { SeriesId } from '../models/seriesType/common';
 export interface LineElementClasses {
     /** Styles applied to the root element. */
     root: string;
@@ -11,7 +12,7 @@ export interface LineElementClasses {
 }
 export type LineElementClassKey = keyof LineElementClasses;
 export interface LineElementOwnerState {
-    id: string;
+    id: SeriesId;
     color: string;
     isFaded: boolean;
     isHighlighted: boolean;

package/LineChart/LineElement.js

@@ -107,7 +107,7 @@ process.env.NODE_ENV !== "production" ? LineElement.propTypes = {
     faded: _propTypes.default.oneOf(['global', 'none', 'series']),
     highlighted: _propTypes.default.oneOf(['item', 'none', 'series'])
   }),
-  id: _propTypes.default.string.isRequired,
+  id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired,
   /**
    * If `true`, animations are skipped.
    * @default false

package/LineChart/LineHighlightElement.d.ts

@@ -1,11 +1,12 @@
 import * as React from 'react';
+import { SeriesId } from '../models/seriesType/common';
 export interface LineHighlightElementClasses {
     /** Styles applied to the root element. */
     root: string;
 }
 export type HighlightElementClassKey = keyof LineHighlightElementClasses;
 interface LineHighlightElementOwnerState {
-    id: string;
+    id: SeriesId;
     color: string;
     x: number;
     y: number;
@@ -13,7 +14,7 @@ interface LineHighlightElementOwnerState {
 }
 export declare function getHighlightElementUtilityClass(slot: string): string;
 export declare const lineHighlightElementClasses: LineHighlightElementClasses;
-export type LineHighlightElementProps = LineHighlightElementOwnerState & React.ComponentPropsWithoutRef<'circle'> & {};
+export type LineHighlightElementProps = LineHighlightElementOwnerState & Omit<React.ComponentPropsWithoutRef<'circle'>, 'id'> & {};
 /**
  * Demos:
  *

package/LineChart/LineHighlightElement.js

@@ -85,5 +85,6 @@ process.env.NODE_ENV !== "production" ? LineHighlightElement.propTypes = {
   // | These PropTypes are generated from the TypeScript type definitions |
   // | To update them edit the TypeScript types and run "yarn proptypes"  |
   // ----------------------------------------------------------------------
-  classes: _propTypes.default.object
+  classes: _propTypes.default.object,
+  id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired
 } : void 0;

package/LineChart/MarkElement.d.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { HighlightScope } from '../context/HighlightProvider';
+import { SeriesId } from '../models/seriesType/common';
 export interface MarkElementClasses {
     /** Styles applied to the root element. */
     root: string;
@@ -10,7 +11,7 @@ export interface MarkElementClasses {
 }
 export type MarkElementClassKey = keyof MarkElementClasses;
 interface MarkElementOwnerState {
-    id: string;
+    id: SeriesId;
     color: string;
     isFaded: boolean;
     isHighlighted: boolean;
@@ -18,7 +19,7 @@ interface MarkElementOwnerState {
 }
 export declare function getMarkElementUtilityClass(slot: string): string;
 export declare const markElementClasses: MarkElementClasses;
-export type MarkElementProps = Omit<MarkElementOwnerState, 'isFaded' | 'isHighlighted'> & React.ComponentPropsWithoutRef<'path'> & {
+export type MarkElementProps = Omit<MarkElementOwnerState, 'isFaded' | 'isHighlighted'> & Omit<React.ComponentPropsWithoutRef<'path'>, 'id'> & {
     /**
      * If `true`, animations are skipped.
      * @default false

package/LineChart/MarkElement.js

@@ -147,6 +147,7 @@ process.env.NODE_ENV !== "production" ? MarkElement.propTypes = {
     faded: _propTypes.default.oneOf(['global', 'none', 'series']),
     highlighted: _propTypes.default.oneOf(['item', 'none', 'series'])
   }),
+  id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired,
   /**
    * The shape of the marker.
    */

package/PieChart/PieArc.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { SpringValue } from '@react-spring/web';
 import { HighlightScope } from '../context/HighlightProvider';
+import { PieItemId } from '../models';
 export interface PieArcClasses {
     /** Styles applied to the root element. */
     root: string;
@@ -11,7 +12,7 @@ export interface PieArcClasses {
 }
 export type PieArcClassKey = keyof PieArcClasses;
 interface PieArcOwnerState {
-    id: string;
+    id: PieItemId;
     dataIndex: number;
     color: string;
     isFaded: boolean;
@@ -20,7 +21,7 @@ interface PieArcOwnerState {
 }
 export declare function getPieArcUtilityClass(slot: string): string;
 export declare const pieArcClasses: PieArcClasses;
-export type PieArcProps = PieArcOwnerState & React.ComponentPropsWithoutRef<'path'> & {
+export type PieArcProps = Omit<React.ComponentPropsWithoutRef<'path'>, 'id'> & PieArcOwnerState & {
     startAngle: SpringValue<number>;
     endAngle: SpringValue<number>;
     innerRadius: SpringValue<number>;

package/PieChart/PieArc.js

@@ -106,6 +106,7 @@ process.env.NODE_ENV !== "production" ? PieArc.propTypes = {
     faded: _propTypes.default.oneOf(['global', 'none', 'series']),
     highlighted: _propTypes.default.oneOf(['item', 'none', 'series'])
   }),
+  id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired,
   isFaded: _propTypes.default.bool.isRequired,
   isHighlighted: _propTypes.default.bool.isRequired
 } : void 0;

package/PieChart/PieArcLabel.d.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { SpringValue } from '@react-spring/web';
+import { PieItemId } from '../models/seriesType/pie';
 export interface PieArcLabelClasses {
     /** Styles applied to the root element. */
     root: string;
@@ -10,7 +11,7 @@ export interface PieArcLabelClasses {
 }
 export type PieArcLabelClassKey = keyof PieArcLabelClasses;
 interface PieArcLabelOwnerState {
-    id: string;
+    id: PieItemId;
     color: string;
     isFaded: boolean;
     isHighlighted: boolean;
@@ -18,7 +19,7 @@ interface PieArcLabelOwnerState {
 }
 export declare function getPieArcLabelUtilityClass(slot: string): string;
 export declare const pieArcLabelClasses: PieArcLabelClasses;
-export type PieArcLabelProps = PieArcLabelOwnerState & React.ComponentPropsWithoutRef<'text'> & {
+export type PieArcLabelProps = PieArcLabelOwnerState & Omit<React.ComponentPropsWithoutRef<'text'>, 'id'> & {
     startAngle: SpringValue<number>;
     endAngle: SpringValue<number>;
     innerRadius: SpringValue<number>;

package/PieChart/PieArcLabel.js

@@ -109,6 +109,7 @@ process.env.NODE_ENV !== "production" ? PieArcLabel.propTypes = {
   // ----------------------------------------------------------------------
   classes: _propTypes.default.object,
   formattedArcLabel: _propTypes.default.string,
+  id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired,
   isFaded: _propTypes.default.bool.isRequired,
   isHighlighted: _propTypes.default.bool.isRequired
 } : void 0;

package/PieChart/PieArcLabelPlot.js

@@ -166,7 +166,7 @@ process.env.NODE_ENV !== "production" ? PieArcLabelPlot.propTypes = {
     faded: _propTypes.default.oneOf(['global', 'none', 'series']),
     highlighted: _propTypes.default.oneOf(['item', 'none', 'series'])
   }),
-  id: _propTypes.default.string.isRequired,
+  id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired,
   /**
    * The radius between circle center and the begining of the arc.
    * @default 0

package/PieChart/PieArcPlot.js

@@ -146,7 +146,7 @@ process.env.NODE_ENV !== "production" ? PieArcPlot.propTypes = {
     faded: _propTypes.default.oneOf(['global', 'none', 'series']),
     highlighted: _propTypes.default.oneOf(['item', 'none', 'series'])
   }),
-  id: _propTypes.default.string.isRequired,
+  id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired,
   /**
    * The radius between circle center and the begining of the arc.
    * @default 0

package/PieChart/PieChart.js

@@ -119,7 +119,7 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
    * @default null
    */
   bottomAxis: _propTypes.default.oneOfType([_propTypes.default.shape({
-    axisId: _propTypes.default.string,
+    axisId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
     classes: _propTypes.default.object,
     disableLine: _propTypes.default.bool,
     disableTicks: _propTypes.default.bool,
@@ -169,7 +169,7 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
    * @default null
    */
   leftAxis: _propTypes.default.oneOfType([_propTypes.default.shape({
-    axisId: _propTypes.default.string,
+    axisId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
     classes: _propTypes.default.object,
     disableLine: _propTypes.default.bool,
     disableTicks: _propTypes.default.bool,
@@ -223,7 +223,7 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
    * @default null
    */
   rightAxis: _propTypes.default.oneOfType([_propTypes.default.shape({
-    axisId: _propTypes.default.string,
+    axisId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
     classes: _propTypes.default.object,
     disableLine: _propTypes.default.bool,
     disableTicks: _propTypes.default.bool,
@@ -272,7 +272,7 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
    * @default null
    */
   topAxis: _propTypes.default.oneOfType([_propTypes.default.shape({
-    axisId: _propTypes.default.string,
+    axisId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
     classes: _propTypes.default.object,
     disableLine: _propTypes.default.bool,
     disableTicks: _propTypes.default.bool,
@@ -309,7 +309,7 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
    * If not provided, a default axis config is used with id set to `DEFAULT_X_AXIS_KEY`.
    */
   xAxis: _propTypes.default.arrayOf(_propTypes.default.shape({
-    axisId: _propTypes.default.string,
+    axisId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
     classes: _propTypes.default.object,
     data: _propTypes.default.array,
     dataKey: _propTypes.default.string,
@@ -317,13 +317,14 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
     disableTicks: _propTypes.default.bool,
     fill: _propTypes.default.string,
     hideTooltip: _propTypes.default.bool,
-    id: _propTypes.default.string,
+    id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
     label: _propTypes.default.string,
     labelFontSize: _propTypes.default.number,
     labelStyle: _propTypes.default.object,
     max: _propTypes.default.oneOfType([_propTypes.default.instanceOf(Date), _propTypes.default.number]),
     min: _propTypes.default.oneOfType([_propTypes.default.instanceOf(Date), _propTypes.default.number]),
     position: _propTypes.default.oneOf(['bottom', 'left', 'right', 'top']),
+    reverse: _propTypes.default.bool,
     scaleType: _propTypes.default.oneOf(['band', 'linear', 'log', 'point', 'pow', 'sqrt', 'time', 'utc']),
     slotProps: _propTypes.default.object,
     slots: _propTypes.default.object,
@@ -343,7 +344,7 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
    * If not provided, a default axis config is used with id set to `DEFAULT_Y_AXIS_KEY`.
    */
   yAxis: _propTypes.default.arrayOf(_propTypes.default.shape({
-    axisId: _propTypes.default.string,
+    axisId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
     classes: _propTypes.default.object,
     data: _propTypes.default.array,
     dataKey: _propTypes.default.string,
@@ -351,13 +352,14 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
     disableTicks: _propTypes.default.bool,
     fill: _propTypes.default.string,
     hideTooltip: _propTypes.default.bool,
-    id: _propTypes.default.string,
+    id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
     label: _propTypes.default.string,
     labelFontSize: _propTypes.default.number,
     labelStyle: _propTypes.default.object,
     max: _propTypes.default.oneOfType([_propTypes.default.instanceOf(Date), _propTypes.default.number]),
     min: _propTypes.default.oneOfType([_propTypes.default.instanceOf(Date), _propTypes.default.number]),
     position: _propTypes.default.oneOf(['bottom', 'left', 'right', 'top']),
+    reverse: _propTypes.default.bool,
     scaleType: _propTypes.default.oneOf(['band', 'linear', 'log', 'point', 'pow', 'sqrt', 'time', 'utc']),
     slotProps: _propTypes.default.object,
     slots: _propTypes.default.object,