@mui/x-charts 9.11.1 → 9.13.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.
- package/BarChart/BarChart.js +8 -1
- package/BarChart/BarChart.mjs +8 -1
- package/CHANGELOG.md +278 -0
- package/ChartsContainer/ChartsContainer.js +8 -1
- package/ChartsContainer/ChartsContainer.mjs +8 -1
- package/ChartsContainer/useChartsContainerProps.js +3 -1
- package/ChartsContainer/useChartsContainerProps.mjs +3 -1
- package/ChartsTooltip/ChartsAxisTooltipContent.js +2 -9
- package/ChartsTooltip/ChartsAxisTooltipContent.mjs +2 -9
- package/ChartsTooltip/ChartsItemTooltipContent.js +2 -2
- package/ChartsTooltip/ChartsItemTooltipContent.mjs +2 -2
- package/ChartsTooltip/ChartsTooltipContainer.js +6 -2
- package/ChartsTooltip/ChartsTooltipContainer.mjs +6 -2
- package/ChartsXAxis/useAxisTicksProps.js +2 -1
- package/ChartsXAxis/useAxisTicksProps.mjs +2 -1
- package/ChartsYAxis/shortenLabels.js +16 -26
- package/ChartsYAxis/shortenLabels.mjs +17 -27
- package/ChartsYAxis/useAxisTicksProps.js +2 -1
- package/ChartsYAxis/useAxisTicksProps.mjs +2 -1
- package/LineChart/CircleMarkElement.js +0 -4
- package/LineChart/CircleMarkElement.mjs +0 -4
- package/LineChart/LineChart.js +8 -1
- package/LineChart/LineChart.mjs +8 -1
- package/LineChart/MarkElement.js +13 -6
- package/LineChart/MarkElement.mjs +13 -6
- package/PieChart/PieChart.js +7 -0
- package/PieChart/PieChart.mjs +7 -0
- package/RadarChart/RadarChart.js +8 -1
- package/RadarChart/RadarChart.mjs +8 -1
- package/RadarChart/RadarSeriesPlot/RadarSeriesMarks.js +6 -2
- package/RadarChart/RadarSeriesPlot/RadarSeriesMarks.mjs +6 -2
- package/RadarChart/RadarSeriesPlot/RadarSeriesPlot.js +2 -1
- package/RadarChart/RadarSeriesPlot/RadarSeriesPlot.mjs +2 -1
- package/RadarChart/useRadarChartProps.js +3 -1
- package/RadarChart/useRadarChartProps.mjs +3 -1
- package/ScatterChart/ScatterChart.js +8 -1
- package/ScatterChart/ScatterChart.mjs +8 -1
- package/SparkLineChart/SparkLineChart.js +8 -1
- package/SparkLineChart/SparkLineChart.mjs +8 -1
- package/constants/index.d.mts +3 -1
- package/constants/index.d.ts +3 -1
- package/constants/index.js +5 -2
- package/constants/index.mjs +4 -1
- package/hooks/animation/index.d.mts +1 -0
- package/hooks/animation/index.d.ts +1 -0
- package/hooks/animation/index.js +11 -0
- package/hooks/animation/index.mjs +1 -0
- package/hooks/animation/useAnimateMark.d.mts +25 -0
- package/hooks/animation/useAnimateMark.d.ts +25 -0
- package/hooks/animation/useAnimateMark.js +45 -0
- package/hooks/animation/useAnimateMark.mjs +39 -0
- package/hooks/useInteractionItemProps.js +4 -0
- package/hooks/useInteractionItemProps.mjs +4 -0
- package/index.js +1 -1
- package/index.mjs +1 -1
- package/internals/components/ChartsAccessibilityProxy/ChartsAccessibilityProxy.js +13 -3
- package/internals/components/ChartsAccessibilityProxy/ChartsAccessibilityProxy.mjs +12 -3
- package/internals/components/ChartsAccessibilityProxy/focusAccessibilityProxy.d.mts +8 -0
- package/internals/components/ChartsAccessibilityProxy/focusAccessibilityProxy.d.ts +8 -0
- package/internals/components/ChartsAccessibilityProxy/focusAccessibilityProxy.js +25 -0
- package/internals/components/ChartsAccessibilityProxy/focusAccessibilityProxy.mjs +19 -0
- package/internals/components/ChartsAccessibilityProxy/index.d.mts +2 -1
- package/internals/components/ChartsAccessibilityProxy/index.d.ts +2 -1
- package/internals/components/ChartsAccessibilityProxy/index.js +11 -0
- package/internals/components/ChartsAccessibilityProxy/index.mjs +2 -1
- package/internals/domUtils.js +17 -16
- package/internals/domUtils.mjs +17 -15
- package/internals/ellipsize.d.mts +30 -0
- package/internals/ellipsize.d.ts +30 -0
- package/internals/ellipsize.js +60 -0
- package/internals/ellipsize.mjs +59 -0
- package/internals/index.d.mts +1 -0
- package/internals/index.d.ts +1 -0
- package/internals/index.js +8 -0
- package/internals/index.mjs +1 -0
- package/internals/plugins/corePlugins/useChartElementRef/useChartElementRef.js +3 -1
- package/internals/plugins/corePlugins/useChartElementRef/useChartElementRef.mjs +3 -1
- package/internals/plugins/corePlugins/useChartElementRef/useChartElementRef.types.d.mts +5 -0
- package/internals/plugins/corePlugins/useChartElementRef/useChartElementRef.types.d.ts +5 -0
- package/internals/plugins/featurePlugins/shared/useRegisterPointerInteractions.js +10 -0
- package/internals/plugins/featurePlugins/shared/useRegisterPointerInteractions.mjs +10 -0
- package/internals/plugins/featurePlugins/useChartCartesianAxis/computeAxisAutoSize.d.mts +3 -0
- package/internals/plugins/featurePlugins/useChartCartesianAxis/computeAxisAutoSize.d.ts +3 -0
- package/internals/plugins/featurePlugins/useChartCartesianAxis/computeAxisAutoSize.js +9 -5
- package/internals/plugins/featurePlugins/useChartCartesianAxis/computeAxisAutoSize.mjs +9 -5
- package/internals/plugins/featurePlugins/useChartCartesianAxis/useChartAxisAutoSize.selectors.js +9 -4
- package/internals/plugins/featurePlugins/useChartCartesianAxis/useChartAxisAutoSize.selectors.mjs +9 -4
- package/internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxis.js +75 -3
- package/internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxis.mjs +76 -3
- package/internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxis.types.d.mts +6 -2
- package/internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxis.types.d.ts +6 -2
- package/internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxisLayout.selectors.d.mts +1 -0
- package/internals/plugins/featurePlugins/useChartCartesianAxis/useChartCartesianAxisLayout.selectors.d.ts +1 -0
- package/internals/plugins/featurePlugins/useChartClosestPoint/useChartClosestPoint.js +22 -0
- package/internals/plugins/featurePlugins/useChartClosestPoint/useChartClosestPoint.mjs +22 -0
- package/internals/plugins/featurePlugins/useChartInteraction/useChartInteraction.js +27 -1
- package/internals/plugins/featurePlugins/useChartInteraction/useChartInteraction.mjs +27 -1
- package/internals/plugins/featurePlugins/useChartInteraction/useChartInteraction.types.d.mts +20 -0
- package/internals/plugins/featurePlugins/useChartInteraction/useChartInteraction.types.d.ts +20 -0
- package/internals/plugins/featurePlugins/useChartKeyboardNavigation/useChartKeyboardNavigation.js +242 -35
- package/internals/plugins/featurePlugins/useChartKeyboardNavigation/useChartKeyboardNavigation.mjs +244 -36
- package/internals/plugins/featurePlugins/useChartKeyboardNavigation/useChartKeyboardNavigation.selectors.d.mts +3 -0
- package/internals/plugins/featurePlugins/useChartKeyboardNavigation/useChartKeyboardNavigation.selectors.d.ts +3 -0
- package/internals/plugins/featurePlugins/useChartKeyboardNavigation/useChartKeyboardNavigation.selectors.js +12 -5
- package/internals/plugins/featurePlugins/useChartKeyboardNavigation/useChartKeyboardNavigation.selectors.mjs +11 -4
- package/internals/plugins/featurePlugins/useChartKeyboardNavigation/useChartKeyboardNavigation.types.d.mts +29 -0
- package/internals/plugins/featurePlugins/useChartKeyboardNavigation/useChartKeyboardNavigation.types.d.ts +29 -0
- package/internals/plugins/featurePlugins/useChartKeyboardNavigation/utils/getItemAtAxisPosition.d.mts +28 -0
- package/internals/plugins/featurePlugins/useChartKeyboardNavigation/utils/getItemAtAxisPosition.d.ts +28 -0
- package/internals/plugins/featurePlugins/useChartKeyboardNavigation/utils/getItemAtAxisPosition.js +81 -0
- package/internals/plugins/featurePlugins/useChartKeyboardNavigation/utils/getItemAtAxisPosition.mjs +76 -0
- package/internals/plugins/featurePlugins/useChartKeyboardNavigation/utils/getItemAtRotationIndex.d.mts +18 -0
- package/internals/plugins/featurePlugins/useChartKeyboardNavigation/utils/getItemAtRotationIndex.d.ts +18 -0
- package/internals/plugins/featurePlugins/useChartKeyboardNavigation/utils/getItemAtRotationIndex.js +65 -0
- package/internals/plugins/featurePlugins/useChartKeyboardNavigation/utils/getItemAtRotationIndex.mjs +60 -0
- package/internals/plugins/featurePlugins/useChartPolarAxis/useChartPolarAxis.js +43 -1
- package/internals/plugins/featurePlugins/useChartPolarAxis/useChartPolarAxis.mjs +43 -1
- package/internals/plugins/featurePlugins/useChartPolarAxis/useChartPolarAxis.types.d.mts +3 -2
- package/internals/plugins/featurePlugins/useChartPolarAxis/useChartPolarAxis.types.d.ts +3 -2
- package/internals/useDefaultTickLabelStyle.d.mts +7 -0
- package/internals/useDefaultTickLabelStyle.d.ts +7 -0
- package/internals/useDefaultTickLabelStyle.js +34 -0
- package/internals/useDefaultTickLabelStyle.mjs +28 -0
- package/package.json +6 -6
package/BarChart/BarChart.js
CHANGED
|
@@ -140,6 +140,13 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes /* remove-proptypes *
|
|
|
140
140
|
experimentalFeatures: _propTypes.default.shape({
|
|
141
141
|
keyboardActivation: _propTypes.default.bool
|
|
142
142
|
}),
|
|
143
|
+
/**
|
|
144
|
+
* If `true`, clicking an item immediately shows the keyboard focus indicator on it.
|
|
145
|
+
* By default, clicking sets the item that keyboard navigation starts from, but the focus
|
|
146
|
+
* indicator stays hidden until the user presses a key.
|
|
147
|
+
* @default false
|
|
148
|
+
*/
|
|
149
|
+
focusItemOnClick: _propTypes.default.bool,
|
|
143
150
|
/**
|
|
144
151
|
* Option to display a cartesian grid in the background.
|
|
145
152
|
*/
|
|
@@ -268,7 +275,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes /* remove-proptypes *
|
|
|
268
275
|
/**
|
|
269
276
|
* The function called for onClick events.
|
|
270
277
|
* The second argument contains information about all line/bar elements at the current mouse position.
|
|
271
|
-
* @param {
|
|
278
|
+
* @param {ChartsActivationEvent} event The event recorded on the `<svg/>` element.
|
|
272
279
|
* @param {null | ChartsAxisData} data The data about the clicked axis and items associated with it.
|
|
273
280
|
*/
|
|
274
281
|
onAxisClick: _propTypes.default.func,
|
package/BarChart/BarChart.mjs
CHANGED
|
@@ -133,6 +133,13 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes /* remove-proptypes *
|
|
|
133
133
|
experimentalFeatures: PropTypes.shape({
|
|
134
134
|
keyboardActivation: PropTypes.bool
|
|
135
135
|
}),
|
|
136
|
+
/**
|
|
137
|
+
* If `true`, clicking an item immediately shows the keyboard focus indicator on it.
|
|
138
|
+
* By default, clicking sets the item that keyboard navigation starts from, but the focus
|
|
139
|
+
* indicator stays hidden until the user presses a key.
|
|
140
|
+
* @default false
|
|
141
|
+
*/
|
|
142
|
+
focusItemOnClick: PropTypes.bool,
|
|
136
143
|
/**
|
|
137
144
|
* Option to display a cartesian grid in the background.
|
|
138
145
|
*/
|
|
@@ -261,7 +268,7 @@ process.env.NODE_ENV !== "production" ? BarChart.propTypes /* remove-proptypes *
|
|
|
261
268
|
/**
|
|
262
269
|
* The function called for onClick events.
|
|
263
270
|
* The second argument contains information about all line/bar elements at the current mouse position.
|
|
264
|
-
* @param {
|
|
271
|
+
* @param {ChartsActivationEvent} event The event recorded on the `<svg/>` element.
|
|
265
272
|
* @param {null | ChartsAxisData} data The data about the clicked axis and items associated with it.
|
|
266
273
|
*/
|
|
267
274
|
onAxisClick: PropTypes.func,
|
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,283 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## 9.13.0
|
|
4
|
+
|
|
5
|
+
<!-- generated comparing v9.12.0..master -->
|
|
6
|
+
|
|
7
|
+
_Sep 4, 2026_
|
|
8
|
+
|
|
9
|
+
We'd like to extend a big thank you to the 14 contributors who made this release possible. Here are some highlights ✨:
|
|
10
|
+
|
|
11
|
+
- 🦮 Improve keyboard navigation features of the Charts.
|
|
12
|
+
- 🎨 Improved customization of the edit event dialog in the `EventCalendar`
|
|
13
|
+
- 🐞 Bugfixes
|
|
14
|
+
- 📚 Documentation improvements
|
|
15
|
+
|
|
16
|
+
Special thanks go out to these community members for their valuable contributions:
|
|
17
|
+
@Anexus5919, @jvskriubakken, @mustafajw07, @roychan1
|
|
18
|
+
|
|
19
|
+
The following team members contributed to this release:
|
|
20
|
+
@brijeshb42, @flaviendelangle, @hasdfa, @Janpot, @JCQuintas, @LukasTy, @michelengelen, @noraleonte, @rita-codes, @silviuaavram
|
|
21
|
+
|
|
22
|
+
### Data Grid
|
|
23
|
+
|
|
24
|
+
#### `@mui/x-data-grid@9.13.0`
|
|
25
|
+
|
|
26
|
+
- [DataGrid] Call `onValueChange` after `setEditCellValue` in edit cells (#23417) @michelengelen
|
|
27
|
+
- [DataGrid] Add support for replacing rows instead of merging updates (#23323) @jvskriubakken
|
|
28
|
+
- [DataGrid] Always render `rowHeader` in virtualized setups (#23386) @silviuaavram
|
|
29
|
+
- [DataGrid] Export `ToolbarRoot` (#23322) @JCQuintas
|
|
30
|
+
- [DataGrid] Fix `rowsPerPage` selector appearing when `autoPageSize` is enabled and `pageSize` is one of `pageSizeOptions` (#23401) @roychan1
|
|
31
|
+
- [DataGrid] Fix row tree reset when a data source grid becomes visible (#23288) @JCQuintas
|
|
32
|
+
|
|
33
|
+
#### `@mui/x-data-grid-pro@9.13.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
34
|
+
|
|
35
|
+
Same changes as in `@mui/x-data-grid@9.13.0`, plus:
|
|
36
|
+
|
|
37
|
+
- [DataGridPro] Remove rows deleted server-side on nested lazy loading revalidation (#23320) @JCQuintas
|
|
38
|
+
- [DataGridPro] Stop `disableDebounce` from reaching the DOM in multi select filter (#23445) @JCQuintas
|
|
39
|
+
|
|
40
|
+
#### `@mui/x-data-grid-premium@9.13.0` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
41
|
+
|
|
42
|
+
Same changes as in `@mui/x-data-grid-pro@9.13.0`, plus:
|
|
43
|
+
|
|
44
|
+
- [DataGridPremium] Refine cell selection and speed up clipboard copy (#23473) @michelengelen
|
|
45
|
+
- [DataGridPremium] Select all cells with Ctrl+A (#23415) @michelengelen
|
|
46
|
+
|
|
47
|
+
### Date and Time Pickers
|
|
48
|
+
|
|
49
|
+
#### `@mui/x-date-pickers@9.13.0`
|
|
50
|
+
|
|
51
|
+
Internal changes.
|
|
52
|
+
|
|
53
|
+
#### `@mui/x-date-pickers-pro@9.13.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
54
|
+
|
|
55
|
+
Same changes as in `@mui/x-date-pickers@9.13.0`.
|
|
56
|
+
|
|
57
|
+
### Charts
|
|
58
|
+
|
|
59
|
+
#### `@mui/x-charts@9.13.0`
|
|
60
|
+
|
|
61
|
+
- [charts] Activate the focused axis with Enter/Space (#23219) @JCQuintas
|
|
62
|
+
- [charts] Add keyboard zoom and pan (#23369) @JCQuintas
|
|
63
|
+
- [charts] Fix line mark position under browser zoom in Safari (#23387) @noraleonte
|
|
64
|
+
- [charts] Fix y axis tick labels shortened near the top of the chart (#23435) @JCQuintas
|
|
65
|
+
- [charts] Focus the clicked item on radar charts (#23287) @JCQuintas
|
|
66
|
+
- [charts] Stop text measurements leaking into each other (#23430) @JCQuintas
|
|
67
|
+
|
|
68
|
+
#### `@mui/x-charts-pro@9.13.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
69
|
+
|
|
70
|
+
Same changes as in `@mui/x-charts@9.13.0`.
|
|
71
|
+
|
|
72
|
+
#### `@mui/x-charts-premium@9.13.0` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
73
|
+
|
|
74
|
+
Same changes as in `@mui/x-charts-pro@9.13.0`.
|
|
75
|
+
|
|
76
|
+
### Tree View
|
|
77
|
+
|
|
78
|
+
#### `@mui/x-tree-view@9.13.0`
|
|
79
|
+
|
|
80
|
+
- [tree view] Add `loading` prop and customizable loading UI (#22251) @michelengelen
|
|
81
|
+
- [tree view] Reduce selector bundle size (#23412) @flaviendelangle
|
|
82
|
+
- [tree view] Remove dead UI from community component (#23487) @noraleonte
|
|
83
|
+
- [tree view] Remove unused dependencies (#23488) @noraleonte
|
|
84
|
+
- [tree view] Use `useId` for the default tree id (#23341) @Anexus5919
|
|
85
|
+
|
|
86
|
+
#### `@mui/x-tree-view-pro@9.13.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
87
|
+
|
|
88
|
+
Same changes as in `@mui/x-tree-view@9.13.0`.
|
|
89
|
+
|
|
90
|
+
### Scheduler
|
|
91
|
+
|
|
92
|
+
#### `@mui/x-scheduler@9.0.0-beta.11`
|
|
93
|
+
|
|
94
|
+
- [scheduler] Absorb un-acted `ResizeObserver` deliveries after rendering the timeline (#23444) @rita-codes
|
|
95
|
+
- [scheduler] Add `EventContextMenu` with Edit and Delete actions (#23379) @mustafajw07
|
|
96
|
+
- [scheduler] Add aria-hidden to collapsed side panel and refactor landmark structure (#23425) @mustafajw07
|
|
97
|
+
- [scheduler] Add the `eventDialogGeneralTab` slot (#23338) @rita-codes
|
|
98
|
+
- [scheduler] Fix the un-awaited act warning in the event dialog slot test (#23446) @JCQuintas
|
|
99
|
+
- [scheduler] Improve timeline event layout performance (#23364) @flaviendelangle
|
|
100
|
+
- [scheduler] Keep `aria-expanded` present when ViewSwitcher and PreferencesMenu menus are closed (#23427) @mustafajw07
|
|
101
|
+
- [scheduler] Make the event dialog General-tab building blocks public (#23398) @rita-codes
|
|
102
|
+
- [scheduler] Migrate to the pragmatic-drag-and-drop v3 entry points (#23442) @rita-codes
|
|
103
|
+
- [scheduler] Reduce selector bundle size (#23413) @flaviendelangle
|
|
104
|
+
- [scheduler] Reuse processed events between updates (#23363) @flaviendelangle
|
|
105
|
+
- [scheduler] Add `aria-expanded` and `aria-controls` to side panel toggle button (#23402) @mustafajw07
|
|
106
|
+
|
|
107
|
+
#### `@mui/x-scheduler-premium@9.0.0-beta.11` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
108
|
+
|
|
109
|
+
Same changes as in `@mui/x-scheduler@9.0.0-beta.11`, plus:
|
|
110
|
+
|
|
111
|
+
- [scheduler-premium] Dependencies - Keep event drags working over the arrow hit-areas (#23441) @rita-codes
|
|
112
|
+
- [scheduler-premium] Dependencies - Reject dependencies that would create a cycle (#23389) @rita-codes
|
|
113
|
+
- [scheduler-premium] Key recurring `exDates` on their data-timezone day (#23467) @rita-codes
|
|
114
|
+
|
|
115
|
+
### Codemod
|
|
116
|
+
|
|
117
|
+
#### `@mui/x-codemod@9.13.0`
|
|
118
|
+
|
|
119
|
+
Internal changes.
|
|
120
|
+
|
|
121
|
+
### Docs
|
|
122
|
+
|
|
123
|
+
- [docs] Add synchronized tooltip and crosshair demo to charts (#23368) @JCQuintas
|
|
124
|
+
- [docs] Add sticky headers recipe to `RichTreeView` customization (#22908) @michelengelen
|
|
125
|
+
- [docs] Pin the visible date of the scheduler preferences demos (#23432) @rita-codes
|
|
126
|
+
- [docs] Star-prefix bare :where() dark-mode selectors (#23419) @Janpot
|
|
127
|
+
- [docs] Consolidate demo data into shared dataset files (#23496) @michelengelen
|
|
128
|
+
|
|
129
|
+
### Core
|
|
130
|
+
|
|
131
|
+
- [code-infra] Consume shared commands from code-infra orb (#23485) @brijeshb42
|
|
132
|
+
- [code-infra] Move the shared spy helpers off Sinon (#23466) @JCQuintas
|
|
133
|
+
- [code-infra] Point the support validator link at frontend-public (#23422) @Janpot
|
|
134
|
+
- [code-infra] Reduce per-page memory in the browser test suite (#23424) @Janpot
|
|
135
|
+
- [code-infra] Remove Sinon (#23476) @JCQuintas
|
|
136
|
+
- [code-infra] Remove the explicit `styled-components` dependency (#23479) @LukasTy
|
|
137
|
+
- [code-infra] Replace the mechanical sinon `spy()` usages with `vi.fn()` (#23443) @JCQuintas
|
|
138
|
+
- [code-infra] Replace the sinon `spy(fn)` usages with `vi.fn(fn)` (#23460) @JCQuintas
|
|
139
|
+
- [code-infra] Replace the sinon spy types with the Vitest ones (#23464) @JCQuintas
|
|
140
|
+
- [code-infra] Replace the sinon spy-on-object calls with `vi.spyOn` (#23474) @JCQuintas
|
|
141
|
+
- [code-infra] Replace the sinon stubs with Vitest mocks (#23472) @JCQuintas
|
|
142
|
+
- [code-infra] Run TypeScript 7 alongside the TS6 JS API (#23471) @brijeshb42
|
|
143
|
+
- [code-infra] Trim the shared browser test setup graph (#23426) @LukasTy
|
|
144
|
+
- [code-infra] Update CircleCI orb (#23418) @JCQuintas
|
|
145
|
+
- [code-infra] Use explicit vitest imports in test files (#23375) @michelengelen
|
|
146
|
+
|
|
147
|
+
### Miscellaneous
|
|
148
|
+
|
|
149
|
+
- [chat] Enforce top-level type imports (#23037) @Janpot
|
|
150
|
+
- [chat] Fix global preload error from the `remend` import (#23263) @hasdfa
|
|
151
|
+
- [ci] Add Claude PR review via mui-public reusable workflow (#23423) @Janpot
|
|
152
|
+
- [telemetry] Fix get-context test leaking mock from sender test (#23447) @JCQuintas
|
|
153
|
+
- [test] Fail the regression run when a webfont does not load (#23376) @LukasTy
|
|
154
|
+
|
|
155
|
+
## 9.12.0
|
|
156
|
+
|
|
157
|
+
_Aug 21, 2026_
|
|
158
|
+
|
|
159
|
+
We'd like to extend a big thank you to the 12 contributors who made this release possible. Here are some highlights ✨:
|
|
160
|
+
|
|
161
|
+
- 🧮 Support [Formulas](https://mui.com/x/react-data-grid/formulas/) on the Data Grid: cells in opted-in columns can hold spreadsheet-like formulas (`=SUM(RANGE(…))`, `=price * quantity`) evaluated by a built-in engine, with a formula editor and [Formula Bar](https://mui.com/x/react-data-grid/components/formula-bar/), autocomplete, reference highlighting, optional A1 notation, fill-handle reference adjustment, custom functions, and live formula Excel export
|
|
162
|
+
- ♿️ Improve the accessibility of Data Grid cells and picker day cells
|
|
163
|
+
- 🗓️ Enable multi-resource event creation and editing in the Scheduler
|
|
164
|
+
- 🐞 Bugfixes
|
|
165
|
+
- 📚 Documentation improvements
|
|
166
|
+
|
|
167
|
+
Special thanks go out to these community members for their valuable contributions:
|
|
168
|
+
@Anexus5919, @mustafajw07
|
|
169
|
+
|
|
170
|
+
The following team members contributed to this release:
|
|
171
|
+
@brijeshb42, @flaviendelangle, @JCQuintas, @LukasTy, @MBilalShafi, @michelengelen, @noraleonte, @rita-codes, @romgrk, @silviuaavram
|
|
172
|
+
|
|
173
|
+
### Data Grid
|
|
174
|
+
|
|
175
|
+
#### `@mui/x-data-grid@9.12.0`
|
|
176
|
+
|
|
177
|
+
- [DataGrid] Expose `apiRef` on `GridCallbackDetails` for selector access in callbacks (#22973) @michelengelen
|
|
178
|
+
- [DataGrid] Fix header height not updating when `headerFilters` or `columnGroupingModel` change (#23059) @MBilalShafi
|
|
179
|
+
- [DataGrid] Fix unhandled rejection when unmounting mid-autosize (#23319) @JCQuintas
|
|
180
|
+
- [DataGrid] Label the blank `singleSelect` filter option (#23294) @JCQuintas
|
|
181
|
+
- [DataGrid] Stop sending incomplete filter items to the data source (#23303) @JCQuintas
|
|
182
|
+
- [DataGrid] Support the `rowheader` attribute for grid cells (#23340) @silviuaavram
|
|
183
|
+
|
|
184
|
+
#### `@mui/x-data-grid-pro@9.12.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
185
|
+
|
|
186
|
+
Same changes as in `@mui/x-data-grid@9.12.0`, plus:
|
|
187
|
+
|
|
188
|
+
- [DataGridPro] Honor `hasNextPage` in infinite lazy loading (#23048) @MBilalShafi
|
|
189
|
+
|
|
190
|
+
#### `@mui/x-data-grid-premium@9.12.0` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
191
|
+
|
|
192
|
+
Same changes as in `@mui/x-data-grid-pro@9.12.0`, plus:
|
|
193
|
+
|
|
194
|
+
- [DataGridPremium] Formula support (#22807) @MBilalShafi
|
|
195
|
+
|
|
196
|
+
### Date and Time Pickers
|
|
197
|
+
|
|
198
|
+
#### `@mui/x-date-pickers@9.12.0`
|
|
199
|
+
|
|
200
|
+
- [fields] Keep the selected section on blank space clicks (#23318) @LukasTy
|
|
201
|
+
- [pickers] Associate the day cells with their week day column header (#23339) @LukasTy
|
|
202
|
+
- [pickers] Keep the `gridcell` role and the column index on filler cells (#23326) @Anexus5919
|
|
203
|
+
|
|
204
|
+
#### `@mui/x-date-pickers-pro@9.12.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
205
|
+
|
|
206
|
+
Same changes as in `@mui/x-date-pickers@9.12.0`, plus:
|
|
207
|
+
|
|
208
|
+
- [DateRangeCalendar] Round the range highlight at the month grid edges (#23297) @JCQuintas
|
|
209
|
+
- [DateRangePicker] Keep the range highlight opaque for disabled days (#23317) @JCQuintas
|
|
210
|
+
|
|
211
|
+
### Charts
|
|
212
|
+
|
|
213
|
+
#### `@mui/x-charts@9.12.0`
|
|
214
|
+
|
|
215
|
+
- [charts] Add a demo for label on grid row (#23333) @noraleonte
|
|
216
|
+
- [charts] Fix React 18 `propTypes` warnings and stray-pointer test flakiness (#23384) @LukasTy
|
|
217
|
+
- [charts] Focus the clicked item for keyboard navigation (#23247) @JCQuintas
|
|
218
|
+
|
|
219
|
+
#### `@mui/x-charts-pro@9.12.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
220
|
+
|
|
221
|
+
Same changes as in `@mui/x-charts@9.12.0`.
|
|
222
|
+
|
|
223
|
+
#### `@mui/x-charts-premium@9.12.0` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
224
|
+
|
|
225
|
+
Same changes as in `@mui/x-charts-pro@9.12.0`, plus:
|
|
226
|
+
|
|
227
|
+
- [charts-premium] Add `onItemClick` to the radial charts (#23253) @JCQuintas
|
|
228
|
+
|
|
229
|
+
### Tree View
|
|
230
|
+
|
|
231
|
+
#### `@mui/x-tree-view@9.12.0`
|
|
232
|
+
|
|
233
|
+
Internal changes.
|
|
234
|
+
|
|
235
|
+
#### `@mui/x-tree-view-pro@9.12.0` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
236
|
+
|
|
237
|
+
Same changes as in `@mui/x-tree-view@9.12.0`.
|
|
238
|
+
|
|
239
|
+
### Scheduler
|
|
240
|
+
|
|
241
|
+
#### `@mui/x-scheduler@9.0.0-beta.10`
|
|
242
|
+
|
|
243
|
+
- [scheduler] Add `onEventEditingStart` to let consumers open their own edit UI (#23361) @rita-codes
|
|
244
|
+
- [scheduler] Fix keyboard and focus issues around the "+N more" popover (#23312) @rita-codes
|
|
245
|
+
- [scheduler] Honor `viewConfig` hour limits in the compact day and week views (#23316) @rita-codes
|
|
246
|
+
- [scheduler] Share timeline event layout data (#23366) @flaviendelangle
|
|
247
|
+
- [scheduler] enable multi-resource event creation and editing (#23313) @mustafajw07
|
|
248
|
+
|
|
249
|
+
#### `@mui/x-scheduler-premium@9.0.0-beta.10` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
250
|
+
|
|
251
|
+
Same changes as in `@mui/x-scheduler@9.0.0-beta.10`, plus:
|
|
252
|
+
|
|
253
|
+
- [scheduler-premium] Allow to control the min and max hour in the Event Timeline (#23212) @rita-codes
|
|
254
|
+
- [scheduler-premium] Dependencies - Create, select and delete via terminals (#23200) @rita-codes
|
|
255
|
+
|
|
256
|
+
### Codemod
|
|
257
|
+
|
|
258
|
+
#### `@mui/x-codemod@9.12.0`
|
|
259
|
+
|
|
260
|
+
Internal changes.
|
|
261
|
+
|
|
262
|
+
### Docs
|
|
263
|
+
|
|
264
|
+
- [docs][charts] Document line mark size customization (#23370) @JCQuintas
|
|
265
|
+
- [docs] Add recipe for constraining the `make-child` drop action by item type (#22940) @michelengelen
|
|
266
|
+
- [docs] Redirect the renamed Event Timeline views page (#23324) @brijeshb42
|
|
267
|
+
- [docs] Remove unused `adapter-dependencies.json` (#23328) @LukasTy
|
|
268
|
+
|
|
269
|
+
### Core
|
|
270
|
+
|
|
271
|
+
- [code-infra] Add release skill (#23308) @brijeshb42
|
|
272
|
+
- [code-infra] Fix changelog categorization of docs and `DateRangeCalendar` tags (#23385) @JCQuintas
|
|
273
|
+
- [code-infra] Sync mui-release skill (#23330) @brijeshb42
|
|
274
|
+
|
|
275
|
+
### Miscellaneous
|
|
276
|
+
|
|
277
|
+
- [core] Declare the missing `react-dom` peer dependencies (#23381) @LukasTy
|
|
278
|
+
- [test] Fix act warnings in the data source filter tests (#23360) @JCQuintas
|
|
279
|
+
- [virtualizer] Add inverse-sticky layout (#23053) @romgrk
|
|
280
|
+
|
|
3
281
|
## 9.11.1
|
|
4
282
|
|
|
5
283
|
_Aug 6, 2026_
|
|
@@ -111,6 +111,13 @@ process.env.NODE_ENV !== "production" ? ChartsContainer.propTypes /* remove-prop
|
|
|
111
111
|
experimentalFeatures: _propTypes.default.shape({
|
|
112
112
|
keyboardActivation: _propTypes.default.bool
|
|
113
113
|
}),
|
|
114
|
+
/**
|
|
115
|
+
* If `true`, clicking an item immediately shows the keyboard focus indicator on it.
|
|
116
|
+
* By default, clicking sets the item that keyboard navigation starts from, but the focus
|
|
117
|
+
* indicator stays hidden until the user presses a key.
|
|
118
|
+
* @default false
|
|
119
|
+
*/
|
|
120
|
+
focusItemOnClick: _propTypes.default.bool,
|
|
114
121
|
/**
|
|
115
122
|
* The height of the chart in px. If not defined, it takes the height of the parent element.
|
|
116
123
|
*/
|
|
@@ -224,7 +231,7 @@ process.env.NODE_ENV !== "production" ? ChartsContainer.propTypes /* remove-prop
|
|
|
224
231
|
/**
|
|
225
232
|
* The function called for onClick events.
|
|
226
233
|
* The second argument contains information about all line/bar elements at the current mouse position.
|
|
227
|
-
* @param {
|
|
234
|
+
* @param {ChartsActivationEvent} event The event recorded on the `<svg/>` element.
|
|
228
235
|
* @param {null | ChartsAxisData} data The data about the clicked axis and items associated with it.
|
|
229
236
|
*/
|
|
230
237
|
onAxisClick: _propTypes.default.func,
|
|
@@ -104,6 +104,13 @@ process.env.NODE_ENV !== "production" ? ChartsContainer.propTypes /* remove-prop
|
|
|
104
104
|
experimentalFeatures: PropTypes.shape({
|
|
105
105
|
keyboardActivation: PropTypes.bool
|
|
106
106
|
}),
|
|
107
|
+
/**
|
|
108
|
+
* If `true`, clicking an item immediately shows the keyboard focus indicator on it.
|
|
109
|
+
* By default, clicking sets the item that keyboard navigation starts from, but the focus
|
|
110
|
+
* indicator stays hidden until the user presses a key.
|
|
111
|
+
* @default false
|
|
112
|
+
*/
|
|
113
|
+
focusItemOnClick: PropTypes.bool,
|
|
107
114
|
/**
|
|
108
115
|
* The height of the chart in px. If not defined, it takes the height of the parent element.
|
|
109
116
|
*/
|
|
@@ -217,7 +224,7 @@ process.env.NODE_ENV !== "production" ? ChartsContainer.propTypes /* remove-prop
|
|
|
217
224
|
/**
|
|
218
225
|
* The function called for onClick events.
|
|
219
226
|
* The second argument contains information about all line/bar elements at the current mouse position.
|
|
220
|
-
* @param {
|
|
227
|
+
* @param {ChartsActivationEvent} event The event recorded on the `<svg/>` element.
|
|
221
228
|
* @param {null | ChartsAxisData} data The data about the clicked axis and items associated with it.
|
|
222
229
|
*/
|
|
223
230
|
onAxisClick: PropTypes.func,
|
|
@@ -9,7 +9,7 @@ exports.useChartsContainerProps = void 0;
|
|
|
9
9
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
10
10
|
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
|
|
11
11
|
var _allPlugins = require("../internals/plugins/allPlugins");
|
|
12
|
-
const _excluded = ["width", "height", "margin", "children", "series", "colors", "dataset", "desc", "onAxisClick", "highlightedAxis", "onHighlightedAxisChange", "tooltipAxis", "onTooltipAxisChange", "tooltipItem", "onTooltipItemChange", "disableHitArea", "hitAreaRadius", "onItemClick", "disableAxisListener", "highlightedItem", "onHighlightChange", "sx", "title", "axesGap", "xAxis", "yAxis", "zAxis", "rotationAxis", "radiusAxis", "skipAnimation", "seriesConfig", "experimentalFeatures", "plugins", "localeText", "slots", "slotProps", "disableKeyboardNavigation", "brushConfig", "onHiddenItemsChange", "hiddenItems", "initialHiddenItems"];
|
|
12
|
+
const _excluded = ["width", "height", "margin", "children", "series", "colors", "dataset", "desc", "onAxisClick", "highlightedAxis", "onHighlightedAxisChange", "tooltipAxis", "onTooltipAxisChange", "tooltipItem", "onTooltipItemChange", "disableHitArea", "hitAreaRadius", "onItemClick", "disableAxisListener", "highlightedItem", "onHighlightChange", "sx", "title", "axesGap", "xAxis", "yAxis", "zAxis", "rotationAxis", "radiusAxis", "skipAnimation", "seriesConfig", "experimentalFeatures", "plugins", "localeText", "slots", "slotProps", "disableKeyboardNavigation", "focusItemOnClick", "brushConfig", "onHiddenItemsChange", "hiddenItems", "initialHiddenItems"];
|
|
13
13
|
const useChartsContainerProps = props => {
|
|
14
14
|
const _ref = props,
|
|
15
15
|
{
|
|
@@ -50,6 +50,7 @@ const useChartsContainerProps = props => {
|
|
|
50
50
|
slots,
|
|
51
51
|
slotProps,
|
|
52
52
|
disableKeyboardNavigation,
|
|
53
|
+
focusItemOnClick,
|
|
53
54
|
brushConfig,
|
|
54
55
|
onHiddenItemsChange,
|
|
55
56
|
hiddenItems,
|
|
@@ -92,6 +93,7 @@ const useChartsContainerProps = props => {
|
|
|
92
93
|
seriesConfig,
|
|
93
94
|
experimentalFeatures,
|
|
94
95
|
disableKeyboardNavigation,
|
|
96
|
+
focusItemOnClick,
|
|
95
97
|
brushConfig,
|
|
96
98
|
onHiddenItemsChange,
|
|
97
99
|
hiddenItems,
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
4
4
|
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
|
5
|
-
const _excluded = ["width", "height", "margin", "children", "series", "colors", "dataset", "desc", "onAxisClick", "highlightedAxis", "onHighlightedAxisChange", "tooltipAxis", "onTooltipAxisChange", "tooltipItem", "onTooltipItemChange", "disableHitArea", "hitAreaRadius", "onItemClick", "disableAxisListener", "highlightedItem", "onHighlightChange", "sx", "title", "axesGap", "xAxis", "yAxis", "zAxis", "rotationAxis", "radiusAxis", "skipAnimation", "seriesConfig", "experimentalFeatures", "plugins", "localeText", "slots", "slotProps", "disableKeyboardNavigation", "brushConfig", "onHiddenItemsChange", "hiddenItems", "initialHiddenItems"];
|
|
5
|
+
const _excluded = ["width", "height", "margin", "children", "series", "colors", "dataset", "desc", "onAxisClick", "highlightedAxis", "onHighlightedAxisChange", "tooltipAxis", "onTooltipAxisChange", "tooltipItem", "onTooltipItemChange", "disableHitArea", "hitAreaRadius", "onItemClick", "disableAxisListener", "highlightedItem", "onHighlightChange", "sx", "title", "axesGap", "xAxis", "yAxis", "zAxis", "rotationAxis", "radiusAxis", "skipAnimation", "seriesConfig", "experimentalFeatures", "plugins", "localeText", "slots", "slotProps", "disableKeyboardNavigation", "focusItemOnClick", "brushConfig", "onHiddenItemsChange", "hiddenItems", "initialHiddenItems"];
|
|
6
6
|
import { DEFAULT_PLUGINS } from "../internals/plugins/allPlugins.mjs";
|
|
7
7
|
export const useChartsContainerProps = props => {
|
|
8
8
|
const _ref = props,
|
|
@@ -44,6 +44,7 @@ export const useChartsContainerProps = props => {
|
|
|
44
44
|
slots,
|
|
45
45
|
slotProps,
|
|
46
46
|
disableKeyboardNavigation,
|
|
47
|
+
focusItemOnClick,
|
|
47
48
|
brushConfig,
|
|
48
49
|
onHiddenItemsChange,
|
|
49
50
|
hiddenItems,
|
|
@@ -86,6 +87,7 @@ export const useChartsContainerProps = props => {
|
|
|
86
87
|
seriesConfig,
|
|
87
88
|
experimentalFeatures,
|
|
88
89
|
disableKeyboardNavigation,
|
|
90
|
+
focusItemOnClick,
|
|
89
91
|
brushConfig,
|
|
90
92
|
onHiddenItemsChange,
|
|
91
93
|
hiddenItems,
|
|
@@ -110,21 +110,14 @@ process.env.NODE_ENV !== "production" ? DefaultContent.propTypes /* remove-propt
|
|
|
110
110
|
* Override or extend the styles applied to the component.
|
|
111
111
|
*/
|
|
112
112
|
classes: _propTypes.default.object,
|
|
113
|
-
item: _propTypes.default
|
|
113
|
+
item: _propTypes.default /* @typescript-to-proptypes-ignore */.shape({
|
|
114
114
|
color: _propTypes.default.string.isRequired,
|
|
115
115
|
formattedLabel: _propTypes.default.string,
|
|
116
116
|
formattedValue: _propTypes.default.string.isRequired,
|
|
117
117
|
markShape: _propTypes.default.oneOf(['circle', 'cross', 'diamond', 'square', 'star', 'triangle', 'wye']),
|
|
118
118
|
markType: _propTypes.default.oneOfType([_propTypes.default.oneOf(['circle', 'line', 'line+mark', 'square']), _propTypes.default.func]),
|
|
119
119
|
seriesId: _propTypes.default.string.isRequired,
|
|
120
|
-
value: _propTypes.default.
|
|
121
|
-
colorValue: _propTypes.default.any,
|
|
122
|
-
id: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]),
|
|
123
|
-
sizeValue: _propTypes.default.any,
|
|
124
|
-
x: _propTypes.default.number.isRequired,
|
|
125
|
-
y: _propTypes.default.number.isRequired,
|
|
126
|
-
z: _propTypes.default.any
|
|
127
|
-
})])
|
|
120
|
+
value: _propTypes.default.any
|
|
128
121
|
}).isRequired
|
|
129
122
|
} : void 0;
|
|
130
123
|
process.env.NODE_ENV !== "production" ? ChartsAxisTooltipContent.propTypes /* remove-proptypes */ = {
|
|
@@ -104,21 +104,14 @@ process.env.NODE_ENV !== "production" ? DefaultContent.propTypes /* remove-propt
|
|
|
104
104
|
* Override or extend the styles applied to the component.
|
|
105
105
|
*/
|
|
106
106
|
classes: PropTypes.object,
|
|
107
|
-
item: PropTypes
|
|
107
|
+
item: PropTypes /* @typescript-to-proptypes-ignore */.shape({
|
|
108
108
|
color: PropTypes.string.isRequired,
|
|
109
109
|
formattedLabel: PropTypes.string,
|
|
110
110
|
formattedValue: PropTypes.string.isRequired,
|
|
111
111
|
markShape: PropTypes.oneOf(['circle', 'cross', 'diamond', 'square', 'star', 'triangle', 'wye']),
|
|
112
112
|
markType: PropTypes.oneOfType([PropTypes.oneOf(['circle', 'line', 'line+mark', 'square']), PropTypes.func]),
|
|
113
113
|
seriesId: PropTypes.string.isRequired,
|
|
114
|
-
value: PropTypes.
|
|
115
|
-
colorValue: PropTypes.any,
|
|
116
|
-
id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
117
|
-
sizeValue: PropTypes.any,
|
|
118
|
-
x: PropTypes.number.isRequired,
|
|
119
|
-
y: PropTypes.number.isRequired,
|
|
120
|
-
z: PropTypes.any
|
|
121
|
-
})])
|
|
114
|
+
value: PropTypes.any
|
|
122
115
|
}).isRequired
|
|
123
116
|
} : void 0;
|
|
124
117
|
process.env.NODE_ENV !== "production" ? ChartsAxisTooltipContent.propTypes /* remove-proptypes */ = {
|
|
@@ -180,13 +180,13 @@ process.env.NODE_ENV !== "production" ? DefaultSingleValueContent.propTypes /* r
|
|
|
180
180
|
* Override or extend the styles applied to the component.
|
|
181
181
|
*/
|
|
182
182
|
classes: _propTypes.default.object,
|
|
183
|
-
item: _propTypes.default
|
|
183
|
+
item: _propTypes.default /* @typescript-to-proptypes-ignore */.shape({
|
|
184
184
|
color: _propTypes.default.string.isRequired,
|
|
185
185
|
formattedValue: _propTypes.default.any.isRequired,
|
|
186
186
|
identifier: _propTypes.default.shape({
|
|
187
187
|
dataIndex: _propTypes.default.number,
|
|
188
188
|
seriesId: _propTypes.default.string.isRequired,
|
|
189
|
-
type: _propTypes.default.
|
|
189
|
+
type: _propTypes.default.string.isRequired
|
|
190
190
|
}).isRequired,
|
|
191
191
|
label: _propTypes.default.string,
|
|
192
192
|
markShape: _propTypes.default.oneOf(['circle', 'cross', 'diamond', 'square', 'star', 'triangle', 'wye']),
|
|
@@ -173,13 +173,13 @@ process.env.NODE_ENV !== "production" ? DefaultSingleValueContent.propTypes /* r
|
|
|
173
173
|
* Override or extend the styles applied to the component.
|
|
174
174
|
*/
|
|
175
175
|
classes: PropTypes.object,
|
|
176
|
-
item: PropTypes
|
|
176
|
+
item: PropTypes /* @typescript-to-proptypes-ignore */.shape({
|
|
177
177
|
color: PropTypes.string.isRequired,
|
|
178
178
|
formattedValue: PropTypes.any.isRequired,
|
|
179
179
|
identifier: PropTypes.shape({
|
|
180
180
|
dataIndex: PropTypes.number,
|
|
181
181
|
seriesId: PropTypes.string.isRequired,
|
|
182
|
-
type: PropTypes.
|
|
182
|
+
type: PropTypes.string.isRequired
|
|
183
183
|
}).isRequired,
|
|
184
184
|
label: PropTypes.string,
|
|
185
185
|
markShape: PropTypes.oneOf(['circle', 'cross', 'diamond', 'square', 'star', 'triangle', 'wye']),
|
|
@@ -181,6 +181,10 @@ function ChartsTooltipContainer(inProps) {
|
|
|
181
181
|
toJSON: () => ''
|
|
182
182
|
})
|
|
183
183
|
}), [positionRef]);
|
|
184
|
+
|
|
185
|
+
// `anchorEl` is only set once the portal below is mounted. Rendering the popper
|
|
186
|
+
// without an anchor makes Popper warn about an invalid `anchorEl`.
|
|
187
|
+
const tooltipAnchorEl = itemPosition ? anchorEl : pointerAnchorEl;
|
|
184
188
|
const isMouse = pointerType === 'mouse' || isFineMainPointer;
|
|
185
189
|
const isTouch = pointerType === 'touch' || !isFineMainPointer;
|
|
186
190
|
const modifiers = React.useMemo(() => [{
|
|
@@ -226,14 +230,14 @@ function ChartsTooltipContainer(inProps) {
|
|
|
226
230
|
height: 1
|
|
227
231
|
}
|
|
228
232
|
}), chartsLayerContainerRef.current), /*#__PURE__*/(0, _jsxRuntime.jsx)(_NoSsr.default, {
|
|
229
|
-
children: isOpen && /*#__PURE__*/(0, _react.createElement)(ChartsTooltipRoot, (0, _extends2.default)({}, other, {
|
|
233
|
+
children: isOpen && tooltipAnchorEl && /*#__PURE__*/(0, _react.createElement)(ChartsTooltipRoot, (0, _extends2.default)({}, other, {
|
|
230
234
|
// The key is here to make sure the tooltip uses the new anchor immediately.
|
|
231
235
|
key: itemPosition ? 'charts-anchored' : 'charts-pointer',
|
|
232
236
|
className: classes?.root,
|
|
233
237
|
open: isOpen,
|
|
234
238
|
placement: other.placement ?? position ?? (!isTooltipNodeAnchored && isMouse ? 'right-start' : 'top'),
|
|
235
239
|
popperRef: popperRef,
|
|
236
|
-
anchorEl:
|
|
240
|
+
anchorEl: tooltipAnchorEl,
|
|
237
241
|
modifiers: modifiers,
|
|
238
242
|
container: other.container ?? chartsLayerContainerRef.current,
|
|
239
243
|
popperOptions: (0, _extends2.default)({}, other.popperOptions, {
|
|
@@ -174,6 +174,10 @@ function ChartsTooltipContainer(inProps) {
|
|
|
174
174
|
toJSON: () => ''
|
|
175
175
|
})
|
|
176
176
|
}), [positionRef]);
|
|
177
|
+
|
|
178
|
+
// `anchorEl` is only set once the portal below is mounted. Rendering the popper
|
|
179
|
+
// without an anchor makes Popper warn about an invalid `anchorEl`.
|
|
180
|
+
const tooltipAnchorEl = itemPosition ? anchorEl : pointerAnchorEl;
|
|
177
181
|
const isMouse = pointerType === 'mouse' || isFineMainPointer;
|
|
178
182
|
const isTouch = pointerType === 'touch' || !isFineMainPointer;
|
|
179
183
|
const modifiers = React.useMemo(() => [{
|
|
@@ -219,14 +223,14 @@ function ChartsTooltipContainer(inProps) {
|
|
|
219
223
|
height: 1
|
|
220
224
|
}
|
|
221
225
|
}), chartsLayerContainerRef.current), /*#__PURE__*/_jsx(NoSsr, {
|
|
222
|
-
children: isOpen && /*#__PURE__*/_createElement(ChartsTooltipRoot, _extends({}, other, {
|
|
226
|
+
children: isOpen && tooltipAnchorEl && /*#__PURE__*/_createElement(ChartsTooltipRoot, _extends({}, other, {
|
|
223
227
|
// The key is here to make sure the tooltip uses the new anchor immediately.
|
|
224
228
|
key: itemPosition ? 'charts-anchored' : 'charts-pointer',
|
|
225
229
|
className: classes?.root,
|
|
226
230
|
open: isOpen,
|
|
227
231
|
placement: other.placement ?? position ?? (!isTooltipNodeAnchored && isMouse ? 'right-start' : 'top'),
|
|
228
232
|
popperRef: popperRef,
|
|
229
|
-
anchorEl:
|
|
233
|
+
anchorEl: tooltipAnchorEl,
|
|
230
234
|
modifiers: modifiers,
|
|
231
235
|
container: other.container ?? chartsLayerContainerRef.current,
|
|
232
236
|
popperOptions: _extends({}, other.popperOptions, {
|
|
@@ -16,6 +16,7 @@ var _useAxis = require("../hooks/useAxis");
|
|
|
16
16
|
var _defaultTextPlacement = require("../ChartsText/defaultTextPlacement");
|
|
17
17
|
var _invertTextAnchor = require("../internals/invertTextAnchor");
|
|
18
18
|
var _utilities = require("./utilities");
|
|
19
|
+
var _constants = require("../constants");
|
|
19
20
|
const _excluded = ["scale", "tickNumber", "reverse"];
|
|
20
21
|
function useAxisTicksProps(inProps) {
|
|
21
22
|
const {
|
|
@@ -57,7 +58,7 @@ function useAxisTicksProps(inProps) {
|
|
|
57
58
|
// @ts-expect-error `useSlotProps` applies `WithCommonProps` with adds a `style: React.CSSProperties` prop automatically.
|
|
58
59
|
additionalProps: {
|
|
59
60
|
style: (0, _extends2.default)({}, theme.typography.caption, {
|
|
60
|
-
fontSize:
|
|
61
|
+
fontSize: _constants.DEFAULT_TICK_LABEL_FONT_SIZE,
|
|
61
62
|
lineHeight: 1.25,
|
|
62
63
|
textAnchor: isRtl ? (0, _invertTextAnchor.invertTextAnchor)(defaultTextAnchor) : defaultTextAnchor,
|
|
63
64
|
dominantBaseline: defaultDominantBaseline
|
|
@@ -11,6 +11,7 @@ import { useXAxes } from "../hooks/useAxis.mjs";
|
|
|
11
11
|
import { getDefaultBaseline, getDefaultTextAnchor } from "../ChartsText/defaultTextPlacement.mjs";
|
|
12
12
|
import { invertTextAnchor } from "../internals/invertTextAnchor.mjs";
|
|
13
13
|
import { defaultProps, useUtilityClasses } from "./utilities.mjs";
|
|
14
|
+
import { DEFAULT_TICK_LABEL_FONT_SIZE } from "../constants/index.mjs";
|
|
14
15
|
export function useAxisTicksProps(inProps) {
|
|
15
16
|
const {
|
|
16
17
|
xAxis,
|
|
@@ -51,7 +52,7 @@ export function useAxisTicksProps(inProps) {
|
|
|
51
52
|
// @ts-expect-error `useSlotProps` applies `WithCommonProps` with adds a `style: React.CSSProperties` prop automatically.
|
|
52
53
|
additionalProps: {
|
|
53
54
|
style: _extends({}, theme.typography.caption, {
|
|
54
|
-
fontSize:
|
|
55
|
+
fontSize: DEFAULT_TICK_LABEL_FONT_SIZE,
|
|
55
56
|
lineHeight: 1.25,
|
|
56
57
|
textAnchor: isRtl ? invertTextAnchor(defaultTextAnchor) : defaultTextAnchor,
|
|
57
58
|
dominantBaseline: defaultDominantBaseline
|