@mui/x-charts 7.5.0 → 7.5.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (185) hide show
  1. package/BarChart/BarChart.js +13 -3
  2. package/BarChart/BarElement.js +1 -1
  3. package/BarChart/BarLabel/BarLabel.d.ts +1342 -0
  4. package/BarChart/BarLabel/BarLabel.js +60 -0
  5. package/BarChart/BarLabel/BarLabel.types.d.ts +39 -0
  6. package/BarChart/BarLabel/BarLabel.types.js +5 -0
  7. package/BarChart/BarLabel/BarLabelItem.d.ts +53 -0
  8. package/BarChart/BarLabel/BarLabelItem.js +138 -0
  9. package/BarChart/BarLabel/BarLabelPlot.d.ts +16 -0
  10. package/BarChart/BarLabel/BarLabelPlot.js +110 -0
  11. package/BarChart/BarLabel/barLabelClasses.d.ts +13 -0
  12. package/BarChart/BarLabel/barLabelClasses.js +29 -0
  13. package/BarChart/BarLabel/getBarLabel.d.ts +10 -0
  14. package/BarChart/BarLabel/getBarLabel.js +31 -0
  15. package/BarChart/BarLabel/index.d.ts +6 -0
  16. package/BarChart/BarLabel/index.js +25 -0
  17. package/BarChart/BarPlot.d.ts +15 -4
  18. package/BarChart/BarPlot.js +18 -4
  19. package/BarChart/index.d.ts +1 -0
  20. package/BarChart/index.js +11 -0
  21. package/CHANGELOG.md +61 -5417
  22. package/ChartContainer/ChartContainer.js +1 -1
  23. package/ChartsAxis/ChartsAxis.js +1 -1
  24. package/ChartsAxisHighlight/ChartsAxisHighlight.js +1 -1
  25. package/ChartsClipPath/ChartsClipPath.js +1 -1
  26. package/ChartsGrid/ChartsGrid.js +1 -1
  27. package/ChartsLegend/ChartsLegend.js +1 -1
  28. package/ChartsLegend/DefaultChartsLegend.js +1 -1
  29. package/ChartsOnAxisClickHandler/ChartsOnAxisClickHandler.js +1 -1
  30. package/ChartsReferenceLine/ChartsReferenceLine.js +1 -1
  31. package/ChartsSurface.js +1 -1
  32. package/ChartsText/ChartsText.js +1 -1
  33. package/ChartsTooltip/ChartsAxisTooltipContent.js +1 -1
  34. package/ChartsTooltip/ChartsItemTooltipContent.js +1 -1
  35. package/ChartsTooltip/ChartsTooltip.js +1 -1
  36. package/ChartsTooltip/DefaultChartsAxisTooltipContent.js +1 -1
  37. package/ChartsTooltip/DefaultChartsItemTooltipContent.js +1 -1
  38. package/ChartsVoronoiHandler/ChartsVoronoiHandler.js +1 -1
  39. package/ChartsXAxis/ChartsXAxis.js +1 -1
  40. package/ChartsYAxis/ChartsYAxis.js +1 -1
  41. package/Gauge/Gauge.js +1 -1
  42. package/Gauge/GaugeContainer.js +1 -1
  43. package/Gauge/GaugeValueText.js +1 -1
  44. package/LineChart/AnimatedArea.js +1 -1
  45. package/LineChart/AnimatedLine.js +1 -1
  46. package/LineChart/AreaElement.js +1 -1
  47. package/LineChart/AreaPlot.js +1 -1
  48. package/LineChart/LineChart.js +1 -1
  49. package/LineChart/LineElement.js +1 -1
  50. package/LineChart/LineHighlightElement.js +1 -1
  51. package/LineChart/LineHighlightPlot.js +1 -1
  52. package/LineChart/LinePlot.js +1 -1
  53. package/LineChart/MarkElement.js +1 -16
  54. package/LineChart/MarkPlot.js +1 -1
  55. package/PieChart/PieArc.js +1 -1
  56. package/PieChart/PieArcLabel.js +1 -1
  57. package/PieChart/PieArcLabelPlot.js +1 -1
  58. package/PieChart/PieArcPlot.js +1 -1
  59. package/PieChart/PieChart.js +1 -1
  60. package/PieChart/PiePlot.js +1 -1
  61. package/ResponsiveChartContainer/ResponsiveChartContainer.js +1 -1
  62. package/ScatterChart/Scatter.js +1 -1
  63. package/ScatterChart/ScatterChart.js +1 -1
  64. package/ScatterChart/ScatterPlot.js +1 -1
  65. package/SparkLineChart/SparkLineChart.d.ts +1 -1
  66. package/SparkLineChart/SparkLineChart.js +1 -1
  67. package/context/ZAxisContextProvider.js +1 -1
  68. package/esm/BarChart/BarChart.js +13 -3
  69. package/esm/BarChart/BarElement.js +1 -1
  70. package/esm/BarChart/BarLabel/BarLabel.js +51 -0
  71. package/esm/BarChart/BarLabel/BarLabel.types.js +1 -0
  72. package/esm/BarChart/BarLabel/BarLabelItem.js +130 -0
  73. package/esm/BarChart/BarLabel/BarLabelPlot.js +102 -0
  74. package/esm/BarChart/BarLabel/barLabelClasses.js +19 -0
  75. package/esm/BarChart/BarLabel/getBarLabel.js +24 -0
  76. package/esm/BarChart/BarLabel/index.js +2 -0
  77. package/esm/BarChart/BarPlot.js +18 -4
  78. package/esm/BarChart/index.js +2 -1
  79. package/esm/ChartContainer/ChartContainer.js +1 -1
  80. package/esm/ChartsAxis/ChartsAxis.js +1 -1
  81. package/esm/ChartsAxisHighlight/ChartsAxisHighlight.js +1 -1
  82. package/esm/ChartsClipPath/ChartsClipPath.js +1 -1
  83. package/esm/ChartsGrid/ChartsGrid.js +1 -1
  84. package/esm/ChartsLegend/ChartsLegend.js +1 -1
  85. package/esm/ChartsLegend/DefaultChartsLegend.js +1 -1
  86. package/esm/ChartsOnAxisClickHandler/ChartsOnAxisClickHandler.js +1 -1
  87. package/esm/ChartsReferenceLine/ChartsReferenceLine.js +1 -1
  88. package/esm/ChartsSurface.js +1 -1
  89. package/esm/ChartsText/ChartsText.js +1 -1
  90. package/esm/ChartsTooltip/ChartsAxisTooltipContent.js +1 -1
  91. package/esm/ChartsTooltip/ChartsItemTooltipContent.js +1 -1
  92. package/esm/ChartsTooltip/ChartsTooltip.js +1 -1
  93. package/esm/ChartsTooltip/DefaultChartsAxisTooltipContent.js +1 -1
  94. package/esm/ChartsTooltip/DefaultChartsItemTooltipContent.js +1 -1
  95. package/esm/ChartsVoronoiHandler/ChartsVoronoiHandler.js +1 -1
  96. package/esm/ChartsXAxis/ChartsXAxis.js +1 -1
  97. package/esm/ChartsYAxis/ChartsYAxis.js +1 -1
  98. package/esm/Gauge/Gauge.js +1 -1
  99. package/esm/Gauge/GaugeContainer.js +1 -1
  100. package/esm/Gauge/GaugeValueText.js +1 -1
  101. package/esm/LineChart/AnimatedArea.js +1 -1
  102. package/esm/LineChart/AnimatedLine.js +1 -1
  103. package/esm/LineChart/AreaElement.js +1 -1
  104. package/esm/LineChart/AreaPlot.js +1 -1
  105. package/esm/LineChart/LineChart.js +1 -1
  106. package/esm/LineChart/LineElement.js +1 -1
  107. package/esm/LineChart/LineHighlightElement.js +1 -1
  108. package/esm/LineChart/LineHighlightPlot.js +1 -1
  109. package/esm/LineChart/LinePlot.js +1 -1
  110. package/esm/LineChart/MarkElement.js +1 -16
  111. package/esm/LineChart/MarkPlot.js +1 -1
  112. package/esm/PieChart/PieArc.js +1 -1
  113. package/esm/PieChart/PieArcLabel.js +1 -1
  114. package/esm/PieChart/PieArcLabelPlot.js +1 -1
  115. package/esm/PieChart/PieArcPlot.js +1 -1
  116. package/esm/PieChart/PieChart.js +1 -1
  117. package/esm/PieChart/PiePlot.js +1 -1
  118. package/esm/ResponsiveChartContainer/ResponsiveChartContainer.js +1 -1
  119. package/esm/ScatterChart/Scatter.js +1 -1
  120. package/esm/ScatterChart/ScatterChart.js +1 -1
  121. package/esm/ScatterChart/ScatterPlot.js +1 -1
  122. package/esm/SparkLineChart/SparkLineChart.js +1 -1
  123. package/esm/context/ZAxisContextProvider.js +1 -1
  124. package/index.js +1 -1
  125. package/modern/BarChart/BarChart.js +13 -3
  126. package/modern/BarChart/BarElement.js +1 -1
  127. package/modern/BarChart/BarLabel/BarLabel.js +51 -0
  128. package/modern/BarChart/BarLabel/BarLabel.types.js +1 -0
  129. package/modern/BarChart/BarLabel/BarLabelItem.js +130 -0
  130. package/modern/BarChart/BarLabel/BarLabelPlot.js +102 -0
  131. package/modern/BarChart/BarLabel/barLabelClasses.js +19 -0
  132. package/modern/BarChart/BarLabel/getBarLabel.js +24 -0
  133. package/modern/BarChart/BarLabel/index.js +2 -0
  134. package/modern/BarChart/BarPlot.js +18 -4
  135. package/modern/BarChart/index.js +2 -1
  136. package/modern/ChartContainer/ChartContainer.js +1 -1
  137. package/modern/ChartsAxis/ChartsAxis.js +1 -1
  138. package/modern/ChartsAxisHighlight/ChartsAxisHighlight.js +1 -1
  139. package/modern/ChartsClipPath/ChartsClipPath.js +1 -1
  140. package/modern/ChartsGrid/ChartsGrid.js +1 -1
  141. package/modern/ChartsLegend/ChartsLegend.js +1 -1
  142. package/modern/ChartsLegend/DefaultChartsLegend.js +1 -1
  143. package/modern/ChartsOnAxisClickHandler/ChartsOnAxisClickHandler.js +1 -1
  144. package/modern/ChartsReferenceLine/ChartsReferenceLine.js +1 -1
  145. package/modern/ChartsSurface.js +1 -1
  146. package/modern/ChartsText/ChartsText.js +1 -1
  147. package/modern/ChartsTooltip/ChartsAxisTooltipContent.js +1 -1
  148. package/modern/ChartsTooltip/ChartsItemTooltipContent.js +1 -1
  149. package/modern/ChartsTooltip/ChartsTooltip.js +1 -1
  150. package/modern/ChartsTooltip/DefaultChartsAxisTooltipContent.js +1 -1
  151. package/modern/ChartsTooltip/DefaultChartsItemTooltipContent.js +1 -1
  152. package/modern/ChartsVoronoiHandler/ChartsVoronoiHandler.js +1 -1
  153. package/modern/ChartsXAxis/ChartsXAxis.js +1 -1
  154. package/modern/ChartsYAxis/ChartsYAxis.js +1 -1
  155. package/modern/Gauge/Gauge.js +1 -1
  156. package/modern/Gauge/GaugeContainer.js +1 -1
  157. package/modern/Gauge/GaugeValueText.js +1 -1
  158. package/modern/LineChart/AnimatedArea.js +1 -1
  159. package/modern/LineChart/AnimatedLine.js +1 -1
  160. package/modern/LineChart/AreaElement.js +1 -1
  161. package/modern/LineChart/AreaPlot.js +1 -1
  162. package/modern/LineChart/LineChart.js +1 -1
  163. package/modern/LineChart/LineElement.js +1 -1
  164. package/modern/LineChart/LineHighlightElement.js +1 -1
  165. package/modern/LineChart/LineHighlightPlot.js +1 -1
  166. package/modern/LineChart/LinePlot.js +1 -1
  167. package/modern/LineChart/MarkElement.js +1 -16
  168. package/modern/LineChart/MarkPlot.js +1 -1
  169. package/modern/PieChart/PieArc.js +1 -1
  170. package/modern/PieChart/PieArcLabel.js +1 -1
  171. package/modern/PieChart/PieArcLabelPlot.js +1 -1
  172. package/modern/PieChart/PieArcPlot.js +1 -1
  173. package/modern/PieChart/PieChart.js +1 -1
  174. package/modern/PieChart/PiePlot.js +1 -1
  175. package/modern/ResponsiveChartContainer/ResponsiveChartContainer.js +1 -1
  176. package/modern/ScatterChart/Scatter.js +1 -1
  177. package/modern/ScatterChart/ScatterChart.js +1 -1
  178. package/modern/ScatterChart/ScatterPlot.js +1 -1
  179. package/modern/SparkLineChart/SparkLineChart.js +1 -1
  180. package/modern/context/ZAxisContextProvider.js +1 -1
  181. package/modern/index.js +1 -1
  182. package/package.json +1 -1
  183. package/themeAugmentation/components.d.ts +4 -0
  184. package/themeAugmentation/overrides.d.ts +3 -0
  185. package/themeAugmentation/props.d.ts +2 -0
