@mui/x-charts-pro 8.10.1 → 8.11.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 (120) hide show
  1. package/BarChartPro/BarChartPro.js +0 -36
  2. package/CHANGELOG.md +221 -8
  3. package/ChartDataProviderPro/ChartDataProviderPro.js +1 -1
  4. package/FunnelChart/curves/bump.js +0 -2
  5. package/FunnelChart/curves/linear.js +0 -2
  6. package/FunnelChart/curves/pyramid.js +0 -2
  7. package/FunnelChart/curves/step-pyramid.js +0 -2
  8. package/FunnelChart/curves/step.js +0 -2
  9. package/Heatmap/Heatmap.js +0 -4
  10. package/LineChartPro/LineChartPro.js +0 -36
  11. package/PieChartPro/PieChartPro.js +2 -2
  12. package/SankeyChart/SankeyChart.d.ts +32 -0
  13. package/SankeyChart/SankeyChart.js +161 -0
  14. package/SankeyChart/SankeyChart.plugins.d.ts +3 -0
  15. package/SankeyChart/SankeyChart.plugins.js +11 -0
  16. package/SankeyChart/SankeyLinkElement.d.ts +27 -0
  17. package/SankeyChart/SankeyLinkElement.js +53 -0
  18. package/SankeyChart/SankeyLinkLabel.d.ts +12 -0
  19. package/SankeyChart/SankeyLinkLabel.js +58 -0
  20. package/SankeyChart/SankeyNodeElement.d.ts +27 -0
  21. package/SankeyChart/SankeyNodeElement.js +76 -0
  22. package/SankeyChart/SankeyPlot.d.ts +29 -0
  23. package/SankeyChart/SankeyPlot.js +100 -0
  24. package/SankeyChart/SankeyTooltip/SankeyTooltip.classes.d.ts +2 -0
  25. package/SankeyChart/SankeyTooltip/SankeyTooltip.classes.js +27 -0
  26. package/SankeyChart/SankeyTooltip/SankeyTooltip.d.ts +7 -0
  27. package/SankeyChart/SankeyTooltip/SankeyTooltip.js +208 -0
  28. package/SankeyChart/SankeyTooltip/SankeyTooltip.types.d.ts +10 -0
  29. package/SankeyChart/SankeyTooltip/SankeyTooltip.types.js +5 -0
  30. package/SankeyChart/SankeyTooltip/SankeyTooltipContent.d.ts +7 -0
  31. package/SankeyChart/SankeyTooltip/SankeyTooltipContent.js +66 -0
  32. package/SankeyChart/SankeyTooltip/index.d.ts +3 -0
  33. package/SankeyChart/SankeyTooltip/index.js +27 -0
  34. package/SankeyChart/calculateSankeyLayout.d.ts +13 -0
  35. package/SankeyChart/calculateSankeyLayout.js +141 -0
  36. package/SankeyChart/index.d.ts +9 -0
  37. package/SankeyChart/index.js +70 -0
  38. package/SankeyChart/sankey.types.d.ts +225 -0
  39. package/SankeyChart/sankey.types.js +6 -0
  40. package/SankeyChart/sankeyClasses.d.ts +15 -0
  41. package/SankeyChart/sankeyClasses.js +28 -0
  42. package/SankeyChart/sankeySlots.types.d.ts +24 -0
  43. package/SankeyChart/sankeySlots.types.js +5 -0
  44. package/SankeyChart/seriesConfig/getSeriesWithDefaultValues.d.ts +2 -0
  45. package/SankeyChart/seriesConfig/getSeriesWithDefaultValues.js +55 -0
  46. package/SankeyChart/seriesConfig/index.d.ts +2 -0
  47. package/SankeyChart/seriesConfig/index.js +19 -0
  48. package/SankeyChart/seriesConfig/tooltipGetter.d.ts +2 -0
  49. package/SankeyChart/seriesConfig/tooltipGetter.js +46 -0
  50. package/SankeyChart/useSankeyChartProps.d.ts +22 -0
  51. package/SankeyChart/useSankeyChartProps.js +77 -0
  52. package/SankeyChart/utils.d.ts +3 -0
  53. package/SankeyChart/utils.js +21 -0
  54. package/ScatterChartPro/ScatterChartPro.js +1 -37
  55. package/esm/BarChartPro/BarChartPro.js +0 -36
  56. package/esm/ChartDataProviderPro/ChartDataProviderPro.js +1 -1
  57. package/esm/FunnelChart/curves/bump.js +0 -2
  58. package/esm/FunnelChart/curves/linear.js +0 -2
  59. package/esm/FunnelChart/curves/pyramid.js +0 -2
  60. package/esm/FunnelChart/curves/step-pyramid.js +0 -2
  61. package/esm/FunnelChart/curves/step.js +0 -2
  62. package/esm/Heatmap/Heatmap.js +0 -4
  63. package/esm/LineChartPro/LineChartPro.js +0 -36
  64. package/esm/PieChartPro/PieChartPro.js +2 -2
  65. package/esm/SankeyChart/SankeyChart.d.ts +32 -0
  66. package/esm/SankeyChart/SankeyChart.js +155 -0
  67. package/esm/SankeyChart/SankeyChart.plugins.d.ts +3 -0
  68. package/esm/SankeyChart/SankeyChart.plugins.js +9 -0
  69. package/esm/SankeyChart/SankeyLinkElement.d.ts +27 -0
  70. package/esm/SankeyChart/SankeyLinkElement.js +46 -0
  71. package/esm/SankeyChart/SankeyLinkLabel.d.ts +12 -0
  72. package/esm/SankeyChart/SankeyLinkLabel.js +52 -0
  73. package/esm/SankeyChart/SankeyNodeElement.d.ts +27 -0
  74. package/esm/SankeyChart/SankeyNodeElement.js +69 -0
  75. package/esm/SankeyChart/SankeyPlot.d.ts +29 -0
  76. package/esm/SankeyChart/SankeyPlot.js +94 -0
  77. package/esm/SankeyChart/SankeyTooltip/SankeyTooltip.classes.d.ts +2 -0
  78. package/esm/SankeyChart/SankeyTooltip/SankeyTooltip.classes.js +19 -0
  79. package/esm/SankeyChart/SankeyTooltip/SankeyTooltip.d.ts +7 -0
  80. package/esm/SankeyChart/SankeyTooltip/SankeyTooltip.js +202 -0
  81. package/esm/SankeyChart/SankeyTooltip/SankeyTooltip.types.d.ts +10 -0
  82. package/esm/SankeyChart/SankeyTooltip/SankeyTooltip.types.js +1 -0
  83. package/esm/SankeyChart/SankeyTooltip/SankeyTooltipContent.d.ts +7 -0
  84. package/esm/SankeyChart/SankeyTooltip/SankeyTooltipContent.js +59 -0
  85. package/esm/SankeyChart/SankeyTooltip/index.d.ts +3 -0
  86. package/esm/SankeyChart/SankeyTooltip/index.js +3 -0
  87. package/esm/SankeyChart/calculateSankeyLayout.d.ts +13 -0
  88. package/esm/SankeyChart/calculateSankeyLayout.js +135 -0
  89. package/esm/SankeyChart/index.d.ts +9 -0
  90. package/esm/SankeyChart/index.js +6 -0
  91. package/esm/SankeyChart/sankey.types.d.ts +225 -0
  92. package/esm/SankeyChart/sankey.types.js +3 -0
  93. package/esm/SankeyChart/sankeyClasses.d.ts +15 -0
  94. package/esm/SankeyChart/sankeyClasses.js +19 -0
  95. package/esm/SankeyChart/sankeySlots.types.d.ts +24 -0
  96. package/esm/SankeyChart/sankeySlots.types.js +1 -0
  97. package/esm/SankeyChart/seriesConfig/getSeriesWithDefaultValues.d.ts +2 -0
  98. package/esm/SankeyChart/seriesConfig/getSeriesWithDefaultValues.js +47 -0
  99. package/esm/SankeyChart/seriesConfig/index.d.ts +2 -0
  100. package/esm/SankeyChart/seriesConfig/index.js +14 -0
  101. package/esm/SankeyChart/seriesConfig/tooltipGetter.d.ts +2 -0
  102. package/esm/SankeyChart/seriesConfig/tooltipGetter.js +39 -0
  103. package/esm/SankeyChart/useSankeyChartProps.d.ts +22 -0
  104. package/esm/SankeyChart/useSankeyChartProps.js +70 -0
  105. package/esm/SankeyChart/utils.d.ts +3 -0
  106. package/esm/SankeyChart/utils.js +14 -0
  107. package/esm/ScatterChartPro/ScatterChartPro.js +1 -37
  108. package/esm/hooks/useSankeySeries.d.ts +33 -0
  109. package/esm/hooks/useSankeySeries.js +42 -0
  110. package/esm/index.d.ts +1 -0
  111. package/esm/index.js +2 -1
  112. package/esm/internals/plugins/allPlugins.d.ts +2 -2
  113. package/esm/typeOverloads/modules.d.ts +11 -0
  114. package/hooks/useSankeySeries.d.ts +33 -0
  115. package/hooks/useSankeySeries.js +48 -0
  116. package/index.d.ts +1 -0
  117. package/index.js +13 -1
  118. package/internals/plugins/allPlugins.d.ts +2 -2
  119. package/package.json +6 -6
  120. package/typeOverloads/modules.d.ts +11 -0
@@ -0,0 +1,202 @@
1
+ 'use client';
2
+
3
+ import _extends from "@babel/runtime/helpers/esm/extends";
4
+ import * as React from 'react';
5
+ import PropTypes from 'prop-types';
6
+ import { ChartsTooltipContainer } from '@mui/x-charts/ChartsTooltip';
7
+ import { SankeyTooltipContent } from "./SankeyTooltipContent.js";
8
+ import { useUtilityClasses } from "./SankeyTooltip.classes.js";
9
+ import { jsx as _jsx } from "react/jsx-runtime";
10
+ function SankeyTooltip(props) {
11
+ const classes = useUtilityClasses(props);
12
+ return /*#__PURE__*/_jsx(ChartsTooltipContainer, _extends({
13
+ trigger: "item"
14
+ }, props, {
15
+ classes: classes,
16
+ children: /*#__PURE__*/_jsx(SankeyTooltipContent, {
17
+ classes: classes
18
+ })
19
+ }));
20
+ }
21
+ process.env.NODE_ENV !== "production" ? SankeyTooltip.propTypes = {
22
+ // ----------------------------- Warning --------------------------------
23
+ // | These PropTypes are generated from the TypeScript type definitions |
24
+ // | To update them edit the TypeScript types and run "pnpm proptypes" |
25
+ // ----------------------------------------------------------------------
26
+ /**
27
+ * An HTML element, [virtualElement](https://popper.js.org/docs/v2/virtual-elements/),
28
+ * or a function that returns either.
29
+ * It's used to set the position of the popper.
30
+ * The return value will passed as the reference object of the Popper instance.
31
+ */
32
+ anchorEl: PropTypes.oneOfType([(props, propName) => {
33
+ if (props[propName] == null) {
34
+ return new Error(`Prop '${propName}' is required but wasn't specified`);
35
+ }
36
+ if (typeof props[propName] !== 'object' || props[propName].nodeType !== 1) {
37
+ return new Error(`Expected prop '${propName}' to be of type Element`);
38
+ }
39
+ return null;
40
+ }, PropTypes.func, PropTypes.shape({
41
+ contextElement: (props, propName) => {
42
+ if (props[propName] == null) {
43
+ return null;
44
+ }
45
+ if (typeof props[propName] !== 'object' || props[propName].nodeType !== 1) {
46
+ return new Error(`Expected prop '${propName}' to be of type Element`);
47
+ }
48
+ return null;
49
+ },
50
+ getBoundingClientRect: PropTypes.func.isRequired
51
+ })]),
52
+ /**
53
+ * Override or extend the styles applied to the component.
54
+ */
55
+ classes: PropTypes.object,
56
+ /**
57
+ * The component used for the root node.
58
+ * Either a string to use a HTML element or a component.
59
+ */
60
+ component: PropTypes.elementType,
61
+ /**
62
+ * The components used for each slot inside the Popper.
63
+ * Either a string to use a HTML element or a component.
64
+ *
65
+ * @deprecated use the `slots` prop instead. This prop will be removed in a future major release. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
66
+ * @default {}
67
+ */
68
+ components: PropTypes.shape({
69
+ Root: PropTypes.elementType
70
+ }),
71
+ /**
72
+ * The props used for each slot inside the Popper.
73
+ *
74
+ * @deprecated use the `slotProps` prop instead. This prop will be removed in a future major release. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).
75
+ * @default {}
76
+ */
77
+ componentsProps: PropTypes.shape({
78
+ root: PropTypes.oneOfType([PropTypes.func, PropTypes.object])
79
+ }),
80
+ /**
81
+ * An HTML element or function that returns one.
82
+ * The `container` will have the portal children appended to it.
83
+ *
84
+ * You can also provide a callback, which is called in a React layout effect.
85
+ * This lets you set the container from a ref, and also makes server-side rendering possible.
86
+ *
87
+ * By default, it uses the body of the top-level document object,
88
+ * so it's simply `document.body` most of the time.
89
+ */
90
+ container: PropTypes.oneOfType([(props, propName) => {
91
+ if (props[propName] == null) {
92
+ return new Error(`Prop '${propName}' is required but wasn't specified`);
93
+ }
94
+ if (typeof props[propName] !== 'object' || props[propName].nodeType !== 1) {
95
+ return new Error(`Expected prop '${propName}' to be of type Element`);
96
+ }
97
+ return null;
98
+ }, PropTypes.func]),
99
+ /**
100
+ * The `children` will be under the DOM hierarchy of the parent component.
101
+ * @default false
102
+ */
103
+ disablePortal: PropTypes.bool,
104
+ /**
105
+ * Always keep the children in the DOM.
106
+ * This prop can be useful in SEO situation or
107
+ * when you want to maximize the responsiveness of the Popper.
108
+ * @default false
109
+ */
110
+ keepMounted: PropTypes.bool,
111
+ /**
112
+ * Popper.js is based on a "plugin-like" architecture,
113
+ * most of its features are fully encapsulated "modifiers".
114
+ *
115
+ * A modifier is a function that is called each time Popper.js needs to
116
+ * compute the position of the popper.
117
+ * For this reason, modifiers should be very performant to avoid bottlenecks.
118
+ * To learn how to create a modifier, [read the modifiers documentation](https://popper.js.org/docs/v2/modifiers/).
119
+ */
120
+ modifiers: PropTypes.arrayOf(PropTypes.shape({
121
+ data: PropTypes.object,
122
+ effect: PropTypes.func,
123
+ enabled: PropTypes.bool,
124
+ fn: PropTypes.func,
125
+ name: PropTypes.any,
126
+ options: PropTypes.object,
127
+ phase: PropTypes.oneOf(['afterMain', 'afterRead', 'afterWrite', 'beforeMain', 'beforeRead', 'beforeWrite', 'main', 'read', 'write']),
128
+ requires: PropTypes.arrayOf(PropTypes.string),
129
+ requiresIfExists: PropTypes.arrayOf(PropTypes.string)
130
+ })),
131
+ /**
132
+ * If `true`, the component is shown.
133
+ */
134
+ open: PropTypes.bool,
135
+ /**
136
+ * Popper placement.
137
+ * @default 'bottom'
138
+ */
139
+ placement: PropTypes.oneOf(['auto-end', 'auto-start', 'auto', 'bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top']),
140
+ /**
141
+ * Options provided to the [`Popper.js`](https://popper.js.org/docs/v2/constructors/#options) instance.
142
+ * @default {}
143
+ */
144
+ popperOptions: PropTypes.shape({
145
+ modifiers: PropTypes.array,
146
+ onFirstUpdate: PropTypes.func,
147
+ placement: PropTypes.oneOf(['auto-end', 'auto-start', 'auto', 'bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top']),
148
+ strategy: PropTypes.oneOf(['absolute', 'fixed'])
149
+ }),
150
+ /**
151
+ * A ref that points to the used popper instance.
152
+ */
153
+ popperRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({
154
+ current: PropTypes.shape({
155
+ destroy: PropTypes.func.isRequired,
156
+ forceUpdate: PropTypes.func.isRequired,
157
+ setOptions: PropTypes.func.isRequired,
158
+ state: PropTypes.shape({
159
+ attributes: PropTypes.object.isRequired,
160
+ elements: PropTypes.object.isRequired,
161
+ modifiersData: PropTypes.object.isRequired,
162
+ options: PropTypes.object.isRequired,
163
+ orderedModifiers: PropTypes.arrayOf(PropTypes.object).isRequired,
164
+ placement: PropTypes.oneOf(['auto-end', 'auto-start', 'auto', 'bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top']).isRequired,
165
+ rects: PropTypes.object.isRequired,
166
+ reset: PropTypes.bool.isRequired,
167
+ scrollParents: PropTypes.object.isRequired,
168
+ strategy: PropTypes.oneOf(['absolute', 'fixed']).isRequired,
169
+ styles: PropTypes.object.isRequired
170
+ }).isRequired,
171
+ update: PropTypes.func.isRequired
172
+ })
173
+ })]),
174
+ /**
175
+ * The props used for each slot inside the Popper.
176
+ * @default {}
177
+ */
178
+ slotProps: PropTypes.object,
179
+ /**
180
+ * The components used for each slot inside the Popper.
181
+ * Either a string to use a HTML element or a component.
182
+ * @default {}
183
+ */
184
+ slots: PropTypes.object,
185
+ /**
186
+ * The system prop that allows defining system overrides as well as additional CSS styles.
187
+ */
188
+ sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
189
+ /**
190
+ * Help supporting a react-transition-group/Transition component.
191
+ * @default false
192
+ */
193
+ transition: PropTypes.bool,
194
+ /**
195
+ * Select the kind of tooltip to display
196
+ * - 'item': Shows data about the item below the mouse.
197
+ * - 'none': Does not display tooltip
198
+ * @default 'item'
199
+ */
200
+ trigger: PropTypes.oneOf(['item', 'none'])
201
+ } : void 0;
202
+ export { SankeyTooltip };
@@ -0,0 +1,10 @@
1
+ import { ChartsTooltipContainerProps } from '@mui/x-charts/ChartsTooltip';
2
+ export interface SankeyTooltipProps extends Omit<ChartsTooltipContainerProps, 'trigger' | 'children'> {
3
+ /**
4
+ * Select the kind of tooltip to display
5
+ * - 'item': Shows data about the item below the mouse.
6
+ * - 'none': Does not display tooltip
7
+ * @default 'item'
8
+ */
9
+ trigger?: 'item' | 'none';
10
+ }
@@ -0,0 +1,7 @@
1
+ import * as React from 'react';
2
+ import { SankeyTooltipProps } from "./SankeyTooltip.types.js";
3
+ export interface SankeyTooltipContentProps extends Pick<SankeyTooltipProps, 'classes'> {}
4
+ export declare function SankeyTooltipContent(props: SankeyTooltipContentProps): React.JSX.Element | null;
5
+ export declare namespace SankeyTooltipContent {
6
+ var propTypes: any;
7
+ }
@@ -0,0 +1,59 @@
1
+ 'use client';
2
+
3
+ import * as React from 'react';
4
+ import PropTypes from 'prop-types';
5
+ import clsx from 'clsx';
6
+ import { ChartsTooltipPaper, ChartsTooltipTable, ChartsTooltipRow, ChartsTooltipCell, useItemTooltip } from '@mui/x-charts/ChartsTooltip';
7
+ import { ChartsLabelMark } from '@mui/x-charts/internals';
8
+ import { useUtilityClasses } from "./SankeyTooltip.classes.js";
9
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
10
+ export function SankeyTooltipContent(props) {
11
+ const classes = useUtilityClasses(props);
12
+ const tooltipData = useItemTooltip();
13
+ if (!tooltipData) {
14
+ return null;
15
+ }
16
+ const {
17
+ color,
18
+ formattedValue,
19
+ markType,
20
+ label
21
+ } = tooltipData;
22
+ return /*#__PURE__*/_jsx(ChartsTooltipPaper, {
23
+ className: classes.paper,
24
+ children: /*#__PURE__*/_jsx(ChartsTooltipTable, {
25
+ className: classes.table,
26
+ children: /*#__PURE__*/_jsx("tbody", {
27
+ children: /*#__PURE__*/_jsxs(ChartsTooltipRow, {
28
+ className: classes.row,
29
+ children: [/*#__PURE__*/_jsxs(ChartsTooltipCell, {
30
+ className: clsx(classes.cell),
31
+ component: "th",
32
+ children: [/*#__PURE__*/_jsx("div", {
33
+ className: classes.markContainer,
34
+ children: /*#__PURE__*/_jsx(ChartsLabelMark, {
35
+ type: markType,
36
+ color: color,
37
+ className: classes.mark
38
+ })
39
+ }), label]
40
+ }), /*#__PURE__*/_jsx(ChartsTooltipCell, {
41
+ className: clsx(classes.valueCell, classes.cell),
42
+ component: "td",
43
+ children: formattedValue
44
+ })]
45
+ })
46
+ })
47
+ })
48
+ });
49
+ }
50
+ process.env.NODE_ENV !== "production" ? SankeyTooltipContent.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
+ /**
56
+ * Override or extend the styles applied to the component.
57
+ */
58
+ classes: PropTypes.object
59
+ } : void 0;
@@ -0,0 +1,3 @@
1
+ export * from "./SankeyTooltip.js";
2
+ export * from "./SankeyTooltipContent.js";
3
+ export type { SankeyTooltipProps } from "./SankeyTooltip.types.js";
@@ -0,0 +1,3 @@
1
+ export * from "./SankeyTooltip.js";
2
+ export * from "./SankeyTooltipContent.js";
3
+ export {};
@@ -0,0 +1,13 @@
1
+ import type { ChartDrawingArea } from '@mui/x-charts/hooks';
2
+ import type { Theme } from '@mui/material/styles';
3
+ import type { SankeySeriesType, SankeyLayout, SankeyLayoutLink, DefaultizedSankeySeriesType } from "./sankey.types.js";
4
+ /**
5
+ * Calculates the layout for a Sankey diagram using d3-sankey
6
+ *
7
+ * @param data The Sankey data (nodes and links)
8
+ * @param drawingArea The drawing area dimensions
9
+ * @param options Layout configuration options
10
+ * @returns The calculated layout
11
+ */
12
+ export declare function calculateSankeyLayout(data: DefaultizedSankeySeriesType['data'], drawingArea: ChartDrawingArea, theme: Theme, series?: Pick<SankeySeriesType, 'nodeOptions' | 'linkOptions' | 'iterations'>): SankeyLayout;
13
+ export declare function improvedNaiveSankeyLinkPathHorizontal(link: SankeyLayoutLink, curveCorrection?: number): string;
@@ -0,0 +1,135 @@
1
+ 'use client';
2
+
3
+ import _extends from "@babel/runtime/helpers/esm/extends";
4
+ import { sankey } from '@mui/x-charts-vendor/d3-sankey';
5
+ import { path } from '@mui/x-charts-vendor/d3-path';
6
+ import { getNodeAlignFunction } from "./utils.js";
7
+
8
+ /**
9
+ * Calculates the layout for a Sankey diagram using d3-sankey
10
+ *
11
+ * @param data The Sankey data (nodes and links)
12
+ * @param drawingArea The drawing area dimensions
13
+ * @param options Layout configuration options
14
+ * @returns The calculated layout
15
+ */
16
+
17
+ export function calculateSankeyLayout(data, drawingArea, theme, series = {}) {
18
+ const {
19
+ iterations = 6,
20
+ nodeOptions,
21
+ linkOptions
22
+ } = series;
23
+ const {
24
+ width: nodeWidth = 15,
25
+ padding: nodePadding = 10,
26
+ align: nodeAlign = 'justify',
27
+ sort: nodeSort = null
28
+ } = nodeOptions ?? {};
29
+ const {
30
+ color: linkColor = (theme.vars || theme).palette.text.primary,
31
+ sort: linkSort = null,
32
+ curveCorrection = 10
33
+ } = linkOptions ?? {};
34
+ const {
35
+ width,
36
+ height,
37
+ left,
38
+ top,
39
+ bottom,
40
+ right
41
+ } = drawingArea;
42
+ if (!data || !data.links) {
43
+ return {
44
+ nodes: [],
45
+ links: []
46
+ };
47
+ }
48
+
49
+ // Prepare the data structure expected by d3-sankey
50
+ const graph = {
51
+ nodes: data.nodes.values().toArray().map(v => _extends({}, v)),
52
+ links: data.links.map(v => _extends({}, v))
53
+ };
54
+
55
+ // Create the sankey layout generator
56
+ let sankeyGenerator = sankey().nodeWidth(nodeWidth).nodePadding(nodePadding).nodeAlign(getNodeAlignFunction(nodeAlign)).extent([[left, top], [width + right, height + bottom]]).nodeId(d => d.id).iterations(iterations);
57
+ if (nodeSort) {
58
+ sankeyGenerator = sankeyGenerator.nodeSort(nodeSort);
59
+ }
60
+ if (linkSort) {
61
+ sankeyGenerator = sankeyGenerator.linkSort(linkSort);
62
+ }
63
+
64
+ // Generate the layout
65
+ let result;
66
+ try {
67
+ result = sankeyGenerator(graph);
68
+ } catch (error) {
69
+ // There are two errors that can occur:
70
+ // 1. If the data contains circular references, d3-sankey will throw an error.
71
+ // 2. If there are missing source/target nodes, d3-sankey will throw an error.
72
+ // We handle the second case by building a map of nodes ourselves, so they are always present.
73
+ if (error instanceof Error && error.message === 'circular link') {
74
+ throw new Error('MUI X Charts: Sankey diagram contains circular references.');
75
+ }
76
+ throw error;
77
+ }
78
+ const {
79
+ nodes,
80
+ links
81
+ } = result;
82
+
83
+ // Convert d3-sankey links to our format
84
+ const layoutLinks = links.map(link => {
85
+ // Get the original link data
86
+ const originalLink = data.links.find(l => {
87
+ return l.source === link.source.id && l.target === link.target.id;
88
+ });
89
+ return _extends({}, originalLink, link, {
90
+ color: originalLink?.color ?? linkColor,
91
+ path: improvedNaiveSankeyLinkPathHorizontal(link, curveCorrection)
92
+ });
93
+ });
94
+ const layoutNodes = nodes.map(node => {
95
+ const originalNode = data.nodes.get(node.id) || {};
96
+ return _extends({}, originalNode, node);
97
+ });
98
+ return {
99
+ nodes: layoutNodes,
100
+ links: layoutLinks
101
+ };
102
+ }
103
+ export function improvedNaiveSankeyLinkPathHorizontal(link, curveCorrection) {
104
+ const sx = link.source.x1;
105
+ const tx = link.target.x0;
106
+ // Weirdly this seems to work for any chart or node width change
107
+ // But needs to be changed when the sankey height changes.
108
+ const correction = curveCorrection ?? 5;
109
+ const y0 = link.y0;
110
+ const y1 = link.y1;
111
+ const w = link.width;
112
+ const halfW = w / 2;
113
+ const sy0 = y0 - halfW;
114
+ const sy1 = y0 + halfW;
115
+ const ty0 = y1 - halfW;
116
+ const ty1 = y1 + halfW;
117
+ const halfX = (tx - sx) / 2;
118
+ const p = path();
119
+ p.moveTo(sx, sy0);
120
+ const isDecreasing = y0 > y1;
121
+ const direction = isDecreasing ? -1 : 1;
122
+ let cpx1 = sx + halfX + correction * direction;
123
+ let cpy1 = sy0;
124
+ let cpx2 = sx + halfX + correction * direction;
125
+ let cpy2 = ty0;
126
+ p.bezierCurveTo(cpx1, cpy1, cpx2, cpy2, tx, ty0);
127
+ p.lineTo(tx, ty1);
128
+ cpx1 = sx + halfX - correction * direction;
129
+ cpy1 = ty1;
130
+ cpx2 = sx + halfX - correction * direction;
131
+ cpy2 = sy1;
132
+ p.bezierCurveTo(cpx1, cpy1, cpx2, cpy2, sx, sy1);
133
+ p.lineTo(sx, sy0);
134
+ return p.toString();
135
+ }
@@ -0,0 +1,9 @@
1
+ export { SankeyChart as Unstable_SankeyChart } from "./SankeyChart.js";
2
+ export type { SankeyChartProps, SankeySeries } from "./SankeyChart.js";
3
+ export { SankeyPlot } from "./SankeyPlot.js";
4
+ export type { SankeyPlotProps } from "./SankeyPlot.js";
5
+ export * from "./sankey.types.js";
6
+ export * from "./sankeySlots.types.js";
7
+ export { type SankeyPlotClasses, sankeyPlotClasses } from "./sankeyClasses.js";
8
+ export { SankeyTooltip, SankeyTooltipContent } from "./SankeyTooltip/index.js";
9
+ export type { SankeyTooltipProps } from "./SankeyTooltip/index.js";
@@ -0,0 +1,6 @@
1
+ export { SankeyChart as Unstable_SankeyChart } from "./SankeyChart.js";
2
+ export { SankeyPlot } from "./SankeyPlot.js";
3
+ export * from "./sankey.types.js";
4
+ export * from "./sankeySlots.types.js";
5
+ export { sankeyPlotClasses } from "./sankeyClasses.js";
6
+ export { SankeyTooltip, SankeyTooltipContent } from "./SankeyTooltip/index.js";
@@ -0,0 +1,225 @@
1
+ import type { HighlightScope, SeriesId } from '@mui/x-charts/internals';
2
+ import type { DefaultizedProps, MakeRequired } from '@mui/x-internals/types';
3
+ import type { SankeyLink as D3SankeyLink, SankeyNode as D3SankeyNode } from '@mui/x-charts-vendor/d3-sankey';
4
+ export type SankeyNodeId = string | number;
5
+ export interface SankeyNode {
6
+ /**
7
+ * Unique identifier for the node
8
+ */
9
+ id: SankeyNodeId;
10
+ /**
11
+ * The node label to display
12
+ */
13
+ label?: string;
14
+ /**
15
+ * Optional custom data for the node
16
+ */
17
+ data?: any;
18
+ /**
19
+ * Optional color override for the node
20
+ */
21
+ color?: string;
22
+ }
23
+ export interface SankeyLink {
24
+ /**
25
+ * Source node ID
26
+ */
27
+ source: SankeyNodeId;
28
+ /**
29
+ * Target node ID
30
+ */
31
+ target: SankeyNodeId;
32
+ /**
33
+ * The value/weight of the link (affects width)
34
+ */
35
+ value: number;
36
+ /**
37
+ * Optional custom data for the link
38
+ */
39
+ data?: any;
40
+ /**
41
+ * Optional color override for the link
42
+ */
43
+ color?: string;
44
+ }
45
+ export type SankeyNodeOptions = {
46
+ /**
47
+ * Default color for nodes without specified colors
48
+ */
49
+ color?: string;
50
+ /**
51
+ * Width of the nodes in pixels
52
+ */
53
+ width?: number;
54
+ /**
55
+ * Padding between nodes in pixels
56
+ */
57
+ padding?: number;
58
+ /**
59
+ * Node alignment strategy
60
+ * - 'justify': Nodes are evenly distributed across the width.
61
+ * - 'left': Nodes are aligned to the left.
62
+ * - 'right': Nodes are aligned to the right.
63
+ * - 'center': Nodes are centered.
64
+ * @default 'justify'
65
+ */
66
+ align?: 'justify' | 'left' | 'right' | 'center';
67
+ /**
68
+ * Whether to show node labels
69
+ */
70
+ showLabels?: boolean;
71
+ /**
72
+ * Custom sort function for nodes
73
+ * @param {SankeyLayoutNode} a - First node to compare
74
+ * @param {SankeyLayoutNode} b - Second node to compare
75
+ * @returns {number} Comparison result
76
+ */
77
+ sort?: (a: SankeyLayoutNode, b: SankeyLayoutNode) => number | null;
78
+ };
79
+ export type SankeyLinkOptions = {
80
+ /**
81
+ * Default color for links without specified colors
82
+ */
83
+ color?: string;
84
+ /**
85
+ * Opacity of the links (0-1)
86
+ */
87
+ opacity?: number;
88
+ /**
89
+ * Whether to show link values
90
+ */
91
+ showValues?: boolean;
92
+ /**
93
+ * Custom sort function for links
94
+ * @param {SankeyLayoutLink} a - First link to compare
95
+ * @param {SankeyLayoutLink} b - Second link to compare
96
+ * @returns {number} Comparison result
97
+ */
98
+ sort?: (a: SankeyLayoutLink, b: SankeyLayoutLink) => number | null;
99
+ /**
100
+ * Applies the given number to the X dimension of the control points of the link's curve function.
101
+ * This can create better looking links between nodes, but is dependent on the graph layout.
102
+ * It is specially impacted by the chart height.
103
+ * @default 10
104
+ */
105
+ curveCorrection?: number;
106
+ };
107
+ export interface SankeyData {
108
+ /**
109
+ * An array of node configs for the Sankey diagram
110
+ *
111
+ * This is optional, but can be used to provide custom labels or styles for nodes.
112
+ */
113
+ nodes?: readonly SankeyNode[];
114
+ /**
115
+ * Array of links between nodes.
116
+ *
117
+ * The node ids will be used as the labels. If you want to provide custom labels, use the `nodes` property.
118
+ *
119
+ * Each link should have a `source`, `target`, and `value` property.
120
+ */
121
+ links: readonly SankeyLink[];
122
+ }
123
+ export interface SankeySeriesType {
124
+ /**
125
+ * Unique identifier for the series
126
+ */
127
+ id?: SeriesId;
128
+ /**
129
+ * Type identifier for Sankey series
130
+ */
131
+ type: 'sankey';
132
+ /**
133
+ * The data for the Sankey diagram
134
+ */
135
+ data: SankeyData;
136
+ /**
137
+ * Optional configuration for the nodes style, layout, and behavior
138
+ */
139
+ nodeOptions?: SankeyNodeOptions;
140
+ /**
141
+ * Optional configuration for the links style, layout, and behavior
142
+ */
143
+ linkOptions?: SankeyLinkOptions;
144
+ /**
145
+ * Number of iterations for the layout algorithm
146
+ * @default 6
147
+ */
148
+ iterations?: number;
149
+ }
150
+ /**
151
+ * Represents the calculated positions and dimensions for a node in the Sankey diagram
152
+ */
153
+ export interface SankeyLayoutNode extends D3SankeyNode<MakeRequired<SankeyNode, 'label' | 'color'>, SankeyLayoutLink> {
154
+ targetLinks: SankeyLayoutLink[];
155
+ sourceLinks: SankeyLayoutLink[];
156
+ value: number;
157
+ }
158
+ /**
159
+ * Represents the calculated positions and paths for a link in the Sankey diagram
160
+ */
161
+ export interface SankeyLayoutLink extends D3SankeyLink<SankeyLayoutNode, Omit<MakeRequired<SankeyLink, 'color'>, 'source' | 'target'>> {
162
+ path?: string | null;
163
+ source: SankeyLayoutNode;
164
+ target: SankeyLayoutNode;
165
+ }
166
+ /**
167
+ * Calculated layout for the Sankey diagram
168
+ */
169
+ export interface SankeyLayout {
170
+ nodes: readonly SankeyLayoutNode[];
171
+ links: readonly SankeyLayoutLink[];
172
+ }
173
+ export interface DefaultizedSankeySeriesType extends DefaultizedProps<Omit<SankeySeriesType, 'data'>, 'id'> {
174
+ data: {
175
+ nodes: Map<SankeyNodeId, SankeyNode>;
176
+ links: readonly SankeyLink[];
177
+ };
178
+ highlightScope?: HighlightScope;
179
+ }
180
+ type SankeyNodeIdentifierBase = {
181
+ type: 'sankey';
182
+ /**
183
+ * Unique identifier for the series
184
+ */
185
+ seriesId: SeriesId;
186
+ };
187
+ export type SankeyNodeIdentifier = SankeyNodeIdentifierBase & {
188
+ /**
189
+ * Subtype to differentiate between node and link
190
+ */
191
+ subType: 'node';
192
+ /**
193
+ * The id of the node
194
+ */
195
+ nodeId: SankeyNodeId;
196
+ };
197
+ export type SankeyNodeIdentifierWithData = SankeyNodeIdentifier & {
198
+ /**
199
+ * The node object with all the calculated properties
200
+ */
201
+ node: SankeyLayoutNode;
202
+ };
203
+ export type SankeyLinkIdentifier = SankeyNodeIdentifierBase & {
204
+ /**
205
+ * Subtype to differentiate between node and link
206
+ */
207
+ subType: 'link';
208
+ /**
209
+ * The id of the source node
210
+ */
211
+ sourceId: SankeyNodeId;
212
+ /**
213
+ * The id of the target node
214
+ */
215
+ targetId: SankeyNodeId;
216
+ };
217
+ export type SankeyLinkIdentifierWithData = SankeyLinkIdentifier & {
218
+ /**
219
+ * The link object with all the calculated properties
220
+ */
221
+ link: SankeyLayoutLink;
222
+ };
223
+ export type SankeyItemIdentifier = SankeyNodeIdentifier | SankeyLinkIdentifier;
224
+ export type SankeyItemIdentifierWithData = SankeyNodeIdentifierWithData | SankeyLinkIdentifierWithData;
225
+ export {};
@@ -0,0 +1,3 @@
1
+ 'use client';
2
+
3
+ export {};