@mui/x-charts-pro 8.11.3 → 8.12.0

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 (108) hide show
  1. package/BarChartPro/BarChartPro.d.ts +2 -2
  2. package/BarChartPro/BarChartPro.js +1 -0
  3. package/BarChartPro/BarChartPro.plugins.d.ts +3 -3
  4. package/BarChartPro/BarChartPro.plugins.js +1 -1
  5. package/BarChartPro/index.d.ts +2 -1
  6. package/BarChartPro/index.js +11 -0
  7. package/CHANGELOG.md +151 -6
  8. package/ChartDataProviderPro/ChartDataProviderPro.js +1 -1
  9. package/FunnelChart/FunnelChart.d.ts +2 -2
  10. package/FunnelChart/FunnelChart.plugins.d.ts +2 -2
  11. package/FunnelChart/funnelAxisPlugin/computeAxisValue.js +1 -1
  12. package/FunnelChart/index.d.ts +1 -0
  13. package/FunnelChart/index.js +12 -0
  14. package/FunnelChart/useFunnelChartProps.d.ts +2 -2
  15. package/Heatmap/Heatmap.d.ts +2 -2
  16. package/Heatmap/Heatmap.plugins.d.ts +2 -2
  17. package/Heatmap/index.d.ts +1 -0
  18. package/Heatmap/index.js +12 -0
  19. package/LineChartPro/LineChartPro.d.ts +2 -2
  20. package/LineChartPro/LineChartPro.js +1 -0
  21. package/LineChartPro/LineChartPro.plugins.d.ts +3 -3
  22. package/LineChartPro/LineChartPro.plugins.js +1 -1
  23. package/LineChartPro/index.d.ts +2 -1
  24. package/LineChartPro/index.js +11 -0
  25. package/PieChartPro/PieChartPro.js +1 -0
  26. package/PieChartPro/PieChartPro.plugins.d.ts +2 -2
  27. package/PieChartPro/index.d.ts +2 -1
  28. package/PieChartPro/index.js +11 -0
  29. package/RadarChartPro/RadarChartPro.d.ts +2 -2
  30. package/RadarChartPro/RadarChartPro.plugins.d.ts +2 -2
  31. package/RadarChartPro/index.d.ts +2 -1
  32. package/RadarChartPro/index.js +11 -0
  33. package/SankeyChart/SankeyChart.d.ts +2 -2
  34. package/SankeyChart/SankeyChart.js +4 -1
  35. package/SankeyChart/SankeyChart.plugins.d.ts +3 -2
  36. package/SankeyChart/SankeyChart.plugins.js +2 -4
  37. package/SankeyChart/SankeyLinkLabel.js +12 -1
  38. package/SankeyChart/calculateSankeyLayout.js +8 -2
  39. package/SankeyChart/sankey.types.d.ts +55 -5
  40. package/SankeyChart/seriesConfig/getSeriesWithDefaultValues.js +2 -0
  41. package/SankeyChart/seriesConfig/tooltipGetter.js +13 -3
  42. package/SankeyChart/useSankeyChartProps.d.ts +2 -2
  43. package/ScatterChartPro/ScatterChartPro.d.ts +2 -2
  44. package/ScatterChartPro/ScatterChartPro.js +13 -2
  45. package/ScatterChartPro/ScatterChartPro.plugins.d.ts +3 -3
  46. package/ScatterChartPro/ScatterChartPro.plugins.js +1 -1
  47. package/ScatterChartPro/index.d.ts +2 -1
  48. package/ScatterChartPro/index.js +11 -0
  49. package/context/ChartProApi.d.ts +14 -12
  50. package/esm/BarChartPro/BarChartPro.d.ts +2 -2
  51. package/esm/BarChartPro/BarChartPro.js +1 -0
  52. package/esm/BarChartPro/BarChartPro.plugins.d.ts +3 -3
  53. package/esm/BarChartPro/BarChartPro.plugins.js +2 -2
  54. package/esm/BarChartPro/index.d.ts +2 -1
  55. package/esm/BarChartPro/index.js +2 -1
  56. package/esm/ChartDataProviderPro/ChartDataProviderPro.js +1 -1
  57. package/esm/FunnelChart/FunnelChart.d.ts +2 -2
  58. package/esm/FunnelChart/FunnelChart.plugins.d.ts +2 -2
  59. package/esm/FunnelChart/funnelAxisPlugin/computeAxisValue.js +2 -2
  60. package/esm/FunnelChart/index.d.ts +1 -0
  61. package/esm/FunnelChart/index.js +1 -0
  62. package/esm/FunnelChart/useFunnelChartProps.d.ts +2 -2
  63. package/esm/Heatmap/Heatmap.d.ts +2 -2
  64. package/esm/Heatmap/Heatmap.plugins.d.ts +2 -2
  65. package/esm/Heatmap/index.d.ts +1 -0
  66. package/esm/Heatmap/index.js +1 -0
  67. package/esm/LineChartPro/LineChartPro.d.ts +2 -2
  68. package/esm/LineChartPro/LineChartPro.js +1 -0
  69. package/esm/LineChartPro/LineChartPro.plugins.d.ts +3 -3
  70. package/esm/LineChartPro/LineChartPro.plugins.js +2 -2
  71. package/esm/LineChartPro/index.d.ts +2 -1
  72. package/esm/LineChartPro/index.js +2 -1
  73. package/esm/PieChartPro/PieChartPro.js +1 -0
  74. package/esm/PieChartPro/PieChartPro.plugins.d.ts +2 -2
  75. package/esm/PieChartPro/index.d.ts +2 -1
  76. package/esm/PieChartPro/index.js +2 -1
  77. package/esm/RadarChartPro/RadarChartPro.d.ts +2 -2
  78. package/esm/RadarChartPro/RadarChartPro.plugins.d.ts +2 -2
  79. package/esm/RadarChartPro/index.d.ts +2 -1
  80. package/esm/RadarChartPro/index.js +2 -1
  81. package/esm/SankeyChart/SankeyChart.d.ts +2 -2
  82. package/esm/SankeyChart/SankeyChart.js +4 -1
  83. package/esm/SankeyChart/SankeyChart.plugins.d.ts +3 -2
  84. package/esm/SankeyChart/SankeyChart.plugins.js +2 -6
  85. package/esm/SankeyChart/SankeyLinkLabel.js +12 -1
  86. package/esm/SankeyChart/calculateSankeyLayout.js +8 -2
  87. package/esm/SankeyChart/sankey.types.d.ts +55 -5
  88. package/esm/SankeyChart/seriesConfig/getSeriesWithDefaultValues.js +2 -0
  89. package/esm/SankeyChart/seriesConfig/tooltipGetter.js +13 -3
  90. package/esm/SankeyChart/useSankeyChartProps.d.ts +2 -2
  91. package/esm/ScatterChartPro/ScatterChartPro.d.ts +2 -2
  92. package/esm/ScatterChartPro/ScatterChartPro.js +13 -2
  93. package/esm/ScatterChartPro/ScatterChartPro.plugins.d.ts +3 -3
  94. package/esm/ScatterChartPro/ScatterChartPro.plugins.js +2 -2
  95. package/esm/ScatterChartPro/index.d.ts +2 -1
  96. package/esm/ScatterChartPro/index.js +2 -1
  97. package/esm/context/ChartProApi.d.ts +14 -12
  98. package/esm/index.d.ts +1 -0
  99. package/esm/index.js +2 -1
  100. package/esm/internals/plugins/useChartProExport/useChartProExport.types.d.ts +1 -2
  101. package/esm/plugins/index.d.ts +3 -0
  102. package/esm/plugins/index.js +3 -0
  103. package/index.d.ts +1 -0
  104. package/index.js +13 -1
  105. package/internals/plugins/useChartProExport/useChartProExport.types.d.ts +1 -2
  106. package/package.json +6 -6
  107. package/plugins/index.d.ts +3 -0
  108. package/plugins/index.js +35 -0
