@mui/x-charts-pro 8.0.0-beta.1 → 8.0.0-beta.3
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.
- package/BarChartPro/BarChartPro.js +2 -0
- package/CHANGELOG.md +235 -0
- package/Heatmap/Heatmap.d.ts +1 -1
- package/Heatmap/Heatmap.js +9 -7
- package/Heatmap/{HeatmapTooltip.js → HeatmapTooltip/HeatmapTooltip.js} +30 -34
- package/Heatmap/HeatmapTooltip/HeatmapTooltipAxesValue.d.ts +4 -0
- package/Heatmap/HeatmapTooltip/HeatmapTooltipAxesValue.js +26 -0
- package/Heatmap/HeatmapTooltip/index.d.ts +1 -0
- package/Heatmap/HeatmapTooltip/index.js +16 -0
- package/Heatmap/index.d.ts +1 -1
- package/LineChartPro/LineChartPro.js +2 -0
- package/ScatterChartPro/ScatterChartPro.js +2 -0
- package/esm/BarChartPro/BarChartPro.js +2 -0
- package/esm/Heatmap/Heatmap.d.ts +1 -1
- package/esm/Heatmap/Heatmap.js +9 -7
- package/{modern/Heatmap → esm/Heatmap/HeatmapTooltip}/HeatmapTooltip.js +30 -34
- package/esm/Heatmap/HeatmapTooltip/HeatmapTooltipAxesValue.d.ts +4 -0
- package/esm/Heatmap/HeatmapTooltip/HeatmapTooltipAxesValue.js +22 -0
- package/esm/Heatmap/HeatmapTooltip/index.d.ts +1 -0
- package/esm/Heatmap/HeatmapTooltip/index.js +1 -0
- package/esm/Heatmap/index.d.ts +1 -1
- package/esm/Heatmap/index.js +1 -1
- package/esm/LineChartPro/LineChartPro.js +2 -0
- package/esm/ScatterChartPro/ScatterChartPro.js +2 -0
- package/esm/index.js +1 -1
- package/esm/internals/utils/releaseInfo.js +1 -1
- package/index.js +1 -1
- package/internals/utils/releaseInfo.js +1 -1
- package/modern/BarChartPro/BarChartPro.js +2 -0
- package/modern/Heatmap/Heatmap.d.ts +1 -1
- package/modern/Heatmap/Heatmap.js +9 -7
- package/{esm/Heatmap → modern/Heatmap/HeatmapTooltip}/HeatmapTooltip.js +30 -34
- package/modern/Heatmap/HeatmapTooltip/HeatmapTooltipAxesValue.d.ts +4 -0
- package/modern/Heatmap/HeatmapTooltip/HeatmapTooltipAxesValue.js +22 -0
- package/modern/Heatmap/HeatmapTooltip/index.d.ts +1 -0
- package/modern/Heatmap/HeatmapTooltip/index.js +1 -0
- package/modern/Heatmap/index.d.ts +1 -1
- package/modern/Heatmap/index.js +1 -1
- package/modern/LineChartPro/LineChartPro.js +2 -0
- package/modern/ScatterChartPro/ScatterChartPro.js +2 -0
- package/modern/index.js +1 -1
- package/modern/internals/utils/releaseInfo.js +1 -1
- package/package.json +9 -11
- package/tsconfig.build.tsbuildinfo +1 -1
- /package/Heatmap/{HeatmapTooltip.d.ts → HeatmapTooltip/HeatmapTooltip.d.ts} +0 -0
- /package/esm/Heatmap/{HeatmapTooltip.d.ts → HeatmapTooltip/HeatmapTooltip.d.ts} +0 -0
- /package/modern/Heatmap/{HeatmapTooltip.d.ts → HeatmapTooltip/HeatmapTooltip.d.ts} +0 -0
|
@@ -9,12 +9,13 @@ import composeClasses from '@mui/utils/composeClasses';
|
|
|
9
9
|
import { ChartsTooltipPaper, ChartsTooltipTable, ChartsTooltipRow, ChartsTooltipCell, useItemTooltip, getChartsTooltipUtilityClass, ChartsTooltipContainer } from '@mui/x-charts/ChartsTooltip';
|
|
10
10
|
import { useXAxis, useYAxis } from '@mui/x-charts/hooks';
|
|
11
11
|
import { getLabel, ChartsLabelMark } from '@mui/x-charts/internals';
|
|
12
|
-
import { useHeatmapSeriesContext } from "
|
|
12
|
+
import { useHeatmapSeriesContext } from "../../hooks/useHeatmapSeries.js";
|
|
13
|
+
import { HeatmapTooltipAxesValue } from "./HeatmapTooltipAxesValue.js";
|
|
13
14
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
14
|
-
const useUtilityClasses =
|
|
15
|
+
const useUtilityClasses = props => {
|
|
15
16
|
const {
|
|
16
17
|
classes
|
|
17
|
-
} =
|
|
18
|
+
} = props;
|
|
18
19
|
const slots = {
|
|
19
20
|
root: ['root'],
|
|
20
21
|
paper: ['paper'],
|
|
@@ -22,16 +23,14 @@ const useUtilityClasses = ownerState => {
|
|
|
22
23
|
row: ['row'],
|
|
23
24
|
cell: ['cell'],
|
|
24
25
|
mark: ['mark'],
|
|
25
|
-
|
|
26
|
+
markContainer: ['markContainer'],
|
|
26
27
|
labelCell: ['labelCell'],
|
|
27
28
|
valueCell: ['valueCell']
|
|
28
29
|
};
|
|
29
30
|
return composeClasses(slots, getChartsTooltipUtilityClass, classes);
|
|
30
31
|
};
|
|
31
32
|
function DefaultHeatmapTooltipContent(props) {
|
|
32
|
-
const
|
|
33
|
-
classes
|
|
34
|
-
} = props;
|
|
33
|
+
const classes = useUtilityClasses(props);
|
|
35
34
|
const xAxis = useXAxis();
|
|
36
35
|
const yAxis = useYAxis();
|
|
37
36
|
const heatmapSeries = useHeatmapSeriesContext();
|
|
@@ -64,35 +63,32 @@ function DefaultHeatmapTooltipContent(props) {
|
|
|
64
63
|
});
|
|
65
64
|
const seriesLabel = getLabel(series[seriesId].label, 'tooltip');
|
|
66
65
|
return /*#__PURE__*/_jsx(ChartsTooltipPaper, {
|
|
67
|
-
className: classes
|
|
66
|
+
className: classes.paper,
|
|
68
67
|
children: /*#__PURE__*/_jsxs(ChartsTooltipTable, {
|
|
69
|
-
className: classes
|
|
70
|
-
children: [/*#__PURE__*/
|
|
71
|
-
children: /*#__PURE__*/
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
}), formattedX && formattedY && /*#__PURE__*/_jsx(ChartsTooltipCell, {}), /*#__PURE__*/_jsx(ChartsTooltipCell, {
|
|
77
|
-
className: classes?.cell,
|
|
78
|
-
children: formattedY
|
|
79
|
-
})]
|
|
80
|
-
})
|
|
68
|
+
className: classes.table,
|
|
69
|
+
children: [/*#__PURE__*/_jsxs(HeatmapTooltipAxesValue, {
|
|
70
|
+
children: [/*#__PURE__*/_jsx("span", {
|
|
71
|
+
children: formattedX
|
|
72
|
+
}), /*#__PURE__*/_jsx("span", {
|
|
73
|
+
children: formattedY
|
|
74
|
+
})]
|
|
81
75
|
}), /*#__PURE__*/_jsx("tbody", {
|
|
82
76
|
children: /*#__PURE__*/_jsxs(ChartsTooltipRow, {
|
|
83
|
-
className: classes
|
|
84
|
-
children: [/*#__PURE__*/
|
|
85
|
-
className: clsx(classes
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
77
|
+
className: classes.row,
|
|
78
|
+
children: [/*#__PURE__*/_jsxs(ChartsTooltipCell, {
|
|
79
|
+
className: clsx(classes.labelCell, classes.cell),
|
|
80
|
+
component: "th",
|
|
81
|
+
children: [/*#__PURE__*/_jsx("div", {
|
|
82
|
+
className: classes.markContainer,
|
|
83
|
+
children: /*#__PURE__*/_jsx(ChartsLabelMark, {
|
|
84
|
+
type: markType,
|
|
85
|
+
color: color,
|
|
86
|
+
className: classes.mark
|
|
87
|
+
})
|
|
88
|
+
}), seriesLabel]
|
|
94
89
|
}), /*#__PURE__*/_jsx(ChartsTooltipCell, {
|
|
95
|
-
className: clsx(classes
|
|
90
|
+
className: clsx(classes.valueCell, classes.cell),
|
|
91
|
+
component: "td",
|
|
96
92
|
children: formattedValue
|
|
97
93
|
})]
|
|
98
94
|
})
|
|
@@ -148,7 +144,7 @@ process.env.NODE_ENV !== "production" ? HeatmapTooltip.propTypes = {
|
|
|
148
144
|
* The components used for each slot inside the Popper.
|
|
149
145
|
* Either a string to use a HTML element or a component.
|
|
150
146
|
*
|
|
151
|
-
* @deprecated use the `slots` prop instead. This prop will be removed in
|
|
147
|
+
* @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/).
|
|
152
148
|
* @default {}
|
|
153
149
|
*/
|
|
154
150
|
components: PropTypes.shape({
|
|
@@ -157,7 +153,7 @@ process.env.NODE_ENV !== "production" ? HeatmapTooltip.propTypes = {
|
|
|
157
153
|
/**
|
|
158
154
|
* The props used for each slot inside the Popper.
|
|
159
155
|
*
|
|
160
|
-
* @deprecated use the `slotProps` prop instead. This prop will be removed in
|
|
156
|
+
* @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/).
|
|
161
157
|
* @default {}
|
|
162
158
|
*/
|
|
163
159
|
componentsProps: PropTypes.shape({
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @ignore - internal component.
|
|
3
|
+
*/
|
|
4
|
+
export declare const HeatmapTooltipAxesValue: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, keyof import("react").ClassAttributes<HTMLElement> | keyof import("react").HTMLAttributes<HTMLElement>>, {}>;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
3
|
+
import { styled } from '@mui/material/styles';
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
* @ignore - internal component.
|
|
7
|
+
*/
|
|
8
|
+
export const HeatmapTooltipAxesValue = styled('caption', {
|
|
9
|
+
name: 'MuiChartsHeatmapTooltip',
|
|
10
|
+
slot: 'AxesValue'
|
|
11
|
+
})(({
|
|
12
|
+
theme
|
|
13
|
+
}) => ({
|
|
14
|
+
textAlign: 'start',
|
|
15
|
+
whiteSpace: 'nowrap',
|
|
16
|
+
padding: theme.spacing(0.5, 1.5),
|
|
17
|
+
color: (theme.vars || theme).palette.text.secondary,
|
|
18
|
+
borderBottom: `solid ${(theme.vars || theme).palette.divider} 1px`,
|
|
19
|
+
[`& span`]: {
|
|
20
|
+
marginRight: theme.spacing(1.5)
|
|
21
|
+
}
|
|
22
|
+
}));
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "./HeatmapTooltip.js";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "./HeatmapTooltip.js";
|
package/esm/Heatmap/index.d.ts
CHANGED
package/esm/Heatmap/index.js
CHANGED
|
@@ -267,6 +267,7 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
|
|
|
267
267
|
height: PropTypes.number,
|
|
268
268
|
hideTooltip: PropTypes.bool,
|
|
269
269
|
id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
270
|
+
ignoreTooltip: PropTypes.bool,
|
|
270
271
|
label: PropTypes.string,
|
|
271
272
|
labelStyle: PropTypes.object,
|
|
272
273
|
max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
|
|
@@ -331,6 +332,7 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
|
|
|
331
332
|
fill: PropTypes.string,
|
|
332
333
|
hideTooltip: PropTypes.bool,
|
|
333
334
|
id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
335
|
+
ignoreTooltip: PropTypes.bool,
|
|
334
336
|
label: PropTypes.string,
|
|
335
337
|
labelStyle: PropTypes.object,
|
|
336
338
|
max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
|
|
@@ -261,6 +261,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
|
|
|
261
261
|
height: PropTypes.number,
|
|
262
262
|
hideTooltip: PropTypes.bool,
|
|
263
263
|
id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
264
|
+
ignoreTooltip: PropTypes.bool,
|
|
264
265
|
label: PropTypes.string,
|
|
265
266
|
labelStyle: PropTypes.object,
|
|
266
267
|
max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
|
|
@@ -325,6 +326,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
|
|
|
325
326
|
fill: PropTypes.string,
|
|
326
327
|
hideTooltip: PropTypes.bool,
|
|
327
328
|
id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
329
|
+
ignoreTooltip: PropTypes.bool,
|
|
328
330
|
label: PropTypes.string,
|
|
329
331
|
labelStyle: PropTypes.object,
|
|
330
332
|
max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
|
package/esm/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import ponyfillGlobal from '@mui/utils/ponyfillGlobal';
|
|
2
2
|
export const getReleaseInfo = () => {
|
|
3
|
-
const releaseInfo = "
|
|
3
|
+
const releaseInfo = "MTc0MzYzMTIwMDAwMA==";
|
|
4
4
|
if (process.env.NODE_ENV !== 'production') {
|
|
5
5
|
// A simple hack to set the value in the test environment (has no build step).
|
|
6
6
|
// eslint-disable-next-line no-useless-concat
|
package/index.js
CHANGED
|
@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
exports.getReleaseInfo = void 0;
|
|
8
8
|
var _ponyfillGlobal = _interopRequireDefault(require("@mui/utils/ponyfillGlobal"));
|
|
9
9
|
const getReleaseInfo = () => {
|
|
10
|
-
const releaseInfo = "
|
|
10
|
+
const releaseInfo = "MTc0MzYzMTIwMDAwMA==";
|
|
11
11
|
if (process.env.NODE_ENV !== 'production') {
|
|
12
12
|
// A simple hack to set the value in the test environment (has no build step).
|
|
13
13
|
// eslint-disable-next-line no-useless-concat
|
|
@@ -270,6 +270,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
|
|
|
270
270
|
height: PropTypes.number,
|
|
271
271
|
hideTooltip: PropTypes.bool,
|
|
272
272
|
id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
273
|
+
ignoreTooltip: PropTypes.bool,
|
|
273
274
|
label: PropTypes.string,
|
|
274
275
|
labelStyle: PropTypes.object,
|
|
275
276
|
max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
|
|
@@ -334,6 +335,7 @@ process.env.NODE_ENV !== "production" ? BarChartPro.propTypes = {
|
|
|
334
335
|
fill: PropTypes.string,
|
|
335
336
|
hideTooltip: PropTypes.bool,
|
|
336
337
|
id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
338
|
+
ignoreTooltip: PropTypes.bool,
|
|
337
339
|
label: PropTypes.string,
|
|
338
340
|
labelStyle: PropTypes.object,
|
|
339
341
|
max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
|
|
@@ -6,7 +6,7 @@ import { ChartsAxisSlots, ChartsAxisSlotProps, ChartsXAxisProps, ChartsYAxisProp
|
|
|
6
6
|
import { ChartsOverlayProps, ChartsOverlaySlotProps, ChartsOverlaySlots } from '@mui/x-charts/ChartsOverlay';
|
|
7
7
|
import { ChartContainerProProps } from "../ChartContainerPro/index.js";
|
|
8
8
|
import { HeatmapSeriesType } from "../models/seriesType/heatmap.js";
|
|
9
|
-
import { HeatmapTooltipProps } from "./HeatmapTooltip.js";
|
|
9
|
+
import { HeatmapTooltipProps } from "./HeatmapTooltip/HeatmapTooltip.js";
|
|
10
10
|
import { HeatmapItemSlotProps, HeatmapItemSlots } from "./HeatmapItem.js";
|
|
11
11
|
import { HeatmapPluginsSignatures } from "./Heatmap.plugins.js";
|
|
12
12
|
export interface HeatmapSlots extends ChartsAxisSlots, ChartsOverlaySlots, HeatmapItemSlots {
|
|
@@ -13,7 +13,7 @@ import { DEFAULT_X_AXIS_KEY, DEFAULT_Y_AXIS_KEY } from '@mui/x-charts/constants'
|
|
|
13
13
|
import { ChartContainerPro } from "../ChartContainerPro/index.js";
|
|
14
14
|
import { HeatmapPlot } from "./HeatmapPlot.js";
|
|
15
15
|
import { seriesConfig as heatmapSeriesConfig } from "./seriesConfig/index.js";
|
|
16
|
-
import { HeatmapTooltip } from "./HeatmapTooltip.js";
|
|
16
|
+
import { HeatmapTooltip } from "./HeatmapTooltip/HeatmapTooltip.js";
|
|
17
17
|
import { HEATMAP_PLUGINS } from "./Heatmap.plugins.js";
|
|
18
18
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
19
19
|
// The GnBu: https://github.com/d3/d3-scale-chromatic/blob/main/src/sequential-multi/GnBu.js
|
|
@@ -57,7 +57,7 @@ const Heatmap = /*#__PURE__*/React.forwardRef(function Heatmap(inProps, ref) {
|
|
|
57
57
|
} = props;
|
|
58
58
|
const id = useId();
|
|
59
59
|
const clipPathId = `${id}-clip-path`;
|
|
60
|
-
const
|
|
60
|
+
const xAxisWithDefault = React.useMemo(() => (xAxis && xAxis.length > 0 ? xAxis : [{
|
|
61
61
|
id: DEFAULT_X_AXIS_KEY
|
|
62
62
|
}]).map(axis => _extends({
|
|
63
63
|
scaleType: 'band',
|
|
@@ -65,7 +65,7 @@ const Heatmap = /*#__PURE__*/React.forwardRef(function Heatmap(inProps, ref) {
|
|
|
65
65
|
}, axis, {
|
|
66
66
|
data: axis.data ?? getDefaultDataForXAxis(series)
|
|
67
67
|
})), [series, xAxis]);
|
|
68
|
-
const
|
|
68
|
+
const yAxisWithDefault = React.useMemo(() => (yAxis && yAxis.length > 0 ? yAxis : [{
|
|
69
69
|
id: DEFAULT_Y_AXIS_KEY
|
|
70
70
|
}]).map(axis => _extends({
|
|
71
71
|
scaleType: 'band',
|
|
@@ -73,7 +73,7 @@ const Heatmap = /*#__PURE__*/React.forwardRef(function Heatmap(inProps, ref) {
|
|
|
73
73
|
}, axis, {
|
|
74
74
|
data: axis.data ?? getDefaultDataForYAxis(series)
|
|
75
75
|
})), [series, yAxis]);
|
|
76
|
-
const
|
|
76
|
+
const zAxisWithDefault = React.useMemo(() => zAxis ?? [{
|
|
77
77
|
colorMap: {
|
|
78
78
|
type: 'continuous',
|
|
79
79
|
min: 0,
|
|
@@ -91,9 +91,9 @@ const Heatmap = /*#__PURE__*/React.forwardRef(function Heatmap(inProps, ref) {
|
|
|
91
91
|
width: width,
|
|
92
92
|
height: height,
|
|
93
93
|
margin: margin,
|
|
94
|
-
xAxis:
|
|
95
|
-
yAxis:
|
|
96
|
-
zAxis:
|
|
94
|
+
xAxis: xAxisWithDefault,
|
|
95
|
+
yAxis: yAxisWithDefault,
|
|
96
|
+
zAxis: zAxisWithDefault,
|
|
97
97
|
colors: colors,
|
|
98
98
|
dataset: dataset,
|
|
99
99
|
sx: sx,
|
|
@@ -259,6 +259,7 @@ process.env.NODE_ENV !== "production" ? Heatmap.propTypes = {
|
|
|
259
259
|
height: PropTypes.number,
|
|
260
260
|
hideTooltip: PropTypes.bool,
|
|
261
261
|
id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
262
|
+
ignoreTooltip: PropTypes.bool,
|
|
262
263
|
label: PropTypes.string,
|
|
263
264
|
labelStyle: PropTypes.object,
|
|
264
265
|
max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
|
|
@@ -325,6 +326,7 @@ process.env.NODE_ENV !== "production" ? Heatmap.propTypes = {
|
|
|
325
326
|
fill: PropTypes.string,
|
|
326
327
|
hideTooltip: PropTypes.bool,
|
|
327
328
|
id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
329
|
+
ignoreTooltip: PropTypes.bool,
|
|
328
330
|
label: PropTypes.string,
|
|
329
331
|
labelStyle: PropTypes.object,
|
|
330
332
|
max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
|
|
@@ -9,12 +9,13 @@ import composeClasses from '@mui/utils/composeClasses';
|
|
|
9
9
|
import { ChartsTooltipPaper, ChartsTooltipTable, ChartsTooltipRow, ChartsTooltipCell, useItemTooltip, getChartsTooltipUtilityClass, ChartsTooltipContainer } from '@mui/x-charts/ChartsTooltip';
|
|
10
10
|
import { useXAxis, useYAxis } from '@mui/x-charts/hooks';
|
|
11
11
|
import { getLabel, ChartsLabelMark } from '@mui/x-charts/internals';
|
|
12
|
-
import { useHeatmapSeriesContext } from "
|
|
12
|
+
import { useHeatmapSeriesContext } from "../../hooks/useHeatmapSeries.js";
|
|
13
|
+
import { HeatmapTooltipAxesValue } from "./HeatmapTooltipAxesValue.js";
|
|
13
14
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
14
|
-
const useUtilityClasses =
|
|
15
|
+
const useUtilityClasses = props => {
|
|
15
16
|
const {
|
|
16
17
|
classes
|
|
17
|
-
} =
|
|
18
|
+
} = props;
|
|
18
19
|
const slots = {
|
|
19
20
|
root: ['root'],
|
|
20
21
|
paper: ['paper'],
|
|
@@ -22,16 +23,14 @@ const useUtilityClasses = ownerState => {
|
|
|
22
23
|
row: ['row'],
|
|
23
24
|
cell: ['cell'],
|
|
24
25
|
mark: ['mark'],
|
|
25
|
-
|
|
26
|
+
markContainer: ['markContainer'],
|
|
26
27
|
labelCell: ['labelCell'],
|
|
27
28
|
valueCell: ['valueCell']
|
|
28
29
|
};
|
|
29
30
|
return composeClasses(slots, getChartsTooltipUtilityClass, classes);
|
|
30
31
|
};
|
|
31
32
|
function DefaultHeatmapTooltipContent(props) {
|
|
32
|
-
const
|
|
33
|
-
classes
|
|
34
|
-
} = props;
|
|
33
|
+
const classes = useUtilityClasses(props);
|
|
35
34
|
const xAxis = useXAxis();
|
|
36
35
|
const yAxis = useYAxis();
|
|
37
36
|
const heatmapSeries = useHeatmapSeriesContext();
|
|
@@ -64,35 +63,32 @@ function DefaultHeatmapTooltipContent(props) {
|
|
|
64
63
|
});
|
|
65
64
|
const seriesLabel = getLabel(series[seriesId].label, 'tooltip');
|
|
66
65
|
return /*#__PURE__*/_jsx(ChartsTooltipPaper, {
|
|
67
|
-
className: classes
|
|
66
|
+
className: classes.paper,
|
|
68
67
|
children: /*#__PURE__*/_jsxs(ChartsTooltipTable, {
|
|
69
|
-
className: classes
|
|
70
|
-
children: [/*#__PURE__*/
|
|
71
|
-
children: /*#__PURE__*/
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
}), formattedX && formattedY && /*#__PURE__*/_jsx(ChartsTooltipCell, {}), /*#__PURE__*/_jsx(ChartsTooltipCell, {
|
|
77
|
-
className: classes?.cell,
|
|
78
|
-
children: formattedY
|
|
79
|
-
})]
|
|
80
|
-
})
|
|
68
|
+
className: classes.table,
|
|
69
|
+
children: [/*#__PURE__*/_jsxs(HeatmapTooltipAxesValue, {
|
|
70
|
+
children: [/*#__PURE__*/_jsx("span", {
|
|
71
|
+
children: formattedX
|
|
72
|
+
}), /*#__PURE__*/_jsx("span", {
|
|
73
|
+
children: formattedY
|
|
74
|
+
})]
|
|
81
75
|
}), /*#__PURE__*/_jsx("tbody", {
|
|
82
76
|
children: /*#__PURE__*/_jsxs(ChartsTooltipRow, {
|
|
83
|
-
className: classes
|
|
84
|
-
children: [/*#__PURE__*/
|
|
85
|
-
className: clsx(classes
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
77
|
+
className: classes.row,
|
|
78
|
+
children: [/*#__PURE__*/_jsxs(ChartsTooltipCell, {
|
|
79
|
+
className: clsx(classes.labelCell, classes.cell),
|
|
80
|
+
component: "th",
|
|
81
|
+
children: [/*#__PURE__*/_jsx("div", {
|
|
82
|
+
className: classes.markContainer,
|
|
83
|
+
children: /*#__PURE__*/_jsx(ChartsLabelMark, {
|
|
84
|
+
type: markType,
|
|
85
|
+
color: color,
|
|
86
|
+
className: classes.mark
|
|
87
|
+
})
|
|
88
|
+
}), seriesLabel]
|
|
94
89
|
}), /*#__PURE__*/_jsx(ChartsTooltipCell, {
|
|
95
|
-
className: clsx(classes
|
|
90
|
+
className: clsx(classes.valueCell, classes.cell),
|
|
91
|
+
component: "td",
|
|
96
92
|
children: formattedValue
|
|
97
93
|
})]
|
|
98
94
|
})
|
|
@@ -148,7 +144,7 @@ process.env.NODE_ENV !== "production" ? HeatmapTooltip.propTypes = {
|
|
|
148
144
|
* The components used for each slot inside the Popper.
|
|
149
145
|
* Either a string to use a HTML element or a component.
|
|
150
146
|
*
|
|
151
|
-
* @deprecated use the `slots` prop instead. This prop will be removed in
|
|
147
|
+
* @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/).
|
|
152
148
|
* @default {}
|
|
153
149
|
*/
|
|
154
150
|
components: PropTypes.shape({
|
|
@@ -157,7 +153,7 @@ process.env.NODE_ENV !== "production" ? HeatmapTooltip.propTypes = {
|
|
|
157
153
|
/**
|
|
158
154
|
* The props used for each slot inside the Popper.
|
|
159
155
|
*
|
|
160
|
-
* @deprecated use the `slotProps` prop instead. This prop will be removed in
|
|
156
|
+
* @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/).
|
|
161
157
|
* @default {}
|
|
162
158
|
*/
|
|
163
159
|
componentsProps: PropTypes.shape({
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @ignore - internal component.
|
|
3
|
+
*/
|
|
4
|
+
export declare const HeatmapTooltipAxesValue: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, Pick<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, keyof import("react").ClassAttributes<HTMLElement> | keyof import("react").HTMLAttributes<HTMLElement>>, {}>;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
3
|
+
import { styled } from '@mui/material/styles';
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
* @ignore - internal component.
|
|
7
|
+
*/
|
|
8
|
+
export const HeatmapTooltipAxesValue = styled('caption', {
|
|
9
|
+
name: 'MuiChartsHeatmapTooltip',
|
|
10
|
+
slot: 'AxesValue'
|
|
11
|
+
})(({
|
|
12
|
+
theme
|
|
13
|
+
}) => ({
|
|
14
|
+
textAlign: 'start',
|
|
15
|
+
whiteSpace: 'nowrap',
|
|
16
|
+
padding: theme.spacing(0.5, 1.5),
|
|
17
|
+
color: (theme.vars || theme).palette.text.secondary,
|
|
18
|
+
borderBottom: `solid ${(theme.vars || theme).palette.divider} 1px`,
|
|
19
|
+
[`& span`]: {
|
|
20
|
+
marginRight: theme.spacing(1.5)
|
|
21
|
+
}
|
|
22
|
+
}));
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "./HeatmapTooltip.js";
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from "./HeatmapTooltip.js";
|
package/modern/Heatmap/index.js
CHANGED
|
@@ -267,6 +267,7 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
|
|
|
267
267
|
height: PropTypes.number,
|
|
268
268
|
hideTooltip: PropTypes.bool,
|
|
269
269
|
id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
270
|
+
ignoreTooltip: PropTypes.bool,
|
|
270
271
|
label: PropTypes.string,
|
|
271
272
|
labelStyle: PropTypes.object,
|
|
272
273
|
max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
|
|
@@ -331,6 +332,7 @@ process.env.NODE_ENV !== "production" ? LineChartPro.propTypes = {
|
|
|
331
332
|
fill: PropTypes.string,
|
|
332
333
|
hideTooltip: PropTypes.bool,
|
|
333
334
|
id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
335
|
+
ignoreTooltip: PropTypes.bool,
|
|
334
336
|
label: PropTypes.string,
|
|
335
337
|
labelStyle: PropTypes.object,
|
|
336
338
|
max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
|
|
@@ -261,6 +261,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
|
|
|
261
261
|
height: PropTypes.number,
|
|
262
262
|
hideTooltip: PropTypes.bool,
|
|
263
263
|
id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
264
|
+
ignoreTooltip: PropTypes.bool,
|
|
264
265
|
label: PropTypes.string,
|
|
265
266
|
labelStyle: PropTypes.object,
|
|
266
267
|
max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
|
|
@@ -325,6 +326,7 @@ process.env.NODE_ENV !== "production" ? ScatterChartPro.propTypes = {
|
|
|
325
326
|
fill: PropTypes.string,
|
|
326
327
|
hideTooltip: PropTypes.bool,
|
|
327
328
|
id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
329
|
+
ignoreTooltip: PropTypes.bool,
|
|
328
330
|
label: PropTypes.string,
|
|
329
331
|
labelStyle: PropTypes.object,
|
|
330
332
|
max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
|
package/modern/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import ponyfillGlobal from '@mui/utils/ponyfillGlobal';
|
|
2
2
|
export const getReleaseInfo = () => {
|
|
3
|
-
const releaseInfo = "
|
|
3
|
+
const releaseInfo = "MTc0MzYzMTIwMDAwMA==";
|
|
4
4
|
if (process.env.NODE_ENV !== 'production') {
|
|
5
5
|
// A simple hack to set the value in the test environment (has no build step).
|
|
6
6
|
// eslint-disable-next-line no-useless-concat
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mui/x-charts-pro",
|
|
3
|
-
"version": "8.0.0-beta.
|
|
3
|
+
"version": "8.0.0-beta.3",
|
|
4
4
|
"description": "The Pro plan edition of the Charts components (MUI X).",
|
|
5
5
|
"author": "MUI Team",
|
|
6
6
|
"main": "./index.js",
|
|
@@ -29,22 +29,20 @@
|
|
|
29
29
|
"directory": "packages/x-charts-pro"
|
|
30
30
|
},
|
|
31
31
|
"dependencies": {
|
|
32
|
-
"@babel/runtime": "^7.
|
|
33
|
-
"@mui/utils": "^7.0.0
|
|
34
|
-
"@react-spring/rafz": "^9.7.5",
|
|
35
|
-
"@react-spring/web": "^9.7.5",
|
|
32
|
+
"@babel/runtime": "^7.27.0",
|
|
33
|
+
"@mui/utils": "^7.0.0",
|
|
36
34
|
"clsx": "^2.1.1",
|
|
37
35
|
"prop-types": "^15.8.1",
|
|
38
|
-
"@mui/x-charts": "8.0.0-beta.
|
|
39
|
-
"@mui/x-charts
|
|
40
|
-
"@mui/x-
|
|
41
|
-
"@mui/x-
|
|
36
|
+
"@mui/x-charts-vendor": "8.0.0-beta.3",
|
|
37
|
+
"@mui/x-charts": "8.0.0-beta.3",
|
|
38
|
+
"@mui/x-internals": "8.0.0-beta.3",
|
|
39
|
+
"@mui/x-license": "8.0.0-beta.3"
|
|
42
40
|
},
|
|
43
41
|
"peerDependencies": {
|
|
44
42
|
"@emotion/react": "^11.9.0",
|
|
45
43
|
"@emotion/styled": "^11.8.1",
|
|
46
|
-
"@mui/material": "^5.15.14 || ^6.0.0 || ^7.0.0
|
|
47
|
-
"@mui/system": "^5.15.14 || ^6.0.0 || ^7.0.0
|
|
44
|
+
"@mui/material": "^5.15.14 || ^6.0.0 || ^7.0.0",
|
|
45
|
+
"@mui/system": "^5.15.14 || ^6.0.0 || ^7.0.0",
|
|
48
46
|
"react": "^17.0.0 || ^18.0.0 || ^19.0.0",
|
|
49
47
|
"react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0"
|
|
50
48
|
},
|