@@ -0,0 +1,130 @@
1
+ import _extends from "@babel/runtime/helpers/esm/extends";
2
+ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
3
+ const _excluded = ["seriesId", "classes", "color", "style", "dataIndex", "barLabel", "slots", "slotProps", "height", "width", "value"],
4
+ _excluded2 = ["ownerState"];
5
+ import * as React from 'react';
6
+ import { useSlotProps } from '@mui/base/utils';
7
+ import PropTypes from 'prop-types';
8
+ import { InteractionContext } from '../../context/InteractionProvider';
9
+ import { getIsFaded, getIsHighlighted } from '../../hooks/useInteractionItemProps';
10
+ import { useUtilityClasses } from './barLabelClasses';
11
+ import { HighlighContext } from '../../context/HighlightProvider';
12
+ import { getBarLabel } from './getBarLabel';
13
+ import { BarLabel } from './BarLabel';
14
+ import { jsx as _jsx } from "react/jsx-runtime";
15
+ /**
16
+ * @ignore - internal component.
17
+ */
18
+ function BarLabelItem(props) {
19
+ const {
20
+ seriesId,
21
+ classes: innerClasses,
22
+ color,
23
+ style,
24
+ dataIndex,
25
+ barLabel,
26
+ slots,
27
+ slotProps,
28
+ height,
29
+ width,
30
+ value
31
+ } = props,
32
+ other = _objectWithoutPropertiesLoose(props, _excluded);
33
+ const {
34
+ item
35
+ } = React.useContext(InteractionContext);
36
+ const {
37
+ scope
38
+ } = React.useContext(HighlighContext);
39
+ const isHighlighted = getIsHighlighted(item, {
40
+ type: 'bar',
41
+ seriesId,
42
+ dataIndex
43
+ }, scope);
44
+ const isFaded = !isHighlighted && getIsFaded(item, {
45
+ type: 'bar',
46
+ seriesId,
47
+ dataIndex
48
+ }, scope);
49
+ const ownerState = {
50
+ seriesId,
51
+ classes: innerClasses,
52
+ color,
53
+ isFaded,
54
+ isHighlighted,
55
+ dataIndex
56
+ };
57
+ const classes = useUtilityClasses(ownerState);
58
+ const Component = slots?.barLabel ?? BarLabel;
59
+ const _useSlotProps = useSlotProps({
60
+ elementType: Component,
61
+ externalSlotProps: slotProps?.barLabel,
62
+ additionalProps: _extends({}, other, {
63
+ style,
64
+ className: classes.root
65
+ }),
66
+ ownerState
67
+ }),
68
+ {
69
+ ownerState: barLabelOwnerState
70
+ } = _useSlotProps,
71
+ barLabelProps = _objectWithoutPropertiesLoose(_useSlotProps, _excluded2);
72
+ if (!barLabel) {
73
+ return null;
74
+ }
75
+ const formattedLabelText = getBarLabel({
76
+ barLabel,
77
+ value,
78
+ dataIndex,
79
+ seriesId,
80
+ height,
81
+ width
82
+ });
83
+ if (!formattedLabelText) {
84
+ return null;
85
+ }
86
+ return /*#__PURE__*/_jsx(Component, _extends({}, barLabelProps, barLabelOwnerState, {
87
+ children: formattedLabelText
88
+ }));
89
+ }
90
+ process.env.NODE_ENV !== "production" ? BarLabelItem.propTypes = {
91
+ // ----------------------------- Warning --------------------------------
92
+ // | These PropTypes are generated from the TypeScript type definitions |
93
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
94
+ // ----------------------------------------------------------------------
95
+ /**
96
+ * If provided, the function will be used to format the label of the bar.
97
+ * It can be set to 'value' to display the current value.
98
+ * @param {BarItem} item The item to format.
99
+ * @param {BarLabelContext} context data about the bar.
100
+ * @returns {string} The formatted label.
101
+ */
102
+ barLabel: PropTypes.oneOfType([PropTypes.oneOf(['value']), PropTypes.func]),
103
+ classes: PropTypes.object,
104
+ color: PropTypes.string.isRequired,
105
+ dataIndex: PropTypes.number.isRequired,
106
+ /**
107
+ * The height of the bar.
108
+ */
109
+ height: PropTypes.number.isRequired,
110
+ seriesId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
111
+ /**
112
+ * The props used for each component slot.
113
+ * @default {}
114
+ */
115
+ slotProps: PropTypes.object,
116
+ /**
117
+ * Overridable component slots.
118
+ * @default {}
119
+ */
120
+ slots: PropTypes.object,
121
+ /**
122
+ * The value of the data point.
123
+ */
124
+ value: PropTypes.number,
125
+ /**
126
+ * The width of the bar.
127
+ */
128
+ width: PropTypes.number.isRequired
129
+ } : void 0;
130
+ export { BarLabelItem };
@@ -0,0 +1,102 @@
1
+ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
2
+ import _extends from "@babel/runtime/helpers/esm/extends";
3
+ const _excluded = ["bars", "skipAnimation"];
4
+ import * as React from 'react';
5
+ import PropTypes from 'prop-types';
6
+ import { useTransition } from '@react-spring/web';
7
+ import { BarLabelItem } from './BarLabelItem';
8
+ import { jsx as _jsx } from "react/jsx-runtime";
9
+ const leaveStyle = ({
10
+ layout,
11
+ yOrigin,
12
+ x,
13
+ width,
14
+ y,
15
+ xOrigin,
16
+ height
17
+ }) => _extends({}, layout === 'vertical' ? {
18
+ y: yOrigin,
19
+ x: x + width / 2,
20
+ height: 0,
21
+ width
22
+ } : {
23
+ y: y + height / 2,
24
+ x: xOrigin,
25
+ height,
26
+ width: 0
27
+ });
28
+ const enterStyle = ({
29
+ x,
30
+ width,
31
+ y,
32
+ height
33
+ }) => ({
34
+ x: x + width / 2,
35
+ y: y + height / 2,
36
+ height,
37
+ width
38
+ });
39
+ /**
40
+ * @ignore - internal component.
41
+ */
42
+ function BarLabelPlot(props) {
43
+ const {
44
+ bars,
45
+ skipAnimation
46
+ } = props,
47
+ other = _objectWithoutPropertiesLoose(props, _excluded);
48
+ const barLabelTransition = useTransition(bars, {
49
+ keys: bar => `${bar.seriesId}-${bar.dataIndex}`,
50
+ from: leaveStyle,
51
+ leave: null,
52
+ enter: enterStyle,
53
+ update: enterStyle,
54
+ immediate: skipAnimation
55
+ });
56
+ return /*#__PURE__*/_jsx(React.Fragment, {
57
+ children: barLabelTransition((style, {
58
+ seriesId,
59
+ dataIndex,
60
+ color,
61
+ value,
62
+ width,
63
+ height
64
+ }) => /*#__PURE__*/_jsx(BarLabelItem, _extends({
65
+ seriesId: seriesId,
66
+ dataIndex: dataIndex,
67
+ value: value,
68
+ color: color,
69
+ width: width,
70
+ height: height
71
+ }, other, {
72
+ style: style
73
+ })))
74
+ });
75
+ }
76
+ process.env.NODE_ENV !== "production" ? BarLabelPlot.propTypes = {
77
+ // ----------------------------- Warning --------------------------------
78
+ // | These PropTypes are generated from the TypeScript type definitions |
79
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
80
+ // ----------------------------------------------------------------------
81
+ barLabel: PropTypes.oneOfType([PropTypes.oneOf(['value']), PropTypes.func]),
82
+ bars: PropTypes.arrayOf(PropTypes.shape({
83
+ color: PropTypes.string.isRequired,
84
+ dataIndex: PropTypes.number.isRequired,
85
+ height: PropTypes.number.isRequired,
86
+ highlightScope: PropTypes.shape({
87
+ faded: PropTypes.oneOf(['global', 'none', 'series']),
88
+ highlighted: PropTypes.oneOf(['item', 'none', 'series'])
89
+ }),
90
+ layout: PropTypes.oneOf(['horizontal', 'vertical']),
91
+ maskId: PropTypes.string.isRequired,
92
+ seriesId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
93
+ value: PropTypes.number,
94
+ width: PropTypes.number.isRequired,
95
+ x: PropTypes.number.isRequired,
96
+ xOrigin: PropTypes.number.isRequired,
97
+ y: PropTypes.number.isRequired,
98
+ yOrigin: PropTypes.number.isRequired
99
+ })).isRequired,
100
+ skipAnimation: PropTypes.bool
101
+ } : void 0;
102
+ export { BarLabelPlot };
@@ -0,0 +1,19 @@
1
+ import generateUtilityClass from '@mui/utils/generateUtilityClass';
2
+ import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
3
+ import composeClasses from '@mui/utils/composeClasses';
4
+ export function getBarLabelUtilityClass(slot) {
5
+ return generateUtilityClass('MuiBarLabel', slot);
6
+ }
7
+ export const barLabelClasses = generateUtilityClasses('MuiBarLabel', ['root', 'highlighted', 'faded']);
8
+ export const useUtilityClasses = ownerState => {
9
+ const {
10
+ classes,
11
+ seriesId,
12
+ isFaded,
13
+ isHighlighted
14
+ } = ownerState;
15
+ const slots = {
16
+ root: ['root', `series-${seriesId}`, isHighlighted && 'highlighted', isFaded && 'faded']
17
+ };
18
+ return composeClasses(slots, getBarLabelUtilityClass, classes);
19
+ };
@@ -0,0 +1,24 @@
1
+ export const getBarLabel = options => {
2
+ const {
3
+ barLabel,
4
+ value,
5
+ dataIndex,
6
+ seriesId,
7
+ height,
8
+ width
9
+ } = options;
10
+ if (barLabel === 'value') {
11
+ // We don't want to show the label if the value is 0
12
+ return value ? value?.toString() : null;
13
+ }
14
+ return barLabel({
15
+ seriesId,
16
+ dataIndex,
17
+ value
18
+ }, {
19
+ bar: {
20
+ height,
21
+ width
22
+ }
23
+ });
24
+ };
@@ -0,0 +1,2 @@
1
+ export { BarLabel } from './BarLabel';
2
+ export { barLabelClasses, getBarLabelUtilityClass } from './barLabelClasses';
@@ -1,6 +1,6 @@
1
1
  import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