@@ -1,4 +1,4 @@
1
- import { ConvertSignaturesIntoPlugins, UseChartHighlightSignature, UseChartInteractionSignature } from '@mui/x-charts/internals';
1
+ import { ConvertSignaturesIntoPlugins, UseChartHighlightSignature, UseChartInteractionSignature, UseChartKeyboardNavigationSignature } from '@mui/x-charts/internals';
2
2
  import { UseChartProExportSignature } from "../internals/plugins/useChartProExport/index.js";
3
- export type PieChartProPluginSignatures = [UseChartInteractionSignature, UseChartHighlightSignature, UseChartProExportSignature];
3
+ export type PieChartProPluginSignatures = [UseChartInteractionSignature, UseChartHighlightSignature, UseChartKeyboardNavigationSignature, UseChartProExportSignature];
4
4
  export declare const PIE_CHART_PRO_PLUGINS: ConvertSignaturesIntoPlugins<PieChartProPluginSignatures>;
@@ -1 +1,2 @@
1
- export * from "./PieChartPro.js";
1
+ export * from "./PieChartPro.js";
2
+ export * from "./PieChartPro.plugins.js";
@@ -1 +1,2 @@
1
- export * from "./PieChartPro.js";
1
+ export * from "./PieChartPro.js";
2
+ export * from "./PieChartPro.plugins.js";
@@ -1,11 +1,11 @@
1
1
  import * as React from 'react';
2
2
  import { RadarChartProps, RadarDataProviderProps, RadarChartSlotProps, RadarChartSlots } from '@mui/x-charts/RadarChart';
3
- import { RadarChartProPluginsSignatures } from "./RadarChartPro.plugins.js";
3
+ import { RadarChartProPluginSignatures } from "./RadarChartPro.plugins.js";
4
4
  import { ChartsToolbarProSlotProps, ChartsToolbarProSlots } from "../ChartsToolbarPro/Toolbar.types.js";
5
5
  import { ChartsSlotPropsPro, ChartsSlotsPro } from "../internals/material/index.js";
6
6
  export interface RadarChartProSlots extends Omit<RadarChartSlots, 'toolbar'>, ChartsToolbarProSlots, Partial<ChartsSlotsPro> {}
7
7
  export interface RadarChartProSlotProps extends Omit<RadarChartSlotProps, 'toolbar'>, ChartsToolbarProSlotProps, Partial<ChartsSlotPropsPro> {}
