@mui/x-charts 8.19.0 → 8.21.0

package/BarChart/BarChart.d.ts

@@ -21,7 +21,7 @@ export interface BarChartProps extends Omit<ChartContainerProps<'bar', BarChartP
    * The series to display in the bar chart.
    * An array of [[BarSeries]] objects.
    */
-  series: Readonly<BarSeries[]>;
+  series: ReadonlyArray<BarSeries>;
   /**
    * Option to display a cartesian grid in the background.
    */

package/BarChart/BarChart.js

@@ -308,6 +308,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func
   }), _propTypes.default.shape({
     axis: _propTypes.default.oneOf(['x']),
@@ -360,6 +361,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func
   }), _propTypes.default.shape({
     axis: _propTypes.default.oneOf(['x']),
@@ -404,6 +406,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func
   }), _propTypes.default.shape({
     axis: _propTypes.default.oneOf(['x']),
@@ -449,6 +452,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func
   }), _propTypes.default.shape({
     axis: _propTypes.default.oneOf(['x']),
@@ -493,6 +497,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func
   }), _propTypes.default.shape({
     axis: _propTypes.default.oneOf(['x']),
@@ -537,6 +542,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func
   }), _propTypes.default.shape({
     axis: _propTypes.default.oneOf(['x']),
@@ -585,6 +591,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func
   }), _propTypes.default.shape({
     axis: _propTypes.default.oneOf(['x']),
@@ -633,6 +640,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func
   }), _propTypes.default.shape({
     axis: _propTypes.default.oneOf(['x']),
@@ -677,6 +685,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func
   })]).isRequired),
   /**
@@ -735,6 +744,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     width: _propTypes.default.number
   }), _propTypes.default.shape({
@@ -786,6 +796,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     width: _propTypes.default.number
   }), _propTypes.default.shape({
@@ -829,6 +840,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     width: _propTypes.default.number
   }), _propTypes.default.shape({
@@ -873,6 +885,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     width: _propTypes.default.number
   }), _propTypes.default.shape({
@@ -916,6 +929,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     width: _propTypes.default.number
   }), _propTypes.default.shape({
@@ -959,6 +973,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     width: _propTypes.default.number
   }), _propTypes.default.shape({
@@ -1006,6 +1021,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     width: _propTypes.default.number
   }), _propTypes.default.shape({
@@ -1053,6 +1069,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     width: _propTypes.default.number
   }), _propTypes.default.shape({
@@ -1096,6 +1113,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes = {
     tickNumber: _propTypes.default.number,
     tickPlacement: _propTypes.default.oneOf(['end', 'extremities', 'middle', 'start']),
     tickSize: _propTypes.default.number,
+    tickSpacing: _propTypes.default.number,
     valueFormatter: _propTypes.default.func,
     width: _propTypes.default.number
   })]).isRequired)

package/BarChart/BarLabel/BarLabel.types.d.ts

@@ -1,5 +1,6 @@
 import { SeriesId } from "../../models/seriesType/common.js";
 import type { BarLabelClasses } from "./barLabelClasses.js";
+import { BarValueType } from "../../models/index.js";
 export interface BarLabelOwnerState {
   seriesId: SeriesId;
   dataIndex: number;
@@ -10,7 +11,7 @@ export interface BarLabelOwnerState {
   layout: 'vertical' | 'horizontal';
   classes?: Partial<BarLabelClasses>;
 }
-export type BarItem = {
+export type BarItem<V extends BarValueType | null = BarValueType | null> = {
   /**
    * The series id of the bar.
    */
@@ -22,7 +23,7 @@ export type BarItem = {
   /**
    * The value of the data point.
    */
-  value: number | null;
+  value: V;
 };
 export type BarLabelContext = {
   bar: {
@@ -38,4 +39,4 @@ export type BarLabelContext = {
     width: number;
   };
 };
-export type BarLabelFunction = (item: BarItem, context: BarLabelContext) => string | null | undefined;
+export type BarLabelFunction<V extends BarValueType | null = BarValueType | null> = (item: BarItem<V>, context: BarLabelContext) => string | null | undefined;

package/BarChart/BarLabel/BarLabelItem.d.ts

@@ -2,6 +2,7 @@ import * as React from 'react';
 import { SlotComponentPropsFromProps } from '@mui/x-internals/types';
 import { BarLabelOwnerState, BarItem, BarLabelContext } from "./BarLabel.types.js";
 import { BarLabelProps } from "./BarLabel.js";
+import { BarValueType } from "../../models/index.js";
 export interface BarLabelSlots {
   /**
    * The component that renders the bar label.
@@ -12,7 +13,7 @@ export interface BarLabelSlots {
 export interface BarLabelSlotProps {
   barLabel?: SlotComponentPropsFromProps<BarLabelProps, {}, BarLabelOwnerState>;
 }
-export type BarLabelItemProps = Omit<BarLabelOwnerState, 'isFaded' | 'isHighlighted'> & Pick<BarLabelProps, 'style'> & {
+export type BarLabelItemProps<V extends BarValueType | null> = Omit<BarLabelOwnerState, 'isFaded' | 'isHighlighted'> & Pick<BarLabelProps, 'style'> & {
   /**
    * The props used for each component slot.
    * @default {}
@@ -54,7 +55,7 @@ export type BarLabelItemProps = Omit<BarLabelOwnerState, 'isFaded' | 'isHighligh
   /**
    * The value of the data point.
    */
-  value: number | null;
+  value: V;
   /**
    * If true, no animations should be applied.
    */
@@ -66,7 +67,7 @@ export type BarLabelItemProps = Omit<BarLabelOwnerState, 'isFaded' | 'isHighligh
    * @param {BarLabelContext} context data about the bar.
    * @returns {string} The formatted label.
    */
-  barLabel?: 'value' | ((item: BarItem, context: BarLabelContext) => string | null | undefined);
+  barLabel?: 'value' | ((item: BarItem<V>, context: BarLabelContext) => string | null | undefined);
   /**
    * The placement of the bar label.
    * It controls whether the label is rendered in the center or outside the bar.
@@ -77,7 +78,7 @@ export type BarLabelItemProps = Omit<BarLabelOwnerState, 'isFaded' | 'isHighligh
 /**
  * @ignore - internal component.
  */
-declare function BarLabelItem(props: BarLabelItemProps): import("react/jsx-runtime").JSX.Element | null;
+declare function BarLabelItem<V extends BarValueType | null = BarValueType | null>(props: BarLabelItemProps<V>): import("react/jsx-runtime").JSX.Element | null;
 declare namespace BarLabelItem {
   var propTypes: any;
 }

package/BarChart/BarLabel/BarLabelPlot.d.ts

@@ -1,12 +1,31 @@
-import type { ProcessedBarSeriesData } from "../types.js";
+import { AnimationData } from "../types.js";
 import { BarLabelItemProps } from "./BarLabelItem.js";
-type BarLabelPlotProps = {
-  processedSeries: ProcessedBarSeriesData;
+import type { SeriesId } from "../../models/seriesType/common.js";
+import { BarSeriesType, BarValueType } from "../../models/seriesType/bar.js";
+import { BarLabelFunction } from "./BarLabel.types.js";
+interface BarLabelPlotProps<V extends BarValueType | null = BarValueType | null> {
+  processedSeries: ProcessedBarLabelSeriesData<V>;
+  className: string;
   skipAnimation?: boolean;
-  barLabel?: BarLabelItemProps['barLabel'];
-};
+  barLabel?: BarLabelItemProps<V | null>['barLabel'];
+}
+export interface ProcessedBarLabelSeriesData<V extends BarValueType | null> {
+  seriesId: SeriesId;
+  data: ProcessedBarLabelData<V>[];
+  barLabel?: 'value' | BarLabelFunction<V>;
+  barLabelPlacement?: BarSeriesType['barLabelPlacement'];
+  layout?: 'vertical' | 'horizontal';
+  xOrigin: number;
+  yOrigin: number;
+}
+export interface ProcessedBarLabelData<V extends BarValueType | null> extends AnimationData {
+  seriesId: SeriesId;
+  dataIndex: number;
+  color: string;
+  value: V;
+}
 /**
  * @ignore - internal component.
  */
-declare function BarLabelPlot(props: BarLabelPlotProps): import("react/jsx-runtime").JSX.Element | null;
+declare function BarLabelPlot<V extends BarValueType | null = BarValueType | null>(props: BarLabelPlotProps<V>): import("react/jsx-runtime").JSX.Element | null;
 export { BarLabelPlot };

package/BarChart/BarLabel/BarLabelPlot.js

@@ -1,48 +1,49 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.BarLabelPlot = BarLabelPlot;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var React = _interopRequireWildcard(require("react"));
 var _BarLabelItem = require("./BarLabelItem");
-var _barClasses = require("../barClasses");
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["processedSeries", "skipAnimation"];
+const _excluded = ["processedSeries", "className", "skipAnimation"];
 /**
  * @ignore - internal component.
  */
 function BarLabelPlot(props) {
   const {
       processedSeries,
+      className,
       skipAnimation
     } = props,
     other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
   const {
     seriesId,
-    data
+    data,
+    layout,
+    xOrigin,
+    yOrigin
   } = processedSeries;
-  const classes = (0, _barClasses.useUtilityClasses)();
   const barLabel = processedSeries.barLabel ?? props.barLabel;
   if (!barLabel) {
     return null;
   }
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("g", {
-    className: classes.seriesLabels,
+    className: className,
     "data-series": seriesId,
     children: data.map(({
-      xOrigin,
-      yOrigin,
       x,
       y,
       dataIndex,
       color,
       value,
       width,
-      height,
-      layout
+      height
     }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_BarLabelItem.BarLabelItem, (0, _extends2.default)({
       seriesId: seriesId,
       dataIndex: dataIndex,

package/BarChart/BarLabel/getBarLabel.d.ts

@@ -1,10 +1,11 @@
 import { SeriesId } from "../../models/seriesType/common.js";
 import { BarLabelFunction } from "./BarLabel.types.js";
-export declare const getBarLabel: (options: {
-  barLabel: "value" | BarLabelFunction;
-  value: number | null;
+import { BarValueType } from "../../models/seriesType/bar.js";
+export declare function getBarLabel<V extends BarValueType | null = BarValueType | null>(options: {
+  barLabel: 'value' | BarLabelFunction<V>;
+  value: V;
   dataIndex: number;
   seriesId: SeriesId;
   height: number;
   width: number;
-}) => string | null | undefined;
+}): string | null | undefined;

package/BarChart/BarLabel/getBarLabel.js

@@ -3,8 +3,8 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getBarLabel = void 0;
-const getBarLabel = options => {
+exports.getBarLabel = getBarLabel;
+function getBarLabel(options) {
   const {
     barLabel,
     value,
@@ -27,5 +27,4 @@ const getBarLabel = options => {
       width
     }
   });
-};
-exports.getBarLabel = getBarLabel;
+}

package/BarChart/BarPlot.js

@@ -95,6 +95,9 @@ function BarPlot(props) {
       }, id);
     }), completedData.map(({
       seriesId,
+      layout,
+      xOrigin,
+      yOrigin,
       data
     }) => {
       return /*#__PURE__*/(0, _jsxRuntime.jsx)("g", {
@@ -104,11 +107,8 @@ function BarPlot(props) {
           dataIndex,
           color,
           maskId,
-          layout,
           x,
-          xOrigin,
           y,
-          yOrigin,
           width,
           height
         }) => {
@@ -143,6 +143,7 @@ function BarPlot(props) {
         })
       }, seriesId);
     }), completedData.map(processedSeries => /*#__PURE__*/(0, _jsxRuntime.jsx)(_BarLabelPlot.BarLabelPlot, (0, _extends2.default)({
+      className: classes.seriesLabels,
       processedSeries: processedSeries,
       skipAnimation: skipAnimation,
       barLabel: barLabel

package/BarChart/checkBarChartScaleErrors.d.ts

@@ -0,0 +1,7 @@
+import { AxisId, ComputedXAxis, ComputedYAxis } from "../models/axis.js";
+import { SeriesId } from "../models/seriesType/common.js";
+export declare function checkBarChartScaleErrors(verticalLayout: boolean, seriesId: SeriesId, seriesDataLength: number, xAxisId: AxisId, xAxis: {
+  [axisId: AxisId]: Pick<ComputedXAxis, 'scaleType' | 'data'>;
+}, yAxisId: AxisId, yAxis: {
+  [axisId: AxisId]: Pick<ComputedYAxis, 'scaleType' | 'data'>;
+}): void;

package/BarChart/{checkScaleErrors.js → checkBarChartScaleErrors.js}

@@ -3,17 +3,16 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.checkScaleErrors = checkScaleErrors;
+exports.checkBarChartScaleErrors = checkBarChartScaleErrors;
 var _warning = require("@mui/x-internals/warning");
 var _constants = require("../constants");
-var _axis = require("../models/axis");
 const getAxisMessage = (axisDirection, axisId) => {
   const axisName = `${axisDirection}-axis`;
   const axisIdName = `${axisDirection}Axis`;
   const axisDefaultKey = axisDirection === 'x' ? _constants.DEFAULT_X_AXIS_KEY : _constants.DEFAULT_Y_AXIS_KEY;
   return axisId === axisDefaultKey ? `The first \`${axisIdName}\`` : `The ${axisName} with id "${axisId}"`;
 };
-function checkScaleErrors(verticalLayout, seriesId, series, xAxisId, xAxis, yAxisId, yAxis) {
+function checkBarChartScaleErrors(verticalLayout, seriesId, seriesDataLength, xAxisId, xAxis, yAxisId, yAxis) {
   const xAxisConfig = xAxis[xAxisId];
   const yAxisConfig = yAxis[yAxisId];
   const discreteAxisConfig = verticalLayout ? xAxisConfig : yAxisConfig;
@@ -22,18 +21,18 @@ function checkScaleErrors(verticalLayout, seriesId, series, xAxisId, xAxis, yAxi
   const continuousAxisId = verticalLayout ? yAxisId : xAxisId;
   const discreteAxisDirection = verticalLayout ? 'x' : 'y';
   const continuousAxisDirection = verticalLayout ? 'y' : 'x';
-  if (!(0, _axis.isBandScaleConfig)(discreteAxisConfig)) {
+  if (discreteAxisConfig.scaleType !== 'band') {
     throw new Error(`MUI X Charts: ${getAxisMessage(discreteAxisDirection, discreteAxisId)} should be of type "band" to display the bar series of id "${seriesId}".`);
   }
   if (discreteAxisConfig.data === undefined) {
     throw new Error(`MUI X Charts: ${getAxisMessage(discreteAxisDirection, discreteAxisId)} should have data property.`);
   }
-  if ((0, _axis.isBandScaleConfig)(continuousAxisConfig) || (0, _axis.isPointScaleConfig)(continuousAxisConfig)) {
+  if (continuousAxisConfig.scaleType === 'band' || continuousAxisConfig.scaleType === 'point') {
     throw new Error(`MUI X Charts: ${getAxisMessage(continuousAxisDirection, continuousAxisId)} should be a continuous type to display the bar series of id "${seriesId}".`);
   }
   if (process.env.NODE_ENV !== 'production') {
-    if (discreteAxisConfig.data.length < series.stackedData.length) {
-      (0, _warning.warnOnce)([`MUI X Charts: ${getAxisMessage(discreteAxisDirection, discreteAxisId)} has less data (${discreteAxisConfig.data.length} values) than the bar series of id "${seriesId}" (${series.stackedData.length} values).`, 'The axis data should have at least the same length than the series using it.'], 'error');
+    if (discreteAxisConfig.data.length < seriesDataLength) {
+      (0, _warning.warnOnce)([`MUI X Charts: ${getAxisMessage(discreteAxisDirection, discreteAxisId)} has less data (${discreteAxisConfig.data.length} values) than the bar series of id "${seriesId}" (${seriesDataLength} values).`, 'The axis data should have at least the same length than the series using it.'], 'error');
     }
   }
 }

package/BarChart/seriesConfig/bar/getSeriesWithDefaultValues.d.ts

@@ -1,3 +1,5 @@
-import type { GetSeriesWithDefaultValues } from "../../../internals/plugins/models/seriesConfig/index.js";
-declare const getSeriesWithDefaultValues: GetSeriesWithDefaultValues<'bar'>;
-export default getSeriesWithDefaultValues;
+import { AllSeriesType } from "../../../models/seriesType/index.js";
+export declare function getSeriesWithDefaultValues<T extends 'bar'>(seriesData: AllSeriesType<T>, seriesIndex: number, colors: readonly string[]): AllSeriesType<T> & {
+  id: import("../../../index.js").SeriesId;
+  color: string;
+};

package/BarChart/seriesConfig/bar/getSeriesWithDefaultValues.js

@@ -4,12 +4,11 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.getSeriesWithDefaultValues = getSeriesWithDefaultValues;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-const getSeriesWithDefaultValues = (seriesData, seriesIndex, colors) => {
+function getSeriesWithDefaultValues(seriesData, seriesIndex, colors) {
   return (0, _extends2.default)({}, seriesData, {
     id: seriesData.id ?? `auto-generated-id-${seriesIndex}`,
     color: seriesData.color ?? colors[seriesIndex % colors.length]
   });
-};
-var _default = exports.default = getSeriesWithDefaultValues;
+}

package/BarChart/seriesConfig/index.js

@@ -12,7 +12,7 @@ var _legend = _interopRequireDefault(require("./bar/legend"));
 var _getColor = _interopRequireDefault(require("./bar/getColor"));
 var _tooltip = _interopRequireWildcard(require("./bar/tooltip"));
 var _tooltipPosition = _interopRequireDefault(require("./bar/tooltipPosition"));
-var _getSeriesWithDefaultValues = _interopRequireDefault(require("./bar/getSeriesWithDefaultValues"));
+var _getSeriesWithDefaultValues = require("./bar/getSeriesWithDefaultValues");
 const barSeriesConfig = exports.barSeriesConfig = {
   seriesProcessor: _seriesProcessor.default,
   colorProcessor: _getColor.default,
@@ -22,5 +22,5 @@ const barSeriesConfig = exports.barSeriesConfig = {
   axisTooltipGetter: _tooltip.axisTooltipGetter,
   xExtremumGetter: _extremums.getExtremumX,
   yExtremumGetter: _extremums.getExtremumY,
-  getSeriesWithDefaultValues: _getSeriesWithDefaultValues.default
+  getSeriesWithDefaultValues: _getSeriesWithDefaultValues.getSeriesWithDefaultValues
 };

package/BarChart/types.d.ts

@@ -5,15 +5,15 @@ export type AnimationData = {
   y: number;
   width: number;
   height: number;
-  yOrigin: number;
-  xOrigin: number;
-  layout: BarSeriesType['layout'];
 };
 export interface ProcessedBarSeriesData {
   seriesId: SeriesId;
   data: ProcessedBarData[];
   barLabel?: BarSeriesType['barLabel'];
   barLabelPlacement?: BarSeriesType['barLabelPlacement'];
+  layout: 'vertical' | 'horizontal';
+  xOrigin: number;
+  yOrigin: number;
 }
 export interface ProcessedBarData extends AnimationData {
   seriesId: SeriesId;
@@ -26,4 +26,7 @@ export interface MaskData extends AnimationData {
   id: string;
   hasNegative: boolean;
   hasPositive: boolean;
+  xOrigin: number;
+  yOrigin: number;
+  layout: 'horizontal' | 'vertical';
 }

package/BarChart/useBarPlotData.js

@@ -9,8 +9,9 @@ exports.useBarPlotData = useBarPlotData;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _getColor = _interopRequireDefault(require("./seriesConfig/bar/getColor"));
 var _hooks = require("../hooks");
-var _checkScaleErrors = require("./checkScaleErrors");
+var _checkBarChartScaleErrors = require("./checkBarChartScaleErrors");
 var _useBarSeries = require("../hooks/useBarSeries");
+var _getBandSize = require("../internals/getBandSize");
 function useBarPlotData(drawingArea, xAxes, yAxes) {
   const seriesData = (0, _useBarSeries.useBarSeriesContext)() ?? {
     series: {},
@@ -35,14 +36,17 @@ function useBarPlotData(drawingArea, xAxes, yAxes) {
     return seriesIds.map(seriesId => {
       const xAxisId = series[seriesId].xAxisId ?? defaultXAxisId;
       const yAxisId = series[seriesId].yAxisId ?? defaultYAxisId;
+      const layout = series[seriesId].layout;
       const xAxisConfig = xAxes[xAxisId];
       const yAxisConfig = yAxes[yAxisId];
       const verticalLayout = series[seriesId].layout === 'vertical';
       const reverse = (verticalLayout ? yAxisConfig.reverse : xAxisConfig.reverse) ?? false;
-      (0, _checkScaleErrors.checkScaleErrors)(verticalLayout, seriesId, series[seriesId], xAxisId, xAxes, yAxisId, yAxes);
+      (0, _checkBarChartScaleErrors.checkBarChartScaleErrors)(verticalLayout, seriesId, series[seriesId].stackedData.length, xAxisId, xAxes, yAxisId, yAxes);
       const baseScaleConfig = verticalLayout ? xAxisConfig : yAxisConfig;
       const xScale = xAxisConfig.scale;
       const yScale = yAxisConfig.scale;
+      const xOrigin = Math.round(xScale(0) ?? 0);
+      const yOrigin = Math.round(yScale(0) ?? 0);
       const colorGetter = (0, _getColor.default)(series[seriesId], xAxes[xAxisId], yAxes[yAxisId]);
       const seriesDataPoints = [];
       for (let dataIndex = 0; dataIndex < baseScaleConfig.data.length; dataIndex += 1) {
@@ -61,10 +65,7 @@ function useBarPlotData(drawingArea, xAxes, yAxes) {
         const stackId = series[seriesId].stack;
         const result = (0, _extends2.default)({
           seriesId,
-          dataIndex,
-          layout: series[seriesId].layout,
-          xOrigin: Math.round(xScale(0) ?? 0),
-          yOrigin: Math.round(yScale(0) ?? 0)
+          dataIndex
         }, barDimensions, {
           color: colorGetter(dataIndex),
           value: series[seriesId].data[dataIndex],
@@ -80,16 +81,16 @@ function useBarPlotData(drawingArea, xAxes, yAxes) {
             height: 0,
             hasNegative: false,
             hasPositive: false,
-            layout: result.layout,
-            xOrigin: xScale(0),
-            yOrigin: yScale(0),
+            layout,
+            xOrigin,
+            yOrigin,
             x: 0,
             y: 0
           };
         }
         const mask = masks[result.maskId];
-        mask.width = result.layout === 'vertical' ? result.width : mask.width + result.width;
-        mask.height = result.layout === 'vertical' ? mask.height + result.height : result.height;
+        mask.width = layout === 'vertical' ? result.width : mask.width + result.width;
+        mask.height = layout === 'vertical' ? mask.height + result.height : result.height;
         mask.x = Math.min(mask.x === 0 ? Infinity : mask.x, result.x);
         mask.y = Math.min(mask.y === 0 ? Infinity : mask.y, result.y);
         const value = result.value ?? 0;
@@ -101,7 +102,10 @@ function useBarPlotData(drawingArea, xAxes, yAxes) {
         seriesId,
         barLabel: series[seriesId].barLabel,
         barLabelPlacement: series[seriesId].barLabelPlacement,
-        data: seriesDataPoints
+        data: seriesDataPoints,
+        layout,
+        xOrigin,
+        yOrigin
       };
     });
   });
@@ -110,34 +114,6 @@ function useBarPlotData(drawingArea, xAxes, yAxes) {
     masksData: Object.values(masks)
   };
 }
-
-/**
- * Solution of the equations
- * W = barWidth * N + offset * (N-1)
- * offset / (offset + barWidth) = r
- * @param bandWidth The width available to place bars.
- * @param numberOfGroups The number of bars to place in that space.
- * @param gapRatio The ratio of the gap between bars over the bar width.
- * @returns The bar width and the offset between bars.
- */
-function getBandSize({
-  bandWidth: W,
-  numberOfGroups: N,
-  gapRatio: r
-}) {
-  if (r === 0) {
-    return {
-      barWidth: W / N,
-      offset: 0
-    };
-  }
-  const barWidth = W / (N + (N - 1) * r);
-  const offset = r * barWidth;
-  return {
-    barWidth,
-    offset
-  };
-}
 function shouldInvertStartCoordinate(verticalLayout, baseValue, reverse) {
   const isVerticalAndPositive = verticalLayout && baseValue > 0;
   const isHorizontalAndNegative = !verticalLayout && baseValue < 0;
@@ -159,11 +135,7 @@ function getBarDimensions(params) {
   const {
     barWidth,
     offset
-  } = getBandSize({
-    bandWidth: baseScaleConfig.scale.bandwidth(),
-    numberOfGroups,
-    gapRatio: baseScaleConfig.barGapRatio
-  });
+  } = (0, _getBandSize.getBandSize)(baseScaleConfig.scale.bandwidth(), numberOfGroups, baseScaleConfig.barGapRatio);
   const barOffset = groupIndex * (barWidth + offset);
   const xScale = xAxisConfig.scale;
   const yScale = yAxisConfig.scale;