2
2
  import _extends from "@babel/runtime/helpers/esm/extends";
3
- const _excluded = ["skipAnimation", "onItemClick", "borderRadius"];
3
+ const _excluded = ["skipAnimation", "onItemClick", "borderRadius", "barLabel"];
4
4
  import * as React from 'react';
5
5
  import PropTypes from 'prop-types';
6
6
  import { useTransition } from '@react-spring/web';
@@ -12,6 +12,7 @@ import { DEFAULT_X_AXIS_KEY, DEFAULT_Y_AXIS_KEY } from '../constants';
12
12
  import getColor from './getColor';
13
13
  import { useChartId } from '../hooks';
14
14
  import { BarClipPath } from './BarClipPath';
15
+ import { BarLabelPlot } from './BarLabel/BarLabelPlot';
15
16
 
16
17
  /**
17
18
  * Solution of the equations
@@ -211,7 +212,8 @@ function BarPlot(props) {
211
212
  const {
212
213
  skipAnimation,
213
214
  onItemClick,
214
- borderRadius
215
+ borderRadius,
216
+ barLabel
215
217
  } = props,
216
218
  other = _objectWithoutPropertiesLoose(props, _excluded);
217
219
  const transition = useTransition(completedData, {
@@ -274,14 +276,26 @@ function BarPlot(props) {
274
276
  clipPath: `url(#${maskId})`,
275
277
  children: barElement
276
278
  });
277
- })]
279
+ }), barLabel && /*#__PURE__*/_jsx(BarLabelPlot, _extends({
280
+ bars: completedData,
281
+ skipAnimation: skipAnimation,
282
+ barLabel: barLabel
283
+ }, other))]
278
284
  });