8
- export interface RadarChartProProps extends Omit<RadarChartProps, 'apiRef' | 'slots' | 'slotProps'>, Omit<RadarDataProviderProps<RadarChartProPluginsSignatures>, 'plugins' | 'seriesConfig' | 'slots' | 'slotProps' | 'experimentalFeatures'> {
8
+ export interface RadarChartProProps extends Omit<RadarChartProps, 'apiRef' | 'slots' | 'slotProps'>, Omit<RadarDataProviderProps<RadarChartProPluginSignatures>, 'plugins' | 'seriesConfig' | 'slots' | 'slotProps' | 'experimentalFeatures'> {
9
9
  /**
10
10
  * Overridable component slots.
11
11
  * @default {}
@@ -1,4 +1,4 @@
1
1
  import { ConvertSignaturesIntoPlugins, UseChartHighlightSignature, UseChartInteractionSignature, UseChartPolarAxisSignature } from '@mui/x-charts/internals';
2
2
  import { UseChartProExportSignature } from "../internals/plugins/useChartProExport/index.js";
3
- export type RadarChartProPluginsSignatures = [UseChartPolarAxisSignature, UseChartInteractionSignature, UseChartHighlightSignature, UseChartProExportSignature];
4
- export declare const RADAR_CHART_PRO_PLUGINS: ConvertSignaturesIntoPlugins<RadarChartProPluginsSignatures>;
3
+ export type RadarChartProPluginSignatures = [UseChartPolarAxisSignature, UseChartInteractionSignature, UseChartHighlightSignature, UseChartProExportSignature];
4
+ export declare const RADAR_CHART_PRO_PLUGINS: ConvertSignaturesIntoPlugins<RadarChartProPluginSignatures>;
@@ -1 +1,2 @@
1
- export * from "./RadarChartPro.js";
1
+ export * from "./RadarChartPro.js";
2
+ export * from "./RadarChartPro.plugins.js";
@@ -1 +1,2 @@
1
- export * from "./RadarChartPro.js";
1
+ export * from "./RadarChartPro.js";
2
+ export * from "./RadarChartPro.plugins.js";
@@ -3,11 +3,11 @@ import { type ChartsOverlayProps } from '@mui/x-charts/ChartsOverlay';
3
3
  import type { MakeOptional } from '@mui/x-internals/types';
4
4
  import { ChartContainerProProps } from "../ChartContainerPro/index.js";
5
5
  import { type SankeyPlotProps } from "./SankeyPlot.js";
6
- import { type SankeyChartPluginsSignatures } from "./SankeyChart.plugins.js";
6
+ import { type SankeyChartPluginSignatures } from "./SankeyChart.plugins.js";
7
7
  import type { SankeySeriesType } from "./sankey.types.js";
8
8
  import type { SankeyChartSlotExtension } from "./sankeySlots.types.js";
9
9
  export type SankeySeries = MakeOptional<SankeySeriesType, 'type'>;
10
- export interface SankeyChartProps extends Omit<ChartContainerProProps<'sankey', SankeyChartPluginsSignatures>, 'plugins' | 'series' | 'slotProps' | 'slots' | 'dataset' | 'hideLegend' | 'skipAnimation' | 'highlightedItem' | 'onHighlightChange'>, Omit<SankeyPlotProps, 'data'>, Omit<ChartsOverlayProps, 'slots' | 'slotProps'>, SankeyChartSlotExtension {
10
+ export interface SankeyChartProps extends Omit<ChartContainerProProps<'sankey', SankeyChartPluginSignatures>, 'plugins' | 'series' | 'slotProps' | 'slots' | 'dataset' | 'hideLegend' | 'skipAnimation' | 'highlightedItem' | 'onHighlightChange'>, Omit<SankeyPlotProps, 'data'>, Omit<ChartsOverlayProps, 'slots' | 'slotProps'>, SankeyChartSlotExtension {
11
11
  /**
12
12
  * The series to display in the Sankey chart.
13
13
  * A single object is expected.
@@ -68,7 +68,10 @@ process.env.NODE_ENV !== "production" ? SankeyChart.propTypes = {
68
68
  // | To update them edit the TypeScript types and run "pnpm proptypes" |
69
69
  // ----------------------------------------------------------------------
70
70
  apiRef: PropTypes.shape({
71
- current: PropTypes.object
71
+ current: PropTypes.shape({
72
+ exportAsImage: PropTypes.func.isRequired,
73
+ exportAsPrint: PropTypes.func.isRequired
74
+ })
72
75
  }),
73
76
  /**
74
77
  * Classes applied to the various elements.
@@ -1,3 +1,4 @@
1
1
  import { ConvertSignaturesIntoPlugins, UseChartHighlightSignature, UseChartInteractionSignature } from '@mui/x-charts/internals';
2
- export type SankeyChartPluginsSignatures = [UseChartInteractionSignature, UseChartHighlightSignature];
3
- export declare const SANKEY_CHART_PLUGINS: ConvertSignaturesIntoPlugins<SankeyChartPluginsSignatures>;
2
+ import { UseChartProExportSignature } from "../internals/plugins/useChartProExport/index.js";
3
+ export type SankeyChartPluginSignatures = [UseChartInteractionSignature, UseChartHighlightSignature, UseChartProExportSignature];
4
+ export declare const SANKEY_CHART_PLUGINS: ConvertSignaturesIntoPlugins<SankeyChartPluginSignatures>;
@@ -1,9 +1,5 @@
1
1
  import { useChartHighlight
2
2
  // useChartHighlight,
3
3
  , useChartInteraction } from '@mui/x-charts/internals';
4
- import // useChartProExport,
5
- // UseChartProExportSignature,
6
- "../internals/plugins/useChartProExport/index.js";
7
- export const SANKEY_CHART_PLUGINS = [useChartInteraction, useChartHighlight
8
- // useChartProExport,
9
- ];
4
+ import { useChartProExport } from "../internals/plugins/useChartProExport/index.js";
5
+ export const SANKEY_CHART_PLUGINS = [useChartInteraction, useChartHighlight, useChartProExport];
@@ -2,6 +2,7 @@
2
2
 
3
3
  import * as React from 'react';
4
4
  import { useTheme } from '@mui/material/styles';
5
+ import { useSankeySeriesContext } from "../hooks/useSankeySeries.js";
5
6
  import { jsx as _jsx } from "react/jsx-runtime";
6
7
  const getLinkMidpoint = link => {
7
8
  if (link.y0 === undefined || link.y1 === undefined) {
@@ -30,10 +31,20 @@ export const SankeyLinkLabel = /*#__PURE__*/React.forwardRef(function SankeyLink
30
31
  link
31
32
  } = props;
32
33
  const theme = useTheme();
34
+ const seriesContext = useSankeySeriesContext();
33
35
  if (!link.path || link.y0 === undefined || link.y1 === undefined) {
34
36
  return null; // No path defined or invalid coordinates, nothing to render
35
37
  }
36
38
  const midpoint = getLinkMidpoint(link);
39
+
40
+ // Get the series data and valueFormatter
41
+ const series = seriesContext?.series[seriesContext.seriesOrder?.[0]];
42
+ const formattedValue = series?.valueFormatter ? series.valueFormatter(link.value, {
43
+ type: 'link',
44
+ sourceId: link.source.id,
45
+ targetId: link.target.id,
46
+ location: 'label'
47
+ }) : link.value;
37
48
  return /*#__PURE__*/_jsx("text", {
38
49
  ref: ref,
39
50
  x: midpoint.x,
@@ -46,7 +57,7 @@ export const SankeyLinkLabel = /*#__PURE__*/React.forwardRef(function SankeyLink
46
57
  "data-link-target": link.target.id,
47
58
  fontFamily: theme.typography.fontFamily,
48
59
  pointerEvents: "none",
49
- children: link.value
60
+ children: formattedValue
50
61
  });
51
62
  });
52
63
  if (process.env.NODE_ENV !== "production") SankeyLinkLabel.displayName = "SankeyLinkLabel";
@@ -27,7 +27,7 @@ export function calculateSankeyLayout(data, drawingArea, theme, series = {}) {
27
27
  sort: nodeSort = null
28
28
  } = nodeOptions ?? {};
29
29
  const {
30
- color: linkColor = (theme.vars || theme).palette.text.primary,
30
+ color: linkColor = 'source',
31
31
  sort: linkSort = null,
32
32
  curveCorrection = 10
33
33
  } = linkOptions ?? {};
@@ -86,8 +86,14 @@ export function calculateSankeyLayout(data, drawingArea, theme, series = {}) {
86
86
  const originalLink = data.links.find(l => {
87
87
  return l.source === link.source.id && l.target === link.target.id;
88
88
  });
89
+ let resolvedColor = originalLink?.color ?? linkColor;
90
+ if (resolvedColor === 'source') {
91
+ resolvedColor = link.source.color ?? linkColor;
92
+ } else if (resolvedColor === 'target') {
93
+ resolvedColor = link.target.color ?? linkColor;
94
+ }
89
95
  return _extends({}, originalLink, link, {
90
- color: originalLink?.color ?? linkColor,
96
+ color: resolvedColor,
91
97
  path: improvedNaiveSankeyLinkPathHorizontal(link, curveCorrection)
92
98
  });
93
99
  });
@@ -38,9 +38,13 @@ export interface SankeyLink {
38
38
  */
39
39
  data?: any;
40
40
  /**
41
- * Optional color override for the link
41
+ * Optional color override for the link.
42
+ * Can be a color string, or a keyword:
43
+ * - 'source': Use the color of the source node
44
+ * - 'target': Use the color of the target node
45
+ * @default 'source'
42
46
  */
43
- color?: string;
47
+ color?: string | 'source' | 'target';
44
48
  }
45
49
  export type SankeyNodeOptions = {
46
50
  /**
@@ -78,9 +82,13 @@ export type SankeyNodeOptions = {
78
82
  };
79
83
  export type SankeyLinkOptions = {
80
84
  /**
81
- * Default color for links without specified colors
85
+ * Default color for links without specified colors.
86
+ * Can be a color string, or a keyword:
87
+ * - 'source': Use the color of the source node
88
+ * - 'target': Use the color of the target node
89
+ * @default 'source'
82
90
  */
83
- color?: string;
91
+ color?: string | 'source' | 'target';
84
92
  /**
85
93
  * Opacity of the links (0-1)
86
94
  */
@@ -146,6 +154,17 @@ export interface SankeySeriesType {
146
154
  * @default 6
147
155
  */
148
156
  iterations?: number;
157
+ /**
158
+ * Formatter used to render values in tooltip or other data display.
159
+ * @param {number} value The value to render.
160
+ * @param {SankeyValueFormatterContext} context The rendering context of the value.
161
+ * @param {'node' | 'link'} context.type The type of element being formatted.
162
+ * @param {SankeyNodeId} [context.nodeId] For nodes: the node ID. For links: undefined.
163
+ * @param {SankeyNodeId} [context.sourceId] For links: the source node ID. For nodes: undefined.
164
+ * @param {SankeyNodeId} [context.targetId] For links: the target node ID. For nodes: undefined.
165
+ * @returns {string | null} The formatted value to display.
166
+ */
167
+ valueFormatter?: (value: number, context: SankeyValueFormatterContext) => string | null;
149
168
  }
150
169
  /**
151
170
  * Represents the calculated positions and dimensions for a node in the Sankey diagram
@@ -170,7 +189,7 @@ export interface SankeyLayout {
170
189
  nodes: readonly SankeyLayoutNode[];
171
190
  links: readonly SankeyLayoutLink[];
172
191
  }
173
- export interface DefaultizedSankeySeriesType extends DefaultizedProps<Omit<SankeySeriesType, 'data'>, 'id'> {
192
+ export interface DefaultizedSankeySeriesType extends DefaultizedProps<Omit<SankeySeriesType, 'data'>, 'id' | 'valueFormatter'> {
174
193
  data: {
175
194
  nodes: Map<SankeyNodeId, SankeyNode>;
176
195
  links: readonly SankeyLink[];
@@ -222,4 +241,35 @@ export type SankeyLinkIdentifierWithData = SankeyLinkIdentifier & {
222
241
  };
223
242
  export type SankeyItemIdentifier = SankeyNodeIdentifier | SankeyLinkIdentifier;
224
243
  export type SankeyItemIdentifierWithData = SankeyNodeIdentifierWithData | SankeyLinkIdentifierWithData;
244
+ export type SankeyValueFormatterContext = {
245
+ /**
246
+ * Where the value will be displayed
247
+ */
248
+ location: 'tooltip' | 'label';
249
+ /**
250
+ * Can be 'node' or 'link'
251
+ */
252
+ type: 'node';
253
+ /**
254
+ * The id of the node
255
+ */
256
+ nodeId: SankeyNodeId;
257
+ } | {
258
+ /**
259
+ * Where the value will be displayed
260
+ */
261
+ location: 'tooltip' | 'label';
262
+ /**
263
+ * Can be 'node' or 'link'
264
+ */
265
+ type: 'link';
266
+ /**
267
+ * The id of the source node
268
+ */
269
+ sourceId: SankeyNodeId;
270
+ /**
271
+ * The id of the target node
272
+ */
273
+ targetId: SankeyNodeId;
274
+ };
225
275
  export {};
@@ -1,4 +1,5 @@
1
1
  import _extends from "@babel/runtime/helpers/esm/extends";
2
+ const defaultSankeyValueFormatter = v => v == null ? '' : v.toLocaleString();
2
3
  export const getSeriesWithDefaultValues = (seriesData, seriesIndex, colors) => {
3
4
  const nodeMap = new Map();
4
5
  const nodeColor = seriesData.nodeOptions?.color;
@@ -39,6 +40,7 @@ export const getSeriesWithDefaultValues = (seriesData, seriesIndex, colors) => {
39
40
  return _extends({
40
41
  id: seriesData.id ?? `auto-generated-id-${seriesIndex}`
41
42
  }, seriesData, {
43
+ valueFormatter: seriesData.valueFormatter ?? defaultSankeyValueFormatter,
42
44
  data: {
43
45
  links: data.links,
44
46
  nodes: nodeMap
@@ -1,6 +1,7 @@
1
1
  export const tooltipGetter = params => {
2
2
  const {
3
- identifier
3
+ identifier,
4
+ series
4
5
  } = params;
5
6
  if (!identifier) {
6
7
  return null;
@@ -15,7 +16,11 @@ export const tooltipGetter = params => {
15
16
  color: node.color,
16
17
  label: `${node.label}:`,
17
18
  value: node.value,
18
- formattedValue: `${node.value}`,
19
+ formattedValue: series.valueFormatter(node.value, {
20
+ type: 'node',
21
+ nodeId: node.id,
22
+ location: 'tooltip'
23
+ }),
19
24
  markType: 'square'
20
25
  };
21
26
  }
@@ -31,7 +36,12 @@ export const tooltipGetter = params => {
31
36
  color: link.color,
32
37
  label: `${sourceLabel} → ${targetLabel}:`,
33
38
  value: link.value,
34
- formattedValue: `${link.value}`,
39
+ formattedValue: series.valueFormatter(link.value, {
40
+ type: 'link',
41
+ sourceId: link.source.id,
42
+ targetId: link.target.id,
43
+ location: 'tooltip'
44
+ }),
35
45
  markType: 'line'
36
46
  };
37
47
  }
@@ -2,7 +2,7 @@ import type { ChartsOverlayProps } from '@mui/x-charts/ChartsOverlay';
2
2
  import type { ChartsWrapperProps } from '@mui/x-charts/ChartsWrapper';
3
3
  import type { SankeyChartProps } from "./SankeyChart.js";
4
4
  import type { ChartContainerProProps } from "../ChartContainerPro/index.js";
5
- import { type SankeyChartPluginsSignatures } from "./SankeyChart.plugins.js";
5
+ import { type SankeyChartPluginSignatures } from "./SankeyChart.plugins.js";
6
6
  /**
7
7
  * A helper function that extracts SankeyChartProps from the input props
8
8
  * and returns an object with props for the children components of SankeyChart.
@@ -11,7 +11,7 @@ import { type SankeyChartPluginsSignatures } from "./SankeyChart.plugins.js";
11
11
  * @returns An object with props for the children components of SankeyChart
12
12
  */
13
13
  export declare const useSankeyChartProps: (props: SankeyChartProps) => {
14
- chartContainerProps: ChartContainerProProps<"sankey", SankeyChartPluginsSignatures>;
14
+ chartContainerProps: ChartContainerProProps<"sankey", SankeyChartPluginSignatures>;
15
15
  sankeyPlotProps: {
16
16
  onNodeClick: ((event: React.MouseEvent<SVGElement, MouseEvent>, node: import("./sankey.types.js").SankeyNodeIdentifierWithData) => void) | undefined;
17
17
  onLinkClick: ((event: React.MouseEvent<SVGElement, MouseEvent>, link: import("./sankey.types.js").SankeyLinkIdentifierWithData) => void) | undefined;
@@ -3,7 +3,7 @@ import { ScatterChartProps, ScatterChartSlotProps, ScatterChartSlots } from '@mu
3
3
  import { ChartsTooltipProps } from '@mui/x-charts/ChartsTooltip';
4
4
  import { ChartsSlotPropsPro, ChartsSlotsPro } from "../internals/material/index.js";
5
5
  import { ChartContainerProProps } from "../ChartContainerPro/ChartContainerPro.js";
6
- import { ScatterChartProPluginsSignatures } from "./ScatterChartPro.plugins.js";
6
+ import { ScatterChartProPluginSignatures } from "./ScatterChartPro.plugins.js";
7
7
  import { ChartsToolbarProSlots, ChartsToolbarProSlotProps } from "../ChartsToolbarPro/Toolbar.types.js";
8
8
  export interface ScatterChartProSlots extends Omit<ScatterChartSlots, 'toolbar'>, ChartsToolbarProSlots, Partial<ChartsSlotsPro> {}
9
9
  export interface ScatterChartProSlotProps extends Omit<ScatterChartSlotProps, 'toolbar' | 'tooltip'>, ChartsToolbarProSlotProps, Partial<ChartsSlotPropsPro> {
@@ -13,7 +13,7 @@ export interface ScatterChartProSlotProps extends Omit<ScatterChartSlotProps, 't
13
13
  */
14
14
  tooltip?: Partial<ChartsTooltipProps<'item' | 'none'>>;
15
15
  }
16
- export interface ScatterChartProProps extends Omit<ScatterChartProps, 'apiRef' | 'slots' | 'slotProps'>, Omit<ChartContainerProProps<'scatter', ScatterChartProPluginsSignatures>, 'series' | 'plugins' | 'seriesConfig' | 'onItemClick' | 'slots' | 'slotProps' | 'experimentalFeatures' | 'highlightedAxis' | 'onHighlightedAxisChange'> {
16
+ export interface ScatterChartProProps extends Omit<ScatterChartProps, 'apiRef' | 'slots' | 'slotProps'>, Omit<ChartContainerProProps<'scatter', ScatterChartProPluginSignatures>, 'series' | 'plugins' | 'seriesConfig' | 'onItemClick' | 'slots' | 'slotProps' | 'experimentalFeatures' | 'highlightedAxis' | 'onHighlightedAxisChange'> {
17
17
  /**
18
18
  * Overridable component slots.
19
19
  * @default {}
@@ -127,6 +127,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
127
127
  * @default false
128
128
  */
129
129
  disableVoronoi: PropTypes.bool,
130
+ enableKeyboardNavigation: PropTypes.bool,
130
131
  /**
131
132
  * Option to display a cartesian grid in the background.
132
133
  */
@@ -210,6 +211,15 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
210
211
  * @param {ZoomData[]} zoomData Updated zoom data.
211
212
  */
212
213
  onZoomChange: PropTypes.func,
214
+ /**
215
+ * The type of renderer to use for the scatter plot.
216
+ * - `svg-single`: Renders every scatter item in a `<circle />` element.
217
+ * - `svg-batch`: Batch renders scatter items in `<path />` elements for better performance with large datasets, at the cost of some limitations.
218
+ * Read more: https://mui.com/x/react-charts/scatter/#performance
219
+ *
220
+ * @default 'svg-single'
221
+ */
222
+ renderer: PropTypes.oneOf(['svg-batch', 'svg-single']),
213
223
  /**
214
224
  * The series to display in the scatter chart.
215
225
  * An array of [[ScatterSeries]] objects.
@@ -239,10 +249,11 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
239
249
  theme: PropTypes.oneOf(['dark', 'light']),
240
250
  title: PropTypes.string,
241
251
  /**
242
- * Defines the maximal distance between a scatter point and the pointer that triggers the interaction.
252
+ * Defines the maximum distance between a scatter point and the pointer that triggers the interaction.
253
+ * If set to `'item'`, the radius is the `markerSize`.
243
254
  * If `undefined`, the radius is assumed to be infinite.
244
255
  */
245
- voronoiMaxRadius: PropTypes.number,
256
+ voronoiMaxRadius: PropTypes.oneOfType([PropTypes.oneOf(['item']), PropTypes.number]),
246
257
  /**
247
258
  * The width of the chart in px. If not defined, it takes the width of the parent element.
248
259
  */
@@ -1,5 +1,5 @@
1
- import { UseChartZAxisSignature, UseChartCartesianAxisSignature, UseChartInteractionSignature, UseChartHighlightSignature, UseChartVoronoiSignature, ConvertSignaturesIntoPlugins } from '@mui/x-charts/internals';
1
+ import { UseChartZAxisSignature, UseChartCartesianAxisSignature, UseChartInteractionSignature, UseChartHighlightSignature, UseChartClosestPointSignature, UseChartKeyboardNavigationSignature, ConvertSignaturesIntoPlugins } from '@mui/x-charts/internals';
2
2
  import { UseChartProExportSignature } from "../internals/plugins/useChartProExport/index.js";
3
3
  import { UseChartProZoomSignature } from "../internals/plugins/useChartProZoom/index.js";
4
- export type ScatterChartProPluginsSignatures = [UseChartZAxisSignature, UseChartCartesianAxisSignature<'scatter'>, UseChartInteractionSignature, UseChartHighlightSignature, UseChartVoronoiSignature, UseChartProZoomSignature, UseChartProExportSignature];
5
- export declare const SCATTER_CHART_PRO_PLUGINS: ConvertSignaturesIntoPlugins<ScatterChartProPluginsSignatures>;
4
+ export type ScatterChartProPluginSignatures = [UseChartZAxisSignature, UseChartCartesianAxisSignature<'scatter'>, UseChartInteractionSignature, UseChartHighlightSignature, UseChartClosestPointSignature, UseChartKeyboardNavigationSignature, UseChartProZoomSignature, UseChartProExportSignature];
5
+ export declare const SCATTER_CHART_PRO_PLUGINS: ConvertSignaturesIntoPlugins<ScatterChartProPluginSignatures>;
@@ -1,4 +1,4 @@
1
- import { useChartZAxis, useChartCartesianAxis, useChartInteraction, useChartHighlight, useChartVoronoi } from '@mui/x-charts/internals';
1
+ import { useChartZAxis, useChartCartesianAxis, useChartInteraction, useChartHighlight, useChartClosestPoint, useChartKeyboardNavigation } from '@mui/x-charts/internals';
2
2
  import { useChartProExport } from "../internals/plugins/useChartProExport/index.js";
3
3
  import { useChartProZoom } from "../internals/plugins/useChartProZoom/index.js";
4
- export const SCATTER_CHART_PRO_PLUGINS = [useChartZAxis, useChartCartesianAxis, useChartInteraction, useChartHighlight, useChartVoronoi, useChartProZoom, useChartProExport];
4
+ export const SCATTER_CHART_PRO_PLUGINS = [useChartZAxis, useChartCartesianAxis, useChartInteraction, useChartHighlight, useChartClosestPoint, useChartKeyboardNavigation, useChartProZoom, useChartProExport];
@@ -1 +1,2 @@
1
- export * from "./ScatterChartPro.js";
1
+ export * from "./ScatterChartPro.js";
2
+ export * from "./ScatterChartPro.plugins.js";
@@ -1 +1,2 @@
1
- export * from "./ScatterChartPro.js";
1
+ export * from "./ScatterChartPro.js";
2
+ export * from "./ScatterChartPro.plugins.js";
@@ -1,20 +1,22 @@
1
1
  import { ChartAnyPluginSignature, ChartPublicAPI } from '@mui/x-charts/internals';
2
- import { HeatmapPluginsSignatures } from "../Heatmap/Heatmap.plugins.js";
3
- import { LineChartProPluginsSignatures } from "../LineChartPro/LineChartPro.plugins.js";
4
- import { ScatterChartProPluginsSignatures } from "../ScatterChartPro/ScatterChartPro.plugins.js";
5
- import { BarChartProPluginsSignatures } from "../BarChartPro/BarChartPro.plugins.js";
2
+ import { HeatmapPluginSignatures } from "../Heatmap/Heatmap.plugins.js";
3
+ import { LineChartProPluginSignatures } from "../LineChartPro/LineChartPro.plugins.js";
4
+ import { ScatterChartProPluginSignatures } from "../ScatterChartPro/ScatterChartPro.plugins.js";
5
+ import { BarChartProPluginSignatures } from "../BarChartPro/BarChartPro.plugins.js";
6
6
  import { AllPluginSignatures, DefaultPluginSignatures } from "../internals/plugins/allPlugins.js";
7
- import { FunnelChartPluginsSignatures } from "../FunnelChart/FunnelChart.plugins.js";
8
- import { RadarChartProPluginsSignatures } from "../RadarChartPro/RadarChartPro.plugins.js";
7
+ import { FunnelChartPluginSignatures } from "../FunnelChart/FunnelChart.plugins.js";
8
+ import { RadarChartProPluginSignatures } from "../RadarChartPro/RadarChartPro.plugins.js";
9
9
  import { PieChartProPluginSignatures } from "../PieChartPro/PieChartPro.plugins.js";
10
+ import { SankeyChartPluginSignatures } from "../SankeyChart/SankeyChart.plugins.js";
10
11
  export type ProPluginsPerSeriesType = {
11
- heatmap: HeatmapPluginsSignatures;
12
- line: LineChartProPluginsSignatures;
13
- scatter: ScatterChartProPluginsSignatures;
14
- bar: BarChartProPluginsSignatures;
15
- funnel: FunnelChartPluginsSignatures;
16
- radar: RadarChartProPluginsSignatures;
12
+ heatmap: HeatmapPluginSignatures;
13
+ line: LineChartProPluginSignatures;
14
+ scatter: ScatterChartProPluginSignatures;
15
+ bar: BarChartProPluginSignatures;
16
+ funnel: FunnelChartPluginSignatures;
17
+ radar: RadarChartProPluginSignatures;
17
18
  pie: PieChartProPluginSignatures;
19
+ sankey: SankeyChartPluginSignatures;
18
20
  composition: DefaultPluginSignatures;
19
21
  };
20
22
  /**
package/esm/index.d.ts CHANGED
@@ -26,6 +26,7 @@ export * from "./constants/index.js";
26
26
  export * from "./hooks/index.js";
27
27
  export * from "./context/index.js";
28
28
  export * from "./models/index.js";
29
+ export * from "./plugins/index.js";
29
30
  export * from "./colorPalettes/index.js";
30
31
  export * from "./Heatmap/index.js";
31
32
  export { ChartContainerPro } from "./ChartContainerPro/index.js";
package/esm/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @mui/x-charts-pro v8.11.3
2
+ * @mui/x-charts-pro v8.12.0
3
3
  *
4
4
  * @license SEE LICENSE IN LICENSE
5
5
  * This source code is licensed under the SEE LICENSE IN LICENSE license found in the
@@ -37,6 +37,7 @@ export * from "./constants/index.js";
37
37
  export * from "./hooks/index.js";
38
38
  export * from "./context/index.js";
39
39
  export * from "./models/index.js";
40
+ export * from "./plugins/index.js";
40
41
  // Locales should be imported from `@mui/x-charts-pro/locales`
41
42
  // export * from './locales';
42
43
  export * from "./colorPalettes/index.js";
@@ -1,4 +1,4 @@
1
- import { UseChartSeriesSignature, ChartPluginSignature, UseChartCartesianAxisSignature } from '@mui/x-charts/internals';
1
+ import { ChartPluginSignature } from '@mui/x-charts/internals';
2
2
  export interface UseChartProExportParameters {}
3
3
  export type UseChartProExportDefaultizedParameters = UseChartProExportParameters;
4
4
  export interface UseChartProExportState {
@@ -74,5 +74,4 @@ export type UseChartProExportSignature = ChartPluginSignature<{
74
74
  state: UseChartProExportState;
75
75
  publicAPI: UseChartProExportPublicApi;
76
76
  instance: UseChartProExportInstance;
77
- dependencies: [UseChartSeriesSignature, UseChartCartesianAxisSignature];
78
77
  }>;
@@ -0,0 +1,3 @@
1
+ export * from '@mui/x-charts/plugins';
2
+ export { useChartProExport, type UseChartProExportSignature } from "../internals/plugins/useChartProExport/index.js";
3
+ export { useChartProZoom, type UseChartProZoomSignature } from "../internals/plugins/useChartProZoom/index.js";
@@ -0,0 +1,3 @@
1
+ export * from '@mui/x-charts/plugins';
2
+ export { useChartProExport } from "../internals/plugins/useChartProExport/index.js";
3
+ export { useChartProZoom } from "../internals/plugins/useChartProZoom/index.js";
package/index.d.ts CHANGED
@@ -26,6 +26,7 @@ export * from "./constants/index.js";
26
26
  export * from "./hooks/index.js";
27
27
  export * from "./context/index.js";
28
28
  export * from "./models/index.js";
29
+ export * from "./plugins/index.js";
29
30
  export * from "./colorPalettes/index.js";
30
31
  export * from "./Heatmap/index.js";
31
32
  export { ChartContainerPro } from "./ChartContainerPro/index.js";
package/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @mui/x-charts-pro v8.11.3
2
+ * @mui/x-charts-pro v8.12.0
3
3
  *
4
4
  * @license SEE LICENSE IN LICENSE
5
5
  * This source code is licensed under the SEE LICENSE IN LICENSE license found in the
@@ -344,6 +344,18 @@ Object.keys(_models).forEach(function (key) {
344
344
  }
345
345
  });
346
346
  });
347
+ var _plugins = require("./plugins");
348
+ Object.keys(_plugins).forEach(function (key) {
349
+ if (key === "default" || key === "__esModule") return;
350
+ if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
351
+ if (key in exports && exports[key] === _plugins[key]) return;
352
+ Object.defineProperty(exports, key, {
353
+ enumerable: true,
354
+ get: function () {
355
+ return _plugins[key];
356
+ }
357
+ });
358
+ });
347
359
  var _colorPalettes = require("./colorPalettes");
348
360
  Object.keys(_colorPalettes).forEach(function (key) {
349
361
  if (key === "default" || key === "__esModule") return;
@@ -1,4 +1,4 @@
1
- import { UseChartSeriesSignature, ChartPluginSignature, UseChartCartesianAxisSignature } from '@mui/x-charts/internals';
1
+ import { ChartPluginSignature } from '@mui/x-charts/internals';
2
2
  export interface UseChartProExportParameters {}
3
3
  export type UseChartProExportDefaultizedParameters = UseChartProExportParameters;
4
4
  export interface UseChartProExportState {
@@ -74,5 +74,4 @@ export type UseChartProExportSignature = ChartPluginSignature<{
74
74
  state: UseChartProExportState;
75
75
  publicAPI: UseChartProExportPublicApi;
76
76
  instance: UseChartProExportInstance;
77
- dependencies: [UseChartSeriesSignature, UseChartCartesianAxisSignature];
78
77
  }>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mui/x-charts-pro",
3
- "version": "8.11.3",
3
+ "version": "8.12.0",
4
4
  "author": "MUI Team",
5
5
  "description": "The Pro plan edition of the MUI X Charts components.",
6
6
  "license": "SEE LICENSE IN LICENSE",
@@ -31,11 +31,11 @@
31
31
  "@mui/utils": "^7.3.2",
32
32
  "clsx": "^2.1.1",
33
33
  "prop-types": "^15.8.1",
34
- "@mui/x-charts": "8.11.3",
35
- "@mui/x-internal-gestures": "0.2.6",
36
- "@mui/x-charts-vendor": "8.11.3",
37
- "@mui/x-internals": "8.11.3",
38
- "@mui/x-license": "8.11.3"
34
+ "@mui/x-charts": "8.12.0",
35
+ "@mui/x-charts-vendor": "8.12.0",
36
+ "@mui/x-license": "8.12.0",
37
+ "@mui/x-internal-gestures": "0.3.0",
38
+ "@mui/x-internals": "8.12.0"
39
39
  },
40
40
  "peerDependencies": {
41
41
  "@emotion/react": "^11.9.0",
@@ -0,0 +1,3 @@
1
+ export * from '@mui/x-charts/plugins';
2
+ export { useChartProExport, type UseChartProExportSignature } from "../internals/plugins/useChartProExport/index.js";
3
+ export { useChartProZoom, type UseChartProZoomSignature } from "../internals/plugins/useChartProZoom/index.js";
@@ -0,0 +1,35 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ var _exportNames = {
7
+ useChartProExport: true,
8
+ useChartProZoom: true
9
+ };
10
+ Object.defineProperty(exports, "useChartProExport", {
11
+ enumerable: true,
12
+ get: function () {
13
+ return _useChartProExport.useChartProExport;
14
+ }
15
+ });
16
+ Object.defineProperty(exports, "useChartProZoom", {
17
+ enumerable: true,
18
+ get: function () {
19
+ return _useChartProZoom.useChartProZoom;
20
+ }
21
+ });
22
+ var _plugins = require("@mui/x-charts/plugins");
23
+ Object.keys(_plugins).forEach(function (key) {
24
+ if (key === "default" || key === "__esModule") return;
25
+ if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
26
+ if (key in exports && exports[key] === _plugins[key]) return;
27
+ Object.defineProperty(exports, key, {
28
+ enumerable: true,
29
+ get: function () {
30
+ return _plugins[key];
31
+ }
32
+ });
33
+ });
34
+ var _useChartProExport = require("../internals/plugins/useChartProExport");
35
+ var _useChartProZoom = require("../internals/plugins/useChartProZoom");