@mui/x-charts 7.5.0 → 7.6.0

package/BarChart/BarPlot.js

@@ -13,13 +13,13 @@ var _web = require("@react-spring/web");
 var _SeriesContextProvider = require("../context/SeriesContextProvider");
 var _CartesianContextProvider = require("../context/CartesianContextProvider");
 var _BarElement = require("./BarElement");
-var _axis = require("../models/axis");
-var _constants = require("../constants");
 var _getColor = _interopRequireDefault(require("./getColor"));
 var _hooks = require("../hooks");
 var _BarClipPath = require("./BarClipPath");
+var _BarLabelPlot = require("./BarLabel/BarLabelPlot");
+var _checkScaleErrors = require("./checkScaleErrors");
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["skipAnimation", "onItemClick", "borderRadius"];
+const _excluded = ["skipAnimation", "onItemClick", "borderRadius", "barLabel"];
 /**
  * Solution of the equations
  * W = barWidth * N + offset * (N-1)
@@ -79,30 +79,8 @@ const useAggregatedData = () => {
       const xAxisConfig = xAxis[xAxisKey];
       const yAxisConfig = yAxis[yAxisKey];
       const verticalLayout = series[seriesId].layout === 'vertical';
-      let baseScaleConfig;
-      if (verticalLayout) {
-        if (!(0, _axis.isBandScaleConfig)(xAxisConfig)) {
-          throw new Error(`MUI X Charts: ${xAxisKey === _constants.DEFAULT_X_AXIS_KEY ? 'The first `xAxis`' : `The x-axis with id "${xAxisKey}"`} should be of type "band" to display the bar series of id "${seriesId}".`);
-        }
-        if (xAxis[xAxisKey].data === undefined) {
-          throw new Error(`MUI X Charts: ${xAxisKey === _constants.DEFAULT_X_AXIS_KEY ? 'The first `xAxis`' : `The x-axis with id "${xAxisKey}"`} should have data property.`);
-        }
-        baseScaleConfig = xAxisConfig;
-        if ((0, _axis.isBandScaleConfig)(yAxisConfig) || (0, _axis.isPointScaleConfig)(yAxisConfig)) {
-          throw new Error(`MUI X Charts: ${yAxisKey === _constants.DEFAULT_Y_AXIS_KEY ? 'The first `yAxis`' : `The y-axis with id "${yAxisKey}"`} should be a continuous type to display the bar series of id "${seriesId}".`);
-        }
-      } else {
-        if (!(0, _axis.isBandScaleConfig)(yAxisConfig)) {
-          throw new Error(`MUI X Charts: ${yAxisKey === _constants.DEFAULT_Y_AXIS_KEY ? 'The first `yAxis`' : `The y-axis with id "${yAxisKey}"`} should be of type "band" to display the bar series of id "${seriesId}".`);
-        }
-        if (yAxis[yAxisKey].data === undefined) {
-          throw new Error(`MUI X Charts: ${yAxisKey === _constants.DEFAULT_Y_AXIS_KEY ? 'The first `yAxis`' : `The y-axis with id "${yAxisKey}"`} should have data property.`);
-        }
-        baseScaleConfig = yAxisConfig;
-        if ((0, _axis.isBandScaleConfig)(xAxisConfig) || (0, _axis.isPointScaleConfig)(xAxisConfig)) {
-          throw new Error(`MUI X Charts: ${xAxisKey === _constants.DEFAULT_X_AXIS_KEY ? 'The first `xAxis`' : `The x-axis with id "${xAxisKey}"`} should be a continuous type to display the bar series of id "${seriesId}".`);
-        }
-      }
+      (0, _checkScaleErrors.checkScaleErrors)(verticalLayout, seriesId, xAxisKey, xAxis, yAxisKey, yAxis);
+      const baseScaleConfig = verticalLayout ? xAxisConfig : yAxisConfig;
       const xScale = xAxisConfig.scale;
       const yScale = yAxisConfig.scale;
       const colorGetter = (0, _getColor.default)(series[seriesId], xAxis[xAxisKey], yAxis[yAxisKey]);
@@ -135,7 +113,6 @@ const useAggregatedData = () => {
           height: verticalLayout ? maxValueCoord - minValueCoord : barWidth,
           width: verticalLayout ? barWidth : maxValueCoord - minValueCoord,
           color: colorGetter(dataIndex),
-          highlightScope: series[seriesId].highlightScope,
           value: series[seriesId].data[dataIndex],
           maskId: `${chartId}_${stackId || seriesId}_${groupIndex}_${dataIndex}`
         };
@@ -219,7 +196,8 @@ function BarPlot(props) {
   const {
       skipAnimation,
       onItemClick,
-      borderRadius
+      borderRadius,
+      barLabel
     } = props,
     other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
   const transition = (0, _web.useTransition)(completedData, {
@@ -257,14 +235,12 @@ function BarPlot(props) {
       seriesId,
       dataIndex,
       color,
-      highlightScope,
       maskId
     }) => {
       const barElement = /*#__PURE__*/(0, _jsxRuntime.jsx)(_BarElement.BarElement, (0, _extends2.default)({
         id: seriesId,
         dataIndex: dataIndex,
-        color: color,
-        highlightScope: highlightScope
+        color: color
       }, other, {
         onClick: onItemClick && (event => {
           onItemClick(event, {
@@ -282,14 +258,26 @@ function BarPlot(props) {
         clipPath: `url(#${maskId})`,
         children: barElement
       });
-    })]
+    }), barLabel && /*#__PURE__*/(0, _jsxRuntime.jsx)(_BarLabelPlot.BarLabelPlot, (0, _extends2.default)({
+      bars: completedData,
+      skipAnimation: skipAnimation,
+      barLabel: barLabel
+    }, other))]
   });
 }
 process.env.NODE_ENV !== "production" ? BarPlot.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
-  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
   // ----------------------------------------------------------------------
+  /**
+   * If provided, the function will be used to format the label of the bar.
+   * It can be set to 'value' to display the current value.
+   * @param {BarItem} item The item to format.
+   * @param {BarLabelContext} context data about the bar.
+   * @returns {string} The formatted label.
+   */
+  barLabel: _propTypes.default.oneOfType([_propTypes.default.oneOf(['value']), _propTypes.default.func]),
   /**
    * Defines the border radius of the bar element.
    */

package/BarChart/checkScaleErrors.d.ts

@@ -0,0 +1,11 @@
+import { AxisDefaultized } from '../models/axis';
+import { SeriesId } from '../models/seriesType/common';
+export declare function checkScaleErrors(verticalLayout: boolean, seriesId: SeriesId, xAxisKey: string, xAxis: {
+    DEFAULT_X_AXIS_KEY: AxisDefaultized;
+} & {
+    [axisKey: string]: AxisDefaultized;
+}, yAxisKey: string, yAxis: {
+    DEFAULT_X_AXIS_KEY: AxisDefaultized;
+} & {
+    [axisKey: string]: AxisDefaultized;
+}): void;

package/BarChart/checkScaleErrors.js

@@ -0,0 +1,33 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.checkScaleErrors = checkScaleErrors;
+var _constants = require("../constants");
+var _axis = require("../models/axis");
+const getAxisMessage = (axisDirection, axisKey) => {
+  const axisName = `${axisDirection}-axis`;
+  const axisKeyName = `${axisDirection}Axis`;
+  const axisDefaultKey = axisDirection === 'x' ? _constants.DEFAULT_X_AXIS_KEY : _constants.DEFAULT_Y_AXIS_KEY;
+  return axisKey === axisDefaultKey ? `The first \`${axisKeyName}\`` : `The ${axisName} with id "${axisKey}"`;
+};
+function checkScaleErrors(verticalLayout, seriesId, xAxisKey, xAxis, yAxisKey, yAxis) {
+  const xAxisConfig = xAxis[xAxisKey];
+  const yAxisConfig = yAxis[yAxisKey];
+  const discreteAxisConfig = verticalLayout ? xAxisConfig : yAxisConfig;
+  const continuousAxisConfig = verticalLayout ? yAxisConfig : xAxisConfig;
+  const discreteAxisKey = verticalLayout ? xAxisKey : yAxisKey;
+  const continuousAxisKey = verticalLayout ? yAxisKey : xAxisKey;
+  const discreteAxisDirection = verticalLayout ? 'x' : 'y';
+  const continuousAxisDirection = verticalLayout ? 'y' : 'x';
+  if (!(0, _axis.isBandScaleConfig)(discreteAxisConfig)) {
+    throw new Error(`MUI X Charts: ${getAxisMessage(discreteAxisDirection, discreteAxisKey)} 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, discreteAxisKey)} should have data property.`);
+  }
+  if ((0, _axis.isBandScaleConfig)(continuousAxisConfig) || (0, _axis.isPointScaleConfig)(continuousAxisConfig)) {
+    throw new Error(`MUI X Charts: ${getAxisMessage(continuousAxisDirection, continuousAxisKey)} should be a continuous type to display the bar series of id "${seriesId}".`);
+  }
+}

package/BarChart/index.d.ts

@@ -1,3 +1,4 @@
 export * from './BarChart';
 export * from './BarPlot';
 export * from './BarElement';
+export * from './BarLabel';

package/BarChart/index.js

@@ -35,4 +35,15 @@ Object.keys(_BarElement).forEach(function (key) {
       return _BarElement[key];
     }
   });
+});
+var _BarLabel = require("./BarLabel");
+Object.keys(_BarLabel).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _BarLabel[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _BarLabel[key];
+    }
+  });
 });

package/BarChart/types.d.ts

@@ -1,4 +1,3 @@
-import type { HighlightScope } from '../context';
 import type { BarSeriesType } from '../models';
 import type { SeriesId } from '../models/seriesType/common';
 export type AnimationData = {
@@ -15,7 +14,6 @@ export interface CompletedBarData extends AnimationData {
     dataIndex: number;
     color: string;
     value: number | null;
-    highlightScope?: Partial<HighlightScope>;
     maskId: string;
 }
 export interface MaskData extends AnimationData {