279
285
  }
280
286
  process.env.NODE_ENV !== "production" ? BarPlot.propTypes = {
281
287
  // ----------------------------- Warning --------------------------------
282
288
  // | These PropTypes are generated from the TypeScript type definitions |
283
- // | To update them edit the TypeScript types and run "yarn proptypes" |
289
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
284
290
  // ----------------------------------------------------------------------
291
+ /**
292
+ * If provided, the function will be used to format the label of the bar.
293
+ * It can be set to 'value' to display the current value.
294
+ * @param {BarItem} item The item to format.
295
+ * @param {BarLabelContext} context data about the bar.
296
+ * @returns {string} The formatted label.
297
+ */
298
+ barLabel: PropTypes.oneOfType([PropTypes.oneOf(['value']), PropTypes.func]),
285
299
  /**
286
300
  * Defines the border radius of the bar element.
287
301
  */
@@ -1,3 +1,4 @@
1
1
  export * from './BarChart';
2
2
  export * from './BarPlot';
3
- export * from './BarElement';
3
+ export * from './BarElement';
4
+ export * from './BarLabel';
@@ -64,7 +64,7 @@ const ChartContainer = /*#__PURE__*/React.forwardRef(function ChartContainer(pro
64
64
  process.env.NODE_ENV !== "production" ? ChartContainer.propTypes = {
65
65
  // ----------------------------- Warning --------------------------------
66
66
  // | These PropTypes are generated from the TypeScript type definitions |
67
- // | To update them edit the TypeScript types and run "yarn proptypes" |
67
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
68
68
  // ----------------------------------------------------------------------
69
69
  children: PropTypes.node,
70
70
  className: PropTypes.string,
@@ -91,7 +91,7 @@ function ChartsAxis(props) {
91
91
  process.env.NODE_ENV !== "production" ? ChartsAxis.propTypes = {
92
92
  // ----------------------------- Warning --------------------------------
93
93
  // | These PropTypes are generated from the TypeScript type definitions |
94
- // | To update them edit the TypeScript types and run "yarn proptypes" |
94
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
95
95
  // ----------------------------------------------------------------------
96
96
  /**
97
97
  * Indicate which axis to display the bottom of the charts.
@@ -97,7 +97,7 @@ function ChartsAxisHighlight(props) {
97
97
  process.env.NODE_ENV !== "production" ? ChartsAxisHighlight.propTypes = {
98
98
  // ----------------------------- Warning --------------------------------
99
99
  // | These PropTypes are generated from the TypeScript type definitions |
100
- // | To update them edit the TypeScript types and run "yarn proptypes" |
100
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
101
101
  // ----------------------------------------------------------------------
102
102
  x: PropTypes.oneOf(['band', 'line', 'none']),
103
103
  y: PropTypes.oneOf(['band', 'line', 'none'])
@@ -38,7 +38,7 @@ function ChartsClipPath(props) {
38
38
  process.env.NODE_ENV !== "production" ? ChartsClipPath.propTypes = {
39
39
  // ----------------------------- Warning --------------------------------
40
40
  // | These PropTypes are generated from the TypeScript type definitions |
41
- // | To update them edit the TypeScript types and run "yarn proptypes" |
41
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
42
42
  // ----------------------------------------------------------------------
43
43
  id: PropTypes.string.isRequired,
44
44
  offset: PropTypes.shape({
@@ -113,7 +113,7 @@ function ChartsGrid(props) {
113
113
  process.env.NODE_ENV !== "production" ? ChartsGrid.propTypes = {
114
114
  // ----------------------------- Warning --------------------------------
115
115
  // | These PropTypes are generated from the TypeScript type definitions |
116
- // | To update them edit the TypeScript types and run "yarn proptypes" |
116
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
117
117
  // ----------------------------------------------------------------------
118
118
  /**
119
119
  * Override or extend the styles applied to the component.
@@ -69,7 +69,7 @@ function ChartsLegend(inProps) {
69
69
  process.env.NODE_ENV !== "production" ? ChartsLegend.propTypes = {
70
70
  // ----------------------------- Warning --------------------------------
71
71
  // | These PropTypes are generated from the TypeScript type definitions |
72
- // | To update them edit the TypeScript types and run "yarn proptypes" |
72
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
73
73
  // ----------------------------------------------------------------------
74
74
  /**
75
75
  * Override or extend the styles applied to the component.
@@ -204,7 +204,7 @@ function DefaultChartsLegend(props) {
204
204
  process.env.NODE_ENV !== "production" ? DefaultChartsLegend.propTypes = {
205
205
  // ----------------------------- Warning --------------------------------
206
206
  // | These PropTypes are generated from the TypeScript type definitions |
207
- // | To update them edit the TypeScript types and run "yarn proptypes" |
207
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
208
208
  // ----------------------------------------------------------------------
209
209
  /**
210
210
  * Override or extend the styles applied to the component.
@@ -62,7 +62,7 @@ function ChartsOnAxisClickHandler(props) {
62
62
  process.env.NODE_ENV !== "production" ? ChartsOnAxisClickHandler.propTypes = {
63
63
  // ----------------------------- Warning --------------------------------
64
64
  // | These PropTypes are generated from the TypeScript type definitions |
65
- // | To update them edit the TypeScript types and run "yarn proptypes" |
65
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
66
66
  // ----------------------------------------------------------------------
67
67
  /**
68
68
  * The function called for onClick events.
@@ -23,7 +23,7 @@ function ChartsReferenceLine(props) {
23
23
  process.env.NODE_ENV !== "production" ? ChartsReferenceLine.propTypes = {
24
24
  // ----------------------------- Warning --------------------------------
25
25
  // | These PropTypes are generated from the TypeScript type definitions |
26
- // | To update them edit the TypeScript types and run "yarn proptypes" |
26
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
27
27
  // ----------------------------------------------------------------------
28
28
  /**
29
29
  * The id of the axis used for the reference value.
@@ -44,7 +44,7 @@ const ChartsSurface = /*#__PURE__*/React.forwardRef(function ChartsSurface(props
44
44
  process.env.NODE_ENV !== "production" ? ChartsSurface.propTypes = {
45
45
  // ----------------------------- Warning --------------------------------
46
46
  // | These PropTypes are generated from the TypeScript type definitions |
47
- // | To update them edit the TypeScript types and run "yarn proptypes" |
47
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
48
48
  // ----------------------------------------------------------------------
49
49
  children: PropTypes.node,
50
50
  className: PropTypes.string,
@@ -70,7 +70,7 @@ function ChartsText(props) {
70
70
  process.env.NODE_ENV !== "production" ? ChartsText.propTypes = {
71
71
  // ----------------------------- Warning --------------------------------
72
72
  // | These PropTypes are generated from the TypeScript type definitions |
73
- // | To update them edit the TypeScript types and run "yarn proptypes" |
73
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
74
74
  // ----------------------------------------------------------------------
75
75
  /**
76
76
  * Height of a text line (in `em`).
@@ -80,7 +80,7 @@ function ChartsAxisTooltipContent(props) {
80
80
  process.env.NODE_ENV !== "production" ? ChartsAxisTooltipContent.propTypes = {
81
81
  // ----------------------------- Warning --------------------------------
82
82
  // | These PropTypes are generated from the TypeScript type definitions |
83
- // | To update them edit the TypeScript types and run "yarn proptypes" |
83
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
84
84
  // ----------------------------------------------------------------------
85
85
  axisData: PropTypes.shape({
86
86
  x: PropTypes.shape({
@@ -60,7 +60,7 @@ function ChartsItemTooltipContent(props) {
60
60
  process.env.NODE_ENV !== "production" ? ChartsItemTooltipContent.propTypes = {
61
61
  // ----------------------------- Warning --------------------------------
62
62
  // | These PropTypes are generated from the TypeScript type definitions |
63
- // | To update them edit the TypeScript types and run "yarn proptypes" |
63
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
64
64
  // ----------------------------------------------------------------------
65
65
  classes: PropTypes.object.isRequired,
66
66
  content: PropTypes.elementType,
@@ -110,7 +110,7 @@ function ChartsTooltip(props) {
110
110
  process.env.NODE_ENV !== "production" ? ChartsTooltip.propTypes = {
111
111
  // ----------------------------- Warning --------------------------------
112
112
  // | These PropTypes are generated from the TypeScript type definitions |
113
- // | To update them edit the TypeScript types and run "yarn proptypes" |
113
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
114
114
  // ----------------------------------------------------------------------
115
115
  /**
116
116
  * Component to override the tooltip content when trigger is set to 'axis'.
@@ -80,7 +80,7 @@ function DefaultChartsAxisTooltipContent(props) {
80
80
  process.env.NODE_ENV !== "production" ? DefaultChartsAxisTooltipContent.propTypes = {
81
81
  // ----------------------------- Warning --------------------------------
82
82
  // | These PropTypes are generated from the TypeScript type definitions |
83
- // | To update them edit the TypeScript types and run "yarn proptypes" |
83
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
84
84
  // ----------------------------------------------------------------------
85
85
  /**
86
86
  * The properties of the triggered axis.
@@ -61,7 +61,7 @@ function DefaultChartsItemTooltipContent(props) {
61
61
  process.env.NODE_ENV !== "production" ? DefaultChartsItemTooltipContent.propTypes = {
62
62
  // ----------------------------- Warning --------------------------------
63
63
  // | These PropTypes are generated from the TypeScript type definitions |
64
- // | To update them edit the TypeScript types and run "yarn proptypes" |
64
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
65
65
  // ----------------------------------------------------------------------
66
66
  /**
67
67
  * Override or extend the styles applied to the component.
@@ -195,7 +195,7 @@ function ChartsVoronoiHandler(props) {
195
195
  process.env.NODE_ENV !== "production" ? ChartsVoronoiHandler.propTypes = {
196
196
  // ----------------------------- Warning --------------------------------
197
197
  // | These PropTypes are generated from the TypeScript type definitions |
198
- // | To update them edit the TypeScript types and run "yarn proptypes" |
198
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
199
199
  // ----------------------------------------------------------------------
200
200
  /**
201
201
  * Callback fired when clicking on a scatter item.
@@ -248,7 +248,7 @@ function ChartsXAxis(inProps) {
248
248
  process.env.NODE_ENV !== "production" ? ChartsXAxis.propTypes = {
249
249
  // ----------------------------- Warning --------------------------------
250
250
  // | These PropTypes are generated from the TypeScript type definitions |
251
- // | To update them edit the TypeScript types and run "yarn proptypes" |
251
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
252
252
  // ----------------------------------------------------------------------
253
253
  /**
254
254
  * The id of the axis to render.
@@ -184,7 +184,7 @@ function ChartsYAxis(inProps) {
184
184
  process.env.NODE_ENV !== "production" ? ChartsYAxis.propTypes = {
185
185
  // ----------------------------- Warning --------------------------------
186
186
  // | These PropTypes are generated from the TypeScript type definitions |
187
- // | To update them edit the TypeScript types and run "yarn proptypes" |
187
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
188
188
  // ----------------------------------------------------------------------
189
189
  /**
190
190
  * The id of the axis to render.
@@ -44,7 +44,7 @@ function Gauge(props) {
44
44
  process.env.NODE_ENV !== "production" ? Gauge.propTypes = {
45
45
  // ----------------------------- Warning --------------------------------
46
46
  // | These PropTypes are generated from the TypeScript type definitions |
47
- // | To update them edit the TypeScript types and run "yarn proptypes" |
47
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
48
48
  // ----------------------------------------------------------------------
49
49
  children: PropTypes.node,
50
50
  classes: PropTypes.object,
@@ -106,7 +106,7 @@ const GaugeContainer = /*#__PURE__*/React.forwardRef(function GaugeContainer(pro
106
106
  process.env.NODE_ENV !== "production" ? GaugeContainer.propTypes = {
107
107
  // ----------------------------- Warning --------------------------------
108
108
  // | These PropTypes are generated from the TypeScript type definitions |
109
- // | To update them edit the TypeScript types and run "yarn proptypes" |
109
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
110
110
  // ----------------------------------------------------------------------
111
111
  children: PropTypes.node,
112
112
  className: PropTypes.string,
@@ -48,7 +48,7 @@ function GaugeValueText(props) {
48
48
  process.env.NODE_ENV !== "production" ? GaugeValueText.propTypes = {
49
49
  // ----------------------------- Warning --------------------------------
50
50
  // | These PropTypes are generated from the TypeScript type definitions |
51
- // | To update them edit the TypeScript types and run "yarn proptypes" |
51
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
52
52
  // ----------------------------------------------------------------------
53
53
  /**
54
54
  * Height of a text line (in `em`).
@@ -83,7 +83,7 @@ function AnimatedArea(props) {
83
83
  process.env.NODE_ENV !== "production" ? AnimatedArea.propTypes = {
84
84
  // ----------------------------- Warning --------------------------------
85
85
  // | These PropTypes are generated from the TypeScript type definitions |
86
- // | To update them edit the TypeScript types and run "yarn proptypes" |
86
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
87
87
  // ----------------------------------------------------------------------
88
88
  d: PropTypes.string.isRequired,
89
89
  ownerState: PropTypes.shape({
@@ -86,7 +86,7 @@ function AnimatedLine(props) {
86
86
  process.env.NODE_ENV !== "production" ? AnimatedLine.propTypes = {
87
87
  // ----------------------------- Warning --------------------------------
88
88
  // | These PropTypes are generated from the TypeScript type definitions |
89
- // | To update them edit the TypeScript types and run "yarn proptypes" |
89
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
90
90
  // ----------------------------------------------------------------------
91
91
  d: PropTypes.string.isRequired,
92
92
  ownerState: PropTypes.shape({
@@ -89,7 +89,7 @@ function AreaElement(props) {
89
89
  process.env.NODE_ENV !== "production" ? AreaElement.propTypes = {
90
90
  // ----------------------------- Warning --------------------------------
91
91
  // | These PropTypes are generated from the TypeScript type definitions |
92
- // | To update them edit the TypeScript types and run "yarn proptypes" |
92
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
93
93
  // ----------------------------------------------------------------------
94
94
  classes: PropTypes.object,
95
95
  color: PropTypes.string.isRequired,
@@ -119,7 +119,7 @@ function AreaPlot(props) {
119
119
  process.env.NODE_ENV !== "production" ? AreaPlot.propTypes = {
120
120
  // ----------------------------- Warning --------------------------------
121
121
  // | These PropTypes are generated from the TypeScript type definitions |
122
- // | To update them edit the TypeScript types and run "yarn proptypes" |
122
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
123
123
  // ----------------------------------------------------------------------
124
124
  /**
125
125
  * Callback fired when a line area item is clicked.
@@ -133,7 +133,7 @@ const LineChart = /*#__PURE__*/React.forwardRef(function LineChart(props, ref) {
133
133
  process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
134
134
  // ----------------------------- Warning --------------------------------
135
135
  // | These PropTypes are generated from the TypeScript type definitions |
136
- // | To update them edit the TypeScript types and run "yarn proptypes" |
136
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
137
137
  // ----------------------------------------------------------------------
138
138
  /**
139
139
  * The configuration of axes highlight.
@@ -89,7 +89,7 @@ function LineElement(props) {
89
89
  process.env.NODE_ENV !== "production" ? LineElement.propTypes = {
90
90
  // ----------------------------- Warning --------------------------------
91
91
  // | These PropTypes are generated from the TypeScript type definitions |
92
- // | To update them edit the TypeScript types and run "yarn proptypes" |
92
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
93
93
  // ----------------------------------------------------------------------
94
94
  classes: PropTypes.object,
95
95
  color: PropTypes.string.isRequired,
@@ -72,7 +72,7 @@ function LineHighlightElement(props) {
72
72
  process.env.NODE_ENV !== "production" ? LineHighlightElement.propTypes = {
73
73
  // ----------------------------- Warning --------------------------------
74
74
  // | These PropTypes are generated from the TypeScript type definitions |
75
- // | To update them edit the TypeScript types and run "yarn proptypes" |
75
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
76
76
  // ----------------------------------------------------------------------
77
77
  classes: PropTypes.object,
78
78
  id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired