@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,60 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.BarLabel = BarLabel;
8
+ exports.BarLabelComponent = void 0;
9
+ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
10
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
11
+ var React = _interopRequireWildcard(require("react"));
12
+ var _styles = require("@mui/material/styles");
13
+ var _web = require("@react-spring/web");
14
+ var _propTypes = _interopRequireDefault(require("prop-types"));
15
+ var _barLabelClasses = require("./barLabelClasses");
16
+ var _jsxRuntime = require("react/jsx-runtime");
17
+ const _excluded = ["seriesId", "dataIndex", "color", "isFaded", "isHighlighted", "classes"];
18
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
19
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
20
+ const BarLabelComponent = exports.BarLabelComponent = (0, _styles.styled)(_web.animated.text, {
21
+ name: 'MuiBarLabel',
22
+ slot: 'Root',
23
+ overridesResolver: (_, styles) => [{
24
+ [`&.${_barLabelClasses.barLabelClasses.faded}`]: styles.faded
25
+ }, {
26
+ [`&.${_barLabelClasses.barLabelClasses.highlighted}`]: styles.highlighted
27
+ }, styles.root]
28
+ })(({
29
+ theme
30
+ }) => (0, _extends2.default)({}, theme?.typography?.body2, {
31
+ stroke: 'none',
32
+ fill: (theme.vars || theme)?.palette?.text?.primary,
33
+ transition: 'opacity 0.2s ease-in, fill 0.2s ease-in',
34
+ textAnchor: 'middle',
35
+ dominantBaseline: 'central',
36
+ pointerEvents: 'none',
37
+ opacity: 1,
38
+ [`&.${_barLabelClasses.barLabelClasses.faded}`]: {
39
+ opacity: 0.3
40
+ }
41
+ }));
42
+ function BarLabel(props) {
43
+ const themeProps = (0, _styles.useThemeProps)({
44
+ props,
45
+ name: 'MuiBarLabel'
46
+ });
47
+ const otherProps = (0, _objectWithoutPropertiesLoose2.default)(themeProps, _excluded);
48
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(BarLabelComponent, (0, _extends2.default)({}, otherProps));
49
+ }
50
+ process.env.NODE_ENV !== "production" ? BarLabel.propTypes = {
51
+ // ----------------------------- Warning --------------------------------
52
+ // | These PropTypes are generated from the TypeScript type definitions |
53
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
54
+ // ----------------------------------------------------------------------
55
+ classes: _propTypes.default.object,
56
+ dataIndex: _propTypes.default.number.isRequired,
57
+ isFaded: _propTypes.default.bool.isRequired,
58
+ isHighlighted: _propTypes.default.bool.isRequired,
59
+ seriesId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired
60
+ } : void 0;
@@ -0,0 +1,39 @@
1
+ import { SeriesId } from '../../models/seriesType/common';
2
+ import type { BarLabelClasses } from './barLabelClasses';
3
+ export interface BarLabelOwnerState {
4
+ seriesId: SeriesId;
5
+ dataIndex: number;
6
+ color: string;
7
+ isFaded: boolean;
8
+ isHighlighted: boolean;
9
+ classes?: Partial<BarLabelClasses>;
10
+ }
11
+ export type BarItem = {
12
+ /**
13
+ * The series id of the bar.
14
+ */
15
+ seriesId: SeriesId;
16
+ /**
17
+ * The index of the data point in the series.
18
+ */
19
+ dataIndex: number;
20
+ /**
21
+ * The value of the data point.
22
+ */
23
+ value: number | null;
24
+ };
25
+ export type BarLabelContext = {
26
+ bar: {
27
+ /**
28
+ * The height of the bar.
29
+ * It could be used to control the label based on the bar size.
30
+ */
31
+ height: number;
32
+ /**
33
+ * The width of the bar.
34
+ * It could be used to control the label based on the bar size.
35
+ */
36
+ width: number;
37
+ };
38
+ };
39
+ export type BarLabelFunction = (item: BarItem, context: BarLabelContext) => string | null | undefined;
@@ -0,0 +1,5 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
@@ -0,0 +1,53 @@
1
+ import * as React from 'react';
2
+ import { BarLabelOwnerState, BarItem, BarLabelContext } from './BarLabel.types';
3
+ import { BarLabelProps } from './BarLabel';
4
+ export interface BarLabelSlots {
5
+ /**
6
+ * The component that renders the bar label.
7
+ * @default BarLabel
8
+ */
9
+ barLabel?: React.JSXElementConstructor<BarLabelProps>;
10
+ }
11
+ export interface BarLabelSlotProps {
12
+ barLabel?: Partial<BarLabelProps>;
13
+ }
14
+ export type BarLabelItemProps = Omit<BarLabelOwnerState, 'isFaded' | 'isHighlighted'> & Pick<BarLabelProps, 'style'> & {
15
+ /**
16
+ * The props used for each component slot.
17
+ * @default {}
18
+ */
19
+ slotProps?: BarLabelSlotProps;
20
+ /**
21
+ * Overridable component slots.
22
+ * @default {}
23
+ */
24
+ slots?: BarLabelSlots;
25
+ /**
26
+ * The height of the bar.
27
+ */
28
+ height: number;
29
+ /**
30
+ * The width of the bar.
31
+ */
32
+ width: number;
33
+ /**
34
+ * The value of the data point.
35
+ */
36
+ value: number | null;
37
+ /**
38
+ * If provided, the function will be used to format the label of the bar.
39
+ * It can be set to 'value' to display the current value.
40
+ * @param {BarItem} item The item to format.
41
+ * @param {BarLabelContext} context data about the bar.
42
+ * @returns {string} The formatted label.
43
+ */
44
+ barLabel?: 'value' | ((item: BarItem, context: BarLabelContext) => string | null | undefined);
45
+ };
46
+ /**
47
+ * @ignore - internal component.
48
+ */
49
+ declare function BarLabelItem(props: BarLabelItemProps): React.JSX.Element | null;
50
+ declare namespace BarLabelItem {
51
+ var propTypes: any;
52
+ }
53
+ export { BarLabelItem };
@@ -0,0 +1,138 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.BarLabelItem = BarLabelItem;
8
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
+ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
10
+ var React = _interopRequireWildcard(require("react"));
11
+ var _utils = require("@mui/base/utils");
12
+ var _propTypes = _interopRequireDefault(require("prop-types"));
13
+ var _InteractionProvider = require("../../context/InteractionProvider");
14
+ var _useInteractionItemProps = require("../../hooks/useInteractionItemProps");
15
+ var _barLabelClasses = require("./barLabelClasses");
16
+ var _HighlightProvider = require("../../context/HighlightProvider");
17
+ var _getBarLabel = require("./getBarLabel");
18
+ var _BarLabel = require("./BarLabel");
19
+ var _jsxRuntime = require("react/jsx-runtime");
20
+ const _excluded = ["seriesId", "classes", "color", "style", "dataIndex", "barLabel", "slots", "slotProps", "height", "width", "value"],
21
+ _excluded2 = ["ownerState"];
22
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
23
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
24
+ /**
25
+ * @ignore - internal component.
26
+ */
27
+ function BarLabelItem(props) {
28
+ const {
29
+ seriesId,
30
+ classes: innerClasses,
31
+ color,
32
+ style,
33
+ dataIndex,
34
+ barLabel,
35
+ slots,
36
+ slotProps,
37
+ height,
38
+ width,
39
+ value
40
+ } = props,
41
+ other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
42
+ const {
43
+ item
44
+ } = React.useContext(_InteractionProvider.InteractionContext);
45
+ const {
46
+ scope
47
+ } = React.useContext(_HighlightProvider.HighlighContext);
48
+ const isHighlighted = (0, _useInteractionItemProps.getIsHighlighted)(item, {
49
+ type: 'bar',
50
+ seriesId,
51
+ dataIndex
52
+ }, scope);
53
+ const isFaded = !isHighlighted && (0, _useInteractionItemProps.getIsFaded)(item, {
54
+ type: 'bar',
55
+ seriesId,
56
+ dataIndex
57
+ }, scope);
58
+ const ownerState = {
59
+ seriesId,
60
+ classes: innerClasses,
61
+ color,
62
+ isFaded,
63
+ isHighlighted,
64
+ dataIndex
65
+ };
66
+ const classes = (0, _barLabelClasses.useUtilityClasses)(ownerState);
67
+ const Component = slots?.barLabel ?? _BarLabel.BarLabel;
68
+ const _useSlotProps = (0, _utils.useSlotProps)({
69
+ elementType: Component,
70
+ externalSlotProps: slotProps?.barLabel,
71
+ additionalProps: (0, _extends2.default)({}, other, {
72
+ style,
73
+ className: classes.root
74
+ }),
75
+ ownerState
76
+ }),
77
+ {
78
+ ownerState: barLabelOwnerState
79
+ } = _useSlotProps,
80
+ barLabelProps = (0, _objectWithoutPropertiesLoose2.default)(_useSlotProps, _excluded2);
81
+ if (!barLabel) {
82
+ return null;
83
+ }
84
+ const formattedLabelText = (0, _getBarLabel.getBarLabel)({
85
+ barLabel,
86
+ value,
87
+ dataIndex,
88
+ seriesId,
89
+ height,
90
+ width
91
+ });
92
+ if (!formattedLabelText) {
93
+ return null;
94
+ }
95
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, (0, _extends2.default)({}, barLabelProps, barLabelOwnerState, {
96
+ children: formattedLabelText
97
+ }));
98
+ }
99
+ process.env.NODE_ENV !== "production" ? BarLabelItem.propTypes = {
100
+ // ----------------------------- Warning --------------------------------
101
+ // | These PropTypes are generated from the TypeScript type definitions |
102
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
103
+ // ----------------------------------------------------------------------
104
+ /**
105
+ * If provided, the function will be used to format the label of the bar.
106
+ * It can be set to 'value' to display the current value.
107
+ * @param {BarItem} item The item to format.
108
+ * @param {BarLabelContext} context data about the bar.
109
+ * @returns {string} The formatted label.
110
+ */
111
+ barLabel: _propTypes.default.oneOfType([_propTypes.default.oneOf(['value']), _propTypes.default.func]),
112
+ classes: _propTypes.default.object,
113
+ color: _propTypes.default.string.isRequired,
114
+ dataIndex: _propTypes.default.number.isRequired,
115
+ /**
116
+ * The height of the bar.
117
+ */
118
+ height: _propTypes.default.number.isRequired,
119
+ seriesId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired,
120
+ /**
121
+ * The props used for each component slot.
122
+ * @default {}
123
+ */
124
+ slotProps: _propTypes.default.object,
125
+ /**
126
+ * Overridable component slots.
127
+ * @default {}
128
+ */
129
+ slots: _propTypes.default.object,
130
+ /**
131
+ * The value of the data point.
132
+ */
133
+ value: _propTypes.default.number,
134
+ /**
135
+ * The width of the bar.
136
+ */
137
+ width: _propTypes.default.number.isRequired
138
+ } : void 0;
@@ -0,0 +1,16 @@
1
+ import * as React from 'react';
2
+ import type { CompletedBarData } from '../types';
3
+ import { BarLabelItemProps } from './BarLabelItem';
4
+ type BarLabelPlotProps = {
5
+ bars: CompletedBarData[];
6
+ skipAnimation?: boolean;
7
+ barLabel?: BarLabelItemProps['barLabel'];
8
+ };
9
+ /**
10
+ * @ignore - internal component.
11
+ */
12
+ declare function BarLabelPlot(props: BarLabelPlotProps): React.JSX.Element;
13
+ declare namespace BarLabelPlot {
14
+ var propTypes: any;
15
+ }
16
+ export { BarLabelPlot };
@@ -0,0 +1,110 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.BarLabelPlot = BarLabelPlot;
8
+ var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
9
+ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
10
+ var React = _interopRequireWildcard(require("react"));
11
+ var _propTypes = _interopRequireDefault(require("prop-types"));
12
+ var _web = require("@react-spring/web");
13
+ var _BarLabelItem = require("./BarLabelItem");
14
+ var _jsxRuntime = require("react/jsx-runtime");
15
+ const _excluded = ["bars", "skipAnimation"];
16
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
17
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
18
+ const leaveStyle = ({
19
+ layout,
20
+ yOrigin,
21
+ x,
22
+ width,
23
+ y,
24
+ xOrigin,
25
+ height
26
+ }) => (0, _extends2.default)({}, layout === 'vertical' ? {
27
+ y: yOrigin,
28
+ x: x + width / 2,
29
+ height: 0,
30
+ width
31
+ } : {
32
+ y: y + height / 2,
33
+ x: xOrigin,
34
+ height,
35
+ width: 0
36
+ });
37
+ const enterStyle = ({
38
+ x,
39
+ width,
40
+ y,
41
+ height
42
+ }) => ({
43
+ x: x + width / 2,
44
+ y: y + height / 2,
45
+ height,
46
+ width
47
+ });
48
+ /**
49
+ * @ignore - internal component.
50
+ */
51
+ function BarLabelPlot(props) {
52
+ const {
53
+ bars,
54
+ skipAnimation
55
+ } = props,
56
+ other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
57
+ const barLabelTransition = (0, _web.useTransition)(bars, {
58
+ keys: bar => `${bar.seriesId}-${bar.dataIndex}`,
59
+ from: leaveStyle,
60
+ leave: null,
61
+ enter: enterStyle,
62
+ update: enterStyle,
63
+ immediate: skipAnimation
64
+ });
65
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(React.Fragment, {
66
+ children: barLabelTransition((style, {
67
+ seriesId,
68
+ dataIndex,
69
+ color,
70
+ value,
71
+ width,
72
+ height
73
+ }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_BarLabelItem.BarLabelItem, (0, _extends2.default)({
74
+ seriesId: seriesId,
75
+ dataIndex: dataIndex,
76
+ value: value,
77
+ color: color,
78
+ width: width,
79
+ height: height
80
+ }, other, {
81
+ style: style
82
+ })))
83
+ });
84
+ }
85
+ process.env.NODE_ENV !== "production" ? BarLabelPlot.propTypes = {
86
+ // ----------------------------- Warning --------------------------------
87
+ // | These PropTypes are generated from the TypeScript type definitions |
88
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
89
+ // ----------------------------------------------------------------------
90
+ barLabel: _propTypes.default.oneOfType([_propTypes.default.oneOf(['value']), _propTypes.default.func]),
91
+ bars: _propTypes.default.arrayOf(_propTypes.default.shape({
92
+ color: _propTypes.default.string.isRequired,
93
+ dataIndex: _propTypes.default.number.isRequired,
94
+ height: _propTypes.default.number.isRequired,
95
+ highlightScope: _propTypes.default.shape({
96
+ faded: _propTypes.default.oneOf(['global', 'none', 'series']),
97
+ highlighted: _propTypes.default.oneOf(['item', 'none', 'series'])
98
+ }),
99
+ layout: _propTypes.default.oneOf(['horizontal', 'vertical']),
100
+ maskId: _propTypes.default.string.isRequired,
101
+ seriesId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired,
102
+ value: _propTypes.default.number,
103
+ width: _propTypes.default.number.isRequired,
104
+ x: _propTypes.default.number.isRequired,
105
+ xOrigin: _propTypes.default.number.isRequired,
106
+ y: _propTypes.default.number.isRequired,
107
+ yOrigin: _propTypes.default.number.isRequired
108
+ })).isRequired,
109
+ skipAnimation: _propTypes.default.bool
110
+ } : void 0;
@@ -0,0 +1,13 @@
1
+ import type { BarLabelOwnerState } from './BarLabel.types';
2
+ export interface BarLabelClasses {
3
+ /** Styles applied to the root element. */
4
+ root: string;
5
+ /** Styles applied to the root element if it is highlighted. */
6
+ highlighted: string;
7
+ /** Styles applied to the root element if it is faded. */
8
+ faded: string;
9
+ }
10
+ export type BarLabelClassKey = keyof BarLabelClasses;
11
+ export declare function getBarLabelUtilityClass(slot: string): string;
12
+ export declare const barLabelClasses: Record<"root" | "highlighted" | "faded", string>;
13
+ export declare const useUtilityClasses: (ownerState: BarLabelOwnerState) => Record<"root", string>;
@@ -0,0 +1,29 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.barLabelClasses = void 0;
8
+ exports.getBarLabelUtilityClass = getBarLabelUtilityClass;
9
+ exports.useUtilityClasses = void 0;
10
+ var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
11
+ var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
12
+ var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
13
+ function getBarLabelUtilityClass(slot) {
14
+ return (0, _generateUtilityClass.default)('MuiBarLabel', slot);
15
+ }
16
+ const barLabelClasses = exports.barLabelClasses = (0, _generateUtilityClasses.default)('MuiBarLabel', ['root', 'highlighted', 'faded']);
17
+ const useUtilityClasses = ownerState => {
18
+ const {
19
+ classes,
20
+ seriesId,
21
+ isFaded,
22
+ isHighlighted
23
+ } = ownerState;
24
+ const slots = {
25
+ root: ['root', `series-${seriesId}`, isHighlighted && 'highlighted', isFaded && 'faded']
26
+ };
27
+ return (0, _composeClasses.default)(slots, getBarLabelUtilityClass, classes);
28
+ };
29
+ exports.useUtilityClasses = useUtilityClasses;
@@ -0,0 +1,10 @@
1
+ import { SeriesId } from '../../models/seriesType/common';
2
+ import { BarLabelFunction } from './BarLabel.types';
3
+ export declare const getBarLabel: (options: {
4
+ barLabel: 'value' | BarLabelFunction;
5
+ value: number | null;
6
+ dataIndex: number;
7
+ seriesId: SeriesId;
8
+ height: number;
9
+ width: number;
10
+ }) => string | null | undefined;
@@ -0,0 +1,31 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.getBarLabel = void 0;
7
+ const getBarLabel = options => {
8
+ const {
9
+ barLabel,
10
+ value,
11
+ dataIndex,
12
+ seriesId,
13
+ height,
14
+ width
15
+ } = options;
16
+ if (barLabel === 'value') {
17
+ // We don't want to show the label if the value is 0
18
+ return value ? value?.toString() : null;
19
+ }
20
+ return barLabel({
21
+ seriesId,
22
+ dataIndex,
23
+ value
24
+ }, {
25
+ bar: {
26
+ height,
27
+ width
28
+ }
29
+ });
30
+ };
31
+ exports.getBarLabel = getBarLabel;
@@ -0,0 +1,6 @@
1
+ export { BarLabel } from './BarLabel';
2
+ export type { BarLabelProps } from './BarLabel';
3
+ export { barLabelClasses, getBarLabelUtilityClass } from './barLabelClasses';
4
+ export type { BarLabelSlotProps, BarLabelSlots } from './BarLabelItem';
5
+ export type { BarLabelOwnerState, BarItem, BarLabelContext } from './BarLabel.types';
6
+ export type { BarLabelClasses, BarLabelClassKey } from './barLabelClasses';
@@ -0,0 +1,25 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ Object.defineProperty(exports, "BarLabel", {
7
+ enumerable: true,
8
+ get: function () {
9
+ return _BarLabel.BarLabel;
10
+ }
11
+ });
12
+ Object.defineProperty(exports, "barLabelClasses", {
13
+ enumerable: true,
14
+ get: function () {
15
+ return _barLabelClasses.barLabelClasses;
16
+ }
17
+ });
18
+ Object.defineProperty(exports, "getBarLabelUtilityClass", {
19
+ enumerable: true,
20
+ get: function () {
21
+ return _barLabelClasses.getBarLabelUtilityClass;
22
+ }
23
+ });
24
+ var _BarLabel = require("./BarLabel");
25
+ var _barLabelClasses = require("./barLabelClasses");
@@ -1,11 +1,12 @@
1
1
  import * as React from 'react';
