@mui/x-charts 6.19.3 → 6.19.4

package/esm/PieChart/PieChart.js

@@ -111,7 +111,7 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
    * @default null
    */
   bottomAxis: PropTypes.oneOfType([PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
@@ -161,7 +161,7 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
    * @default null
    */
   leftAxis: PropTypes.oneOfType([PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
@@ -215,7 +215,7 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
    * @default null
    */
   rightAxis: PropTypes.oneOfType([PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
@@ -273,7 +273,7 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
       faded: PropTypes.oneOf(['global', 'none', 'series']),
       highlighted: PropTypes.oneOf(['item', 'none', 'series'])
     }),
-    id: PropTypes.string,
+    id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     innerRadius: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     outerRadius: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     paddingAngle: PropTypes.number,
@@ -309,7 +309,7 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
    * @default null
    */
   topAxis: PropTypes.oneOfType([PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
@@ -346,7 +346,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.arrayOf(PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     data: PropTypes.array,
     dataKey: PropTypes.string,
@@ -354,13 +354,14 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
     disableTicks: PropTypes.bool,
     fill: PropTypes.string,
     hideTooltip: PropTypes.bool,
-    id: PropTypes.string,
+    id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     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']),
+    reverse: PropTypes.bool,
     scaleType: PropTypes.oneOf(['band', 'linear', 'log', 'point', 'pow', 'sqrt', 'time', 'utc']),
     slotProps: PropTypes.object,
     slots: PropTypes.object,
@@ -380,7 +381,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.arrayOf(PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     data: PropTypes.array,
     dataKey: PropTypes.string,
@@ -388,13 +389,14 @@ process.env.NODE_ENV !== "production" ? PieChart.propTypes = {
     disableTicks: PropTypes.bool,
     fill: PropTypes.string,
     hideTooltip: PropTypes.bool,
-    id: PropTypes.string,
+    id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     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']),
+    reverse: PropTypes.bool,
     scaleType: PropTypes.oneOf(['band', 'linear', 'log', 'point', 'pow', 'sqrt', 'time', 'utc']),
     slotProps: PropTypes.object,
     slots: PropTypes.object,

package/esm/ScatterChart/Scatter.js

@@ -88,7 +88,7 @@ process.env.NODE_ENV !== "production" ? Scatter.propTypes = {
       faded: PropTypes.oneOf(['global', 'none', 'series']),
       highlighted: PropTypes.oneOf(['item', 'none', 'series'])
     }),
-    id: PropTypes.string.isRequired,
+    id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
     label: PropTypes.string,
     markerSize: PropTypes.number,
     type: PropTypes.oneOf(['scatter']).isRequired,

package/esm/ScatterChart/ScatterChart.js

@@ -88,7 +88,7 @@ process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
    * @default xAxisIds[0] The id of the first provided axis
    */
   bottomAxis: PropTypes.oneOfType([PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
@@ -138,7 +138,7 @@ process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
    * @default yAxisIds[0] The id of the first provided axis
    */
   leftAxis: PropTypes.oneOfType([PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
@@ -191,7 +191,7 @@ process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
    * @default null
    */
   rightAxis: PropTypes.oneOfType([PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
@@ -223,7 +223,7 @@ process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
       faded: PropTypes.oneOf(['global', 'none', 'series']),
       highlighted: PropTypes.oneOf(['item', 'none', 'series'])
     }),
-    id: PropTypes.string,
+    id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     label: PropTypes.string,
     markerSize: PropTypes.number,
     type: PropTypes.oneOf(['scatter']),
@@ -257,7 +257,7 @@ process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
    * @default null
    */
   topAxis: PropTypes.oneOfType([PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
@@ -294,7 +294,7 @@ process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
    * If not provided, a default axis config is used with id set to `DEFAULT_X_AXIS_KEY`.
    */
   xAxis: PropTypes.arrayOf(PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     data: PropTypes.array,
     dataKey: PropTypes.string,
@@ -302,13 +302,14 @@ process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
     disableTicks: PropTypes.bool,
     fill: PropTypes.string,
     hideTooltip: PropTypes.bool,
-    id: PropTypes.string,
+    id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     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']),
+    reverse: PropTypes.bool,
     scaleType: PropTypes.oneOf(['band', 'linear', 'log', 'point', 'pow', 'sqrt', 'time', 'utc']),
     slotProps: PropTypes.object,
     slots: PropTypes.object,
@@ -328,7 +329,7 @@ process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
    * If not provided, a default axis config is used with id set to `DEFAULT_Y_AXIS_KEY`.
    */
   yAxis: PropTypes.arrayOf(PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     data: PropTypes.array,
     dataKey: PropTypes.string,
@@ -336,13 +337,14 @@ process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
     disableTicks: PropTypes.bool,
     fill: PropTypes.string,
     hideTooltip: PropTypes.bool,
-    id: PropTypes.string,
+    id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     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']),
+    reverse: PropTypes.bool,
     scaleType: PropTypes.oneOf(['band', 'linear', 'log', 'point', 'pow', 'sqrt', 'time', 'utc']),
     slotProps: PropTypes.object,
     slots: PropTypes.object,

package/esm/SparkLineChart/SparkLineChart.js

@@ -223,7 +223,7 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
    * Notice it is a single configuration object, not an array of configuration.
    */
   xAxis: PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     data: PropTypes.array,
     dataKey: PropTypes.string,
@@ -231,13 +231,14 @@ process.env.NODE_ENV !== "production" ? SparkLineChart.propTypes = {
     disableTicks: PropTypes.bool,
     fill: PropTypes.string,
     hideTooltip: PropTypes.bool,
-    id: PropTypes.string,
+    id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     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']),
+    reverse: PropTypes.bool,
     scaleType: PropTypes.oneOf(['band', 'linear', 'log', 'point', 'pow', 'sqrt', 'time', 'utc']),
     slotProps: PropTypes.object,
     slots: PropTypes.object,

package/esm/context/CartesianContextProvider.js

@@ -110,7 +110,7 @@ function CartesianContextProvider(props) {
       var _axis$scaleType, _axis$min, _axis$max, _axis$min2, _axis$max2;
       const isDefaultAxis = axisIndex === 0;
       const [minData, maxData] = getAxisExtremum(axis, xExtremumGetters, isDefaultAxis);
-      const range = [drawingArea.left, drawingArea.left + drawingArea.width];
+      const range = axis.reverse ? [drawingArea.left + drawingArea.width, drawingArea.left] : [drawingArea.left, drawingArea.left + drawingArea.width];
       if (isBandScaleConfig(axis)) {
         var _axis$categoryGapRati, _axis$barGapRatio;
         const categoryGapRatio = (_axis$categoryGapRati = axis.categoryGapRatio) != null ? _axis$categoryGapRati : DEFAULT_CATEGORY_GAP_RATIO;
@@ -161,7 +161,7 @@ function CartesianContextProvider(props) {
       var _axis$scaleType2, _axis$min3, _axis$max3, _axis$min4, _axis$max4;
       const isDefaultAxis = axisIndex === 0;
       const [minData, maxData] = getAxisExtremum(axis, yExtremumGetters, isDefaultAxis);
-      const range = [drawingArea.top + drawingArea.height, drawingArea.top];
+      const range = axis.reverse ? [drawingArea.top, drawingArea.top + drawingArea.height] : [drawingArea.top + drawingArea.height, drawingArea.top];
       if (isBandScaleConfig(axis)) {
         var _axis$categoryGapRati2;
         const categoryGapRatio = (_axis$categoryGapRati2 = axis.categoryGapRatio) != null ? _axis$categoryGapRati2 : DEFAULT_CATEGORY_GAP_RATIO;
@@ -231,7 +231,7 @@ process.env.NODE_ENV !== "production" ? CartesianContextProvider.propTypes = {
    * If not provided, a default axis config is used with id set to `DEFAULT_X_AXIS_KEY`.
    */
   xAxis: PropTypes.arrayOf(PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     data: PropTypes.array,
     dataKey: PropTypes.string,
@@ -239,13 +239,14 @@ process.env.NODE_ENV !== "production" ? CartesianContextProvider.propTypes = {
     disableTicks: PropTypes.bool,
     fill: PropTypes.string,
     hideTooltip: PropTypes.bool,
-    id: PropTypes.string,
+    id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     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']),
+    reverse: PropTypes.bool,
     scaleType: PropTypes.oneOf(['band', 'linear', 'log', 'point', 'pow', 'sqrt', 'time', 'utc']),
     slotProps: PropTypes.object,
     slots: PropTypes.object,
@@ -265,7 +266,7 @@ process.env.NODE_ENV !== "production" ? CartesianContextProvider.propTypes = {
    * If not provided, a default axis config is used with id set to `DEFAULT_Y_AXIS_KEY`.
    */
   yAxis: PropTypes.arrayOf(PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     data: PropTypes.array,
     dataKey: PropTypes.string,
@@ -273,13 +274,14 @@ process.env.NODE_ENV !== "production" ? CartesianContextProvider.propTypes = {
     disableTicks: PropTypes.bool,
     fill: PropTypes.string,
     hideTooltip: PropTypes.bool,
-    id: PropTypes.string,
+    id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     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']),
+    reverse: PropTypes.bool,
     scaleType: PropTypes.oneOf(['band', 'linear', 'log', 'point', 'pow', 'sqrt', 'time', 'utc']),
     slotProps: PropTypes.object,
     slots: PropTypes.object,

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-charts v6.19.3
+ * @mui/x-charts v6.19.4
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/internals/defaultizeColor.d.ts

@@ -4,7 +4,7 @@ export declare function defaultizeColor(series: AllSeriesType, seriesIndex: numb
         color: string;
         label?: string | undefined;
         value: number;
-        id?: string | number | undefined;
+        id?: import("../models/seriesType").PieItemId | undefined;
     }[];
     type: "pie";
     innerRadius?: string | number | undefined;
@@ -37,7 +37,7 @@ export declare function defaultizeColor(series: AllSeriesType, seriesIndex: numb
         arcLabelRadius?: number | undefined;
         color?: string | undefined;
     } | undefined;
-    id?: string | undefined;
+    id?: import("../models/seriesType/common").SeriesId | undefined;
     color?: string | undefined;
     valueFormatter?: ((value: import("../models/helpers").MakeOptional<import("../models/seriesType").PieValueType, "id">) => string) | undefined;
     highlightScope?: Partial<import("..").HighlightScope> | undefined;
@@ -48,7 +48,7 @@ export declare function defaultizeColor(series: AllSeriesType, seriesIndex: numb
     label?: string | undefined;
     layout?: "horizontal" | "vertical" | undefined;
     stackOffset?: import("..").StackOffsetType | undefined;
-    id?: string | undefined;
+    id?: import("../models/seriesType/common").SeriesId | undefined;
     color: string;
     valueFormatter?: ((value: number) => string) | undefined;
     highlightScope?: Partial<import("..").HighlightScope> | undefined;
@@ -56,6 +56,17 @@ export declare function defaultizeColor(series: AllSeriesType, seriesIndex: numb
     yAxisKey?: string | undefined;
     stack?: string | undefined;
     stackOrder?: import("..").StackOrderType | undefined;
+} | {
+    type: "scatter";
+    data: import("../models/seriesType").ScatterValueType[];
+    markerSize?: number | undefined;
+    label?: string | undefined;
+    id?: import("../models/seriesType/common").SeriesId | undefined;
+    color: string;
+    valueFormatter?: ((value: import("../models/seriesType").ScatterValueType) => string) | undefined;
+    highlightScope?: Partial<import("..").HighlightScope> | undefined;
+    xAxisKey?: string | undefined;
+    yAxisKey?: string | undefined;
 } | {
     type: "line";
     data?: (number | null)[] | undefined;
@@ -68,22 +79,11 @@ export declare function defaultizeColor(series: AllSeriesType, seriesIndex: numb
     disableHighlight?: boolean | undefined;
     connectNulls?: boolean | undefined;
     stackOffset?: import("..").StackOffsetType | undefined;
-    id?: string | undefined;
+    id?: import("../models/seriesType/common").SeriesId | undefined;
     color: string;
     valueFormatter?: ((value: number) => string) | undefined;
     highlightScope?: Partial<import("..").HighlightScope> | undefined;
     xAxisKey?: string | undefined;
     yAxisKey?: string | undefined;
     stackOrder?: import("..").StackOrderType | undefined;
-} | {
-    type: "scatter";
-    data: import("../models/seriesType").ScatterValueType[];
-    markerSize?: number | undefined;
-    label?: string | undefined;
-    id?: string | undefined;
-    color: string;
-    valueFormatter?: ((value: import("../models/seriesType").ScatterValueType) => string) | undefined;
-    highlightScope?: Partial<import("..").HighlightScope> | undefined;
-    xAxisKey?: string | undefined;
-    yAxisKey?: string | undefined;
 };

package/internals/defaultizeValueFormatter.d.ts

@@ -1,10 +1,7 @@
+import { SeriesId } from '../models/seriesType/common';
 declare function defaultizeValueFormatter<ISeries extends {
     valueFormatter?: IFormatter;
-}, IFormatter extends (v: any) => string>(series: {
-    [id: string]: ISeries;
-}, defaultValueFormatter: IFormatter): {
-    [id: string]: ISeries & {
-        valueFormatter: IFormatter;
-    };
-};
+}, IFormatter extends (v: any) => string>(series: Record<SeriesId, ISeries>, defaultValueFormatter: IFormatter): Record<SeriesId, ISeries & {
+    valueFormatter: IFormatter;
+}>;
 export default defaultizeValueFormatter;

package/internals/stackSeries.d.ts

@@ -1,21 +1,18 @@
 import { Series } from 'd3-shape';
 import type { BarSeriesType, LineSeriesType } from '../models/seriesType';
 import type { StackOffsetType, StackOrderType } from '../models/stacking';
-type StackableSeries = {
-    [id: string]: BarSeriesType;
-} | {
-    [id: string]: LineSeriesType;
-};
+import { SeriesId } from '../models/seriesType/common';
+type StackableSeries = Record<SeriesId, BarSeriesType> | Record<SeriesId, LineSeriesType>;
 type FormatterParams = {
     series: StackableSeries;
-    seriesOrder: string[];
+    seriesOrder: SeriesId[];
     defaultStrategy?: {
         stackOrder?: StackOrderType;
         stackOffset?: StackOffsetType;
     };
 };
 export type StackingGroupsType = {
-    ids: string[];
+    ids: SeriesId[];
     stackingOrder: (series: Series<any, any>) => number[];
     stackingOffset: (series: Series<any, any>, order: Iterable<number>) => void;
 }[];

package/legacy/BarChart/BarChart.js

@@ -136,7 +136,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
    * @default xAxisIds[0] The id of the first provided axis
    */
   bottomAxis: PropTypes.oneOfType([PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
@@ -187,7 +187,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
    * @default yAxisIds[0] The id of the first provided axis
    */
   leftAxis: PropTypes.oneOfType([PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
@@ -240,7 +240,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
    * @default null
    */
   rightAxis: PropTypes.oneOfType([PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
@@ -269,7 +269,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
       faded: PropTypes.oneOf(['global', 'none', 'series']),
       highlighted: PropTypes.oneOf(['item', 'none', 'series'])
     }),
-    id: PropTypes.string,
+    id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     label: PropTypes.string,
     layout: PropTypes.oneOf(['horizontal', 'vertical']),
     stack: PropTypes.string,
@@ -311,7 +311,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
    * @default null
    */
   topAxis: PropTypes.oneOfType([PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
@@ -348,7 +348,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
    * If not provided, a default axis config is used with id set to `DEFAULT_X_AXIS_KEY`.
    */
   xAxis: PropTypes.arrayOf(PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     data: PropTypes.array,
     dataKey: PropTypes.string,
@@ -356,13 +356,14 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     disableTicks: PropTypes.bool,
     fill: PropTypes.string,
     hideTooltip: PropTypes.bool,
-    id: PropTypes.string,
+    id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     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']),
+    reverse: PropTypes.bool,
     scaleType: PropTypes.oneOf(['band', 'linear', 'log', 'point', 'pow', 'sqrt', 'time', 'utc']),
     slotProps: PropTypes.object,
     slots: PropTypes.object,
@@ -382,7 +383,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
    * If not provided, a default axis config is used with id set to `DEFAULT_Y_AXIS_KEY`.
    */
   yAxis: PropTypes.arrayOf(PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     data: PropTypes.array,
     dataKey: PropTypes.string,
@@ -390,13 +391,14 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     disableTicks: PropTypes.bool,
     fill: PropTypes.string,
     hideTooltip: PropTypes.bool,
-    id: PropTypes.string,
+    id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     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']),
+    reverse: PropTypes.bool,
     scaleType: PropTypes.oneOf(['band', 'linear', 'log', 'point', 'pow', 'sqrt', 'time', 'utc']),
     slotProps: PropTypes.object,
     slots: PropTypes.object,

package/legacy/BarChart/BarElement.js

@@ -101,6 +101,7 @@ process.env.NODE_ENV !== "production" ? BarElement.propTypes = {
     faded: PropTypes.oneOf(['global', 'none', 'series']),
     highlighted: PropTypes.oneOf(['item', 'none', 'series'])
   }),
+  id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
   /**
    * The props used for each component slot.
    * @default {}

package/legacy/BarChart/BarPlot.js

@@ -10,7 +10,7 @@ import { CartesianContext } from '../context/CartesianContextProvider';
 import { BarElement } from './BarElement';
 import { isBandScaleConfig } from '../models/axis';
 import { DEFAULT_X_AXIS_KEY, DEFAULT_Y_AXIS_KEY } from '../constants';
-
+import { jsx as _jsx } from "react/jsx-runtime";
 /**
  * Solution of the equations
  * W = barWidth * N + offset * (N-1)
@@ -20,7 +20,6 @@ import { DEFAULT_X_AXIS_KEY, DEFAULT_Y_AXIS_KEY } from '../constants';
  * @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(_ref) {
   var W = _ref.bandWidth,
     N = _ref.numberOfGroups,
@@ -97,20 +96,21 @@ var useCompletedData = function useCompletedData() {
         color = _series$seriesId.color;
       return stackedData.map(function (values, dataIndex) {
         var _xAxis$xAxisKey$data, _yAxis$yAxisKey$data;
-        var bottom = Math.min.apply(Math, _toConsumableArray(values));
-        var top = Math.max.apply(Math, _toConsumableArray(values));
+        var valueCoordinates = values.map(function (v) {
+          return verticalLayout ? yScale(v) : xScale(v);
+        });
+        var minValueCoord = Math.min.apply(Math, _toConsumableArray(valueCoordinates));
+        var maxValueCoord = Math.max.apply(Math, _toConsumableArray(valueCoordinates));
         return {
-          bottom: bottom,
-          top: top,
           seriesId: seriesId,
           dataIndex: dataIndex,
           layout: series[seriesId].layout,
-          x: verticalLayout ? xScale((_xAxis$xAxisKey$data = xAxis[xAxisKey].data) == null ? void 0 : _xAxis$xAxisKey$data[dataIndex]) + barOffset : xScale(bottom),
-          y: verticalLayout ? yScale(top) : yScale((_yAxis$yAxisKey$data = yAxis[yAxisKey].data) == null ? void 0 : _yAxis$yAxisKey$data[dataIndex]) + barOffset,
+          x: verticalLayout ? xScale((_xAxis$xAxisKey$data = xAxis[xAxisKey].data) == null ? void 0 : _xAxis$xAxisKey$data[dataIndex]) + barOffset : minValueCoord,
+          y: verticalLayout ? minValueCoord : yScale((_yAxis$yAxisKey$data = yAxis[yAxisKey].data) == null ? void 0 : _yAxis$yAxisKey$data[dataIndex]) + barOffset,
           xOrigin: xScale(0),
           yOrigin: yScale(0),
-          height: verticalLayout ? Math.abs(yScale(bottom) - yScale(top)) : barWidth,
-          width: verticalLayout ? barWidth : Math.abs(xScale(bottom) - xScale(top)),
+          height: verticalLayout ? maxValueCoord - minValueCoord : barWidth,
+          width: verticalLayout ? barWidth : maxValueCoord - minValueCoord,
           color: color,
           highlightScope: series[seriesId].highlightScope
         };

package/legacy/ChartsAxis/ChartsAxis.js

@@ -99,7 +99,7 @@ process.env.NODE_ENV !== "production" ? ChartsAxis.propTypes = {
    * @default xAxisIds[0] The id of the first provided axis
    */
   bottomAxis: PropTypes.oneOfType([PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
@@ -126,7 +126,7 @@ process.env.NODE_ENV !== "production" ? ChartsAxis.propTypes = {
    * @default yAxisIds[0] The id of the first provided axis
    */
   leftAxis: PropTypes.oneOfType([PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
@@ -153,7 +153,7 @@ process.env.NODE_ENV !== "production" ? ChartsAxis.propTypes = {
    * @default null
    */
   rightAxis: PropTypes.oneOfType([PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,
@@ -190,7 +190,7 @@ process.env.NODE_ENV !== "production" ? ChartsAxis.propTypes = {
    * @default null
    */
   topAxis: PropTypes.oneOfType([PropTypes.shape({
-    axisId: PropTypes.string,
+    axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     classes: PropTypes.object,
     disableLine: PropTypes.bool,
     disableTicks: PropTypes.bool,