2
- import { BarElementProps, BarElementSlotProps, BarElementSlots } from './BarElement';
2
+ import { BarElementSlotProps, BarElementSlots } from './BarElement';
3
3
  import { BarItemIdentifier } from '../models';
4
- export interface BarPlotSlots extends BarElementSlots {
4
+ import { BarLabelItemProps, BarLabelSlotProps, BarLabelSlots } from './BarLabel/BarLabelItem';
5
+ export interface BarPlotSlots extends BarElementSlots, BarLabelSlots {
5
6
  }
6
- export interface BarPlotSlotProps extends BarElementSlotProps {
7
+ export interface BarPlotSlotProps extends BarElementSlotProps, BarLabelSlotProps {
7
8
  }
8
- export interface BarPlotProps extends Pick<BarElementProps, 'slots' | 'slotProps'> {
9
+ export interface BarPlotProps extends Pick<BarLabelItemProps, 'barLabel'> {
9
10
  /**
10
11
  * If `true`, animations are skipped.
11
12
  * @default false
@@ -21,6 +22,16 @@ export interface BarPlotProps extends Pick<BarElementProps, 'slots' | 'slotProps
21
22
  * Defines the border radius of the bar element.
22
23
  */
23
24
  borderRadius?: number;
25
+ /**
26
+ * The props used for each component slot.
27
+ * @default {}
28
+ */
29
+ slotProps?: BarPlotSlotProps;
30
+ /**
31
+ * Overridable component slots.
32
+ * @default {}
33
+ */
34
+ slots?: BarPlotSlots;
24
35
  }
25
36
  /**
26
37
  * Demos:
@@ -18,8 +18,9 @@ var _constants = require("../constants");
18
18
  var _getColor = _interopRequireDefault(require("./getColor"));
19
19
  var _hooks = require("../hooks");
20
20
  var _BarClipPath = require("./BarClipPath");
21
+ var _BarLabelPlot = require("./BarLabel/BarLabelPlot");
21
22
  var _jsxRuntime = require("react/jsx-runtime");
22
- const _excluded = ["skipAnimation", "onItemClick", "borderRadius"];
23
+ const _excluded = ["skipAnimation", "onItemClick", "borderRadius", "barLabel"];
23
24
  /**
24
25
  * Solution of the equations
25
26
  * W = barWidth * N + offset * (N-1)
@@ -219,7 +220,8 @@ function BarPlot(props) {
219
220
  const {
220
221
  skipAnimation,
221
222
  onItemClick,
222
- borderRadius
223
+ borderRadius,
224
+ barLabel
223
225
  } = props,
224
226
  other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
225
227
  const transition = (0, _web.useTransition)(completedData, {
@@ -282,14 +284,26 @@ function BarPlot(props) {
282
284
  clipPath: `url(#${maskId})`,
283
285
  children: barElement
284
286
  });
285
- })]
287
+ }), barLabel && /*#__PURE__*/(0, _jsxRuntime.jsx)(_BarLabelPlot.BarLabelPlot, (0, _extends2.default)({
288
+ bars: completedData,
289
+ skipAnimation: skipAnimation,
290
+ barLabel: barLabel
291
+ }, other))]
286
292
  });
287
293
  }
288
294
  process.env.NODE_ENV !== "production" ? BarPlot.propTypes = {
289
295
  // ----------------------------- Warning --------------------------------
290
296
  // | These PropTypes are generated from the TypeScript type definitions |
291
- // | To update them edit the TypeScript types and run "yarn proptypes" |
297
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
292
298
  // ----------------------------------------------------------------------
299
+ /**
300
+ * If provided, the function will be used to format the label of the bar.
301
+ * It can be set to 'value' to display the current value.
302
+ * @param {BarItem} item The item to format.
303
+ * @param {BarLabelContext} context data about the bar.
304
+ * @returns {string} The formatted label.
305
+ */
306
+ barLabel: _propTypes.default.oneOfType([_propTypes.default.oneOf(['value']), _propTypes.default.func]),
293
307
  /**
294
308
  * Defines the border radius of the bar element.
295
309
  */
@@ -1,3 +1,4 @@
1
1
  export * from './BarChart';
2
2
  export * from './BarPlot';
3
3
  export * from './BarElement';
4
+ export * from './BarLabel';
package/BarChart/index.js CHANGED
@@ -35,4 +35,15 @@ Object.keys(_BarElement).forEach(function (key) {
35
35
  return _BarElement[key];
36
36
  }
37
37
  });
38
+ });
39
+ var _BarLabel = require("./BarLabel");
40
+ Object.keys(_BarLabel).forEach(function (key) {
41
+ if (key === "default" || key === "__esModule") return;
42
+ if (key in exports && exports[key] === _BarLabel[key]) return;
43
+ Object.defineProperty(exports, key, {
44
+ enumerable: true,
45
+ get: function () {
46
+ return _BarLabel[key];
47
+ }
48
+ });
38
49
  });