@mui/x-date-pickers-pro 8.0.0-alpha.2 → 8.0.0-alpha.4
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/CHANGELOG.md +376 -0
- package/DateRangePicker/DateRangePickerToolbar.js +7 -9
- package/DateTimeRangePicker/DateTimeRangePickerToolbar.d.ts +1 -2
- package/DateTimeRangePicker/DateTimeRangePickerToolbar.js +32 -57
- package/DesktopDateTimeRangePicker/DesktopDateTimeRangePicker.js +1 -2
- package/MobileDateTimeRangePicker/MobileDateTimeRangePicker.js +1 -2
- package/README.md +1 -1
- package/SingleInputDateRangeField/useSingleInputDateRangeField.d.ts +1 -1
- package/SingleInputDateTimeRangeField/useSingleInputDateTimeRangeField.d.ts +1 -1
- package/SingleInputTimeRangeField/useSingleInputTimeRangeField.d.ts +1 -1
- package/index.js +1 -1
- package/internals/hooks/models/useRangePicker.d.ts +2 -2
- package/internals/utils/releaseInfo.js +1 -1
- package/modern/DateRangePicker/DateRangePickerToolbar.js +7 -9
- package/modern/DateTimeRangePicker/DateTimeRangePickerToolbar.js +32 -57
- package/modern/DesktopDateTimeRangePicker/DesktopDateTimeRangePicker.js +1 -2
- package/modern/MobileDateTimeRangePicker/MobileDateTimeRangePicker.js +1 -2
- package/modern/index.js +1 -1
- package/modern/internals/utils/releaseInfo.js +1 -1
- package/node/DateRangePicker/DateRangePickerToolbar.js +6 -8
- package/node/DateTimeRangePicker/DateTimeRangePickerToolbar.js +31 -56
- package/node/DesktopDateTimeRangePicker/DesktopDateTimeRangePicker.js +1 -2
- package/node/MobileDateTimeRangePicker/MobileDateTimeRangePicker.js +1 -2
- package/node/index.js +1 -1
- package/node/internals/utils/releaseInfo.js +1 -1
- package/package.json +3 -3
package/CHANGELOG.md
CHANGED
|
@@ -5,6 +5,235 @@
|
|
|
5
5
|
All notable changes to this project will be documented in this file.
|
|
6
6
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
7
7
|
|
|
8
|
+
## 8.0.0-alpha.4
|
|
9
|
+
|
|
10
|
+
_Dec 13, 2024_
|
|
11
|
+
|
|
12
|
+
We'd like to offer a big thanks to the 11 contributors who made this release possible. Here are some highlights ✨:
|
|
13
|
+
|
|
14
|
+
- 🌍 Improve Romanian locale on the Data Grid and Pickers
|
|
15
|
+
- 📚 Documentation improvements
|
|
16
|
+
- 🐞 Bugfixes
|
|
17
|
+
|
|
18
|
+
Special thanks go out to the community contributors who have helped make this release possible:
|
|
19
|
+
@k-rajat19, @nusr, @rares985, @zivl.
|
|
20
|
+
Following are all team members who have contributed to this release:
|
|
21
|
+
@alexfauquette, @arminmeh, @flaviendelangle, @JCQuintas, @KenanYusuf, @LukasTy, @MBilalShafi.
|
|
22
|
+
|
|
23
|
+
<!--/ HIGHLIGHT_ABOVE_SEPARATOR /-->
|
|
24
|
+
|
|
25
|
+
### Data Grid
|
|
26
|
+
|
|
27
|
+
#### Breaking changes
|
|
28
|
+
|
|
29
|
+
- The selectors signature has been updated due to the support of arguments in the selectors. Pass `undefined` as `arguments` if the selector doesn't use any arguments.
|
|
30
|
+
|
|
31
|
+
```diff
|
|
32
|
+
-mySelector(state, instanceId)
|
|
33
|
+
+mySelector(state, arguments, instanceId)
|
|
34
|
+
```
|
|
35
|
+
|
|
36
|
+
- The `useGridSelector` signature has been updated due to the introduction of arguments parameter in the selectors. Pass `undefined` as `arguments` if the selector doesn't use any arguments.
|
|
37
|
+
|
|
38
|
+
```diff
|
|
39
|
+
-const output = useGridSelector(apiRef, selector, equals)
|
|
40
|
+
+const output = useGridSelector(apiRef, selector, arguments, equals)
|
|
41
|
+
```
|
|
42
|
+
- The default variant for text fields and selects in the filter panel has been changed to `outlined`.
|
|
43
|
+
- The "row spanning" feature is now stable.
|
|
44
|
+
```diff
|
|
45
|
+
<DataGrid
|
|
46
|
+
- unstable_rowSpanning
|
|
47
|
+
+ rowSpanning
|
|
48
|
+
/>
|
|
49
|
+
```
|
|
50
|
+
- Selected row is now deselected when clicked again.
|
|
51
|
+
|
|
52
|
+
#### `@mui/x-data-grid@8.0.0-alpha.4`
|
|
53
|
+
|
|
54
|
+
- [DataGrid] Deselect selected row on click (#15509) @k-rajat19
|
|
55
|
+
- [DataGrid] Fix "No rows" displaying when all rows are pinned (#15335) @nusr
|
|
56
|
+
- [DataGrid] Make row spanning feature stable (#15742) @MBilalShafi
|
|
57
|
+
- [DataGrid] Round dimensions to avoid subpixel rendering error (#15850) @KenanYusuf
|
|
58
|
+
- [DataGrid] Toggle menu on click in `<GridActionsCell />` (#15867) @k-rajat19
|
|
59
|
+
- [DataGrid] Trigger row spanning computation on rows update (#15858) @MBilalShafi
|
|
60
|
+
- [DataGrid] Update filter panel input variant (#15807) @KenanYusuf
|
|
61
|
+
- [DataGrid] Use `columnsManagement` slot (#15817) @k-rajat19
|
|
62
|
+
- [DataGrid] Use new selector signature (#15200) @MBilalShafi
|
|
63
|
+
- [l10n] Improve Romanian (ro-RO) locale (#15745) @rares985
|
|
64
|
+
|
|
65
|
+
#### `@mui/x-data-grid-pro@8.0.0-alpha.4` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
66
|
+
|
|
67
|
+
Same changes as in `@mui/x-data-grid@8.0.0-alpha.4`, plus:
|
|
68
|
+
|
|
69
|
+
- [DataGridPro] Make row reordering work with pagination (#15355) @k-rajat19
|
|
70
|
+
|
|
71
|
+
#### `@mui/x-data-grid-premium@8.0.0-alpha.4` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
72
|
+
|
|
73
|
+
Same changes as in `@mui/x-data-grid-pro@8.0.0-alpha.4`, plus:
|
|
74
|
+
|
|
75
|
+
- [DataGridPremium] Fix group column ignoring `valueOptions` for `singleSelect` column type (#15739) @arminmeh
|
|
76
|
+
|
|
77
|
+
### Date and Time Pickers
|
|
78
|
+
|
|
79
|
+
#### `@mui/x-date-pickers@8.0.0-alpha.4`
|
|
80
|
+
|
|
81
|
+
- [l10n] Improve Romanian (ro-RO) locale (#15745) @rares985
|
|
82
|
+
- [pickers] Clean `usePicker` logic (#15763) @flaviendelangle
|
|
83
|
+
- [pickers] Rename layout `ownerState` property from `isRtl` to `layoutDirection` (#15803) @flaviendelangle
|
|
84
|
+
- [pickers] Use the new `ownerState` in `useClearableField` (#15776) @flaviendelangle
|
|
85
|
+
- [pickers] Use the new `ownerState` in the toolbar components (#15777) @flaviendelangle
|
|
86
|
+
- [pickers] Use the new `ownerState` object for the clock components and the desktop / mobile wrappers (#15669) @flaviendelangle
|
|
87
|
+
|
|
88
|
+
#### `@mui/x-date-pickers-pro@8.0.0-alpha.4` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
89
|
+
|
|
90
|
+
Same changes as in `@mui/x-date-pickers@8.0.0-alpha.4`.
|
|
91
|
+
|
|
92
|
+
### Charts
|
|
93
|
+
|
|
94
|
+
#### Breaking changes
|
|
95
|
+
|
|
96
|
+
- The default styling of the charts tooltip has been updated.
|
|
97
|
+
|
|
98
|
+
#### `@mui/x-charts@8.0.0-alpha.4`
|
|
99
|
+
|
|
100
|
+
- [charts] Fix hydration missmatch (#15647) @alexfauquette
|
|
101
|
+
- [charts] Fix internal spelling typo (#15805) @zivl
|
|
102
|
+
- [charts] Fix scatter dataset with missing data (#15802) @alexfauquette
|
|
103
|
+
- [charts] HTML Labels (#15813) @JCQuintas
|
|
104
|
+
- [charts] Only access store values by using hooks (#15764) @alexfauquette
|
|
105
|
+
- [charts] Update Tooltip style (#15630) @alexfauquette
|
|
106
|
+
|
|
107
|
+
#### `@mui/x-charts-pro@8.0.0-alpha.4` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
108
|
+
|
|
109
|
+
Same changes as in `@mui/x-charts@8.0.0-alpha.4`.
|
|
110
|
+
|
|
111
|
+
### Tree View
|
|
112
|
+
|
|
113
|
+
#### `@mui/x-tree-view@8.0.0-alpha.4`
|
|
114
|
+
|
|
115
|
+
No changes, releasing to keep the versions in sync.
|
|
116
|
+
|
|
117
|
+
#### `@mui/x-tree-view-pro@8.0.0-alpha.4` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
118
|
+
|
|
119
|
+
Releasing to benefit from license package fix (#15814).
|
|
120
|
+
|
|
121
|
+
### Docs
|
|
122
|
+
|
|
123
|
+
- [docs] Clean Joy and Browser custom field demos (#15707) @flaviendelangle
|
|
124
|
+
- [docs] Fix outdated link to handbook (#15855) @oliviertassinari
|
|
125
|
+
- [docs] Improve Pickers accessible DOM migration section description (#15596) @LukasTy
|
|
126
|
+
- [docs] Use `updateRows` method for list view demos (#15732) @KenanYusuf
|
|
127
|
+
- [docs] Use date library version from package dev dependencies for sandboxes (#15762) @LukasTy
|
|
128
|
+
|
|
129
|
+
### Core
|
|
130
|
+
|
|
131
|
+
- [code-infra] Add Charts sandbox generation (#15830) @JCQuintas
|
|
132
|
+
- [code-infra] Remove redundant `@type/react-test-renderer` dep (#15766) @LukasTy
|
|
133
|
+
- [license] Use `console.log` for the error message on Codesandbox to avoid rendering error (#15814) @arminmeh
|
|
134
|
+
|
|
135
|
+
## 8.0.0-alpha.3
|
|
136
|
+
|
|
137
|
+
_Dec 5, 2024_
|
|
138
|
+
|
|
139
|
+
We'd like to offer a big thanks to the 9 contributors who made this release possible. Here are some highlights ✨:
|
|
140
|
+
|
|
141
|
+
- 💫 Support [Server-side lazy loading](https://mui.com/x/react-data-grid/server-side-data/lazy-loading/) on the Data Grid. Use [data source](https://mui.com/x/react-data-grid/server-side-data/#data-source) to fetch a range of rows on demand and update the rows in the same way as described in [Infinite loading](https://mui.com/x/react-data-grid/row-updates/#infinite-loading) and [Lazy loading](https://mui.com/x/react-data-grid/row-updates/#lazy-loading) without the need to use any additional event listeners and callbacks.
|
|
142
|
+
- 🎯 Improved [data caching](https://mui.com/x/react-data-grid/server-side-data/#data-caching). Check out our [recommendations](https://mui.com/x/react-data-grid/server-side-data/#improving-the-cache-hit-rate) for improving the cache hit rate.
|
|
143
|
+
|
|
144
|
+
Special thanks go out to the community contributors who have helped make this release possible:
|
|
145
|
+
@ihsanberkozcan, @k-rajat19, @perezShaked.
|
|
146
|
+
Following are all team members who have contributed to this release:
|
|
147
|
+
@arminmeh, @cherniavskii, @flaviendelangle, @JCQuintas, @MBilalShafi, @noraleonte.
|
|
148
|
+
|
|
149
|
+
<!--/ HIGHLIGHT_ABOVE_SEPARATOR /-->
|
|
150
|
+
|
|
151
|
+
### Data Grid
|
|
152
|
+
|
|
153
|
+
#### Breaking changes
|
|
154
|
+
|
|
155
|
+
- The "Select all" checkbox is now checked when all the selectable rows are selected, ignoring rows that are not selectable because of the `isRowSelectable` prop.
|
|
156
|
+
- The `rowPositionsDebounceMs` prop was removed.
|
|
157
|
+
- The `gridRowsDataRowIdToIdLookupSelector` selector was removed. Use the `gridRowsLookupSelector` selector in combination with the `getRowId()` API method instead.
|
|
158
|
+
```diff
|
|
159
|
+
-const idToIdLookup = gridRowsDataRowIdToIdLookupSelector(apiRef);
|
|
160
|
+
-const rowId = idToIdLookup[id]
|
|
161
|
+
+const rowsLookup = gridRowsLookupSelector(apiRef);
|
|
162
|
+
+const rowId = apiRef.current.getRowId(rowsLookup[id])
|
|
163
|
+
```
|
|
164
|
+
- The Grid is now more aligned with the WAI-ARIA authoring practices and sets the `role` attribute to `treegrid` if the Data Grid is used with row grouping feature.
|
|
165
|
+
|
|
166
|
+
#### `@mui/x-data-grid@8.0.0-alpha.3`
|
|
167
|
+
|
|
168
|
+
- [DataGrid] Fix deselection not working with `isRowSelectable` (#15692) @MBilalShafi
|
|
169
|
+
- [DataGrid] Make column autosizing work with flex columns (#15465) @cherniavskii
|
|
170
|
+
- [DataGrid] Remove `gridRowsDataRowIdToIdLookupSelector` selector (#15698) @arminmeh
|
|
171
|
+
- [DataGrid] Remove `rowPositionsDebounceMs` prop (#15482) @k-rajat19
|
|
172
|
+
- [l10n] Improve Hebrew (he-IL) locale (#15699) @perezShaked
|
|
173
|
+
- [l10n] Improve Turkish (tr-TR) locale (#15734) @ihsanberkozcan
|
|
174
|
+
|
|
175
|
+
#### `@mui/x-data-grid-pro@8.0.0-alpha.3` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
176
|
+
|
|
177
|
+
Same changes as in `@mui/x-data-grid@8.0.0-alpha.3`, plus:
|
|
178
|
+
|
|
179
|
+
- [DataGridPro] Cleanup pinned rows on removal (#15697) @cherniavskii
|
|
180
|
+
- [DataGridPro] Server-side lazy loading (#13878) @arminmeh
|
|
181
|
+
|
|
182
|
+
#### `@mui/x-data-grid-premium@8.0.0-alpha.3` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
183
|
+
|
|
184
|
+
Same changes as in `@mui/x-data-grid-pro@8.0.0-alpha.3`, plus:
|
|
185
|
+
|
|
186
|
+
- [DataGridPremium] Remove the `ariaV8` experimental flag (#15694) @arminmeh
|
|
187
|
+
|
|
188
|
+
### Date and Time Pickers
|
|
189
|
+
|
|
190
|
+
#### Breaking changes
|
|
191
|
+
|
|
192
|
+
- The `onOpen()` and `onClose()` methods of the `usePickerContext()` hook have been replaced with a single `setOpen` method — [Learn more](https://next.mui.com/x/migration/migration-pickers-v7/#usepickercontext).
|
|
193
|
+
|
|
194
|
+
#### `@mui/x-date-pickers@8.0.0-alpha.3`
|
|
195
|
+
|
|
196
|
+
- [pickers] Replace the `onOpen()` and `onClose()` methods of `usePickerContext()` with a single `setOpen()` method. (#15701) @flaviendelangle
|
|
197
|
+
|
|
198
|
+
#### `@mui/x-date-pickers-pro@8.0.0-alpha.3` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
199
|
+
|
|
200
|
+
Same changes as in `@mui/x-date-pickers@8.0.0-alpha.3`.
|
|
201
|
+
|
|
202
|
+
### Charts
|
|
203
|
+
|
|
204
|
+
#### `@mui/x-charts@8.0.0-alpha.3`
|
|
205
|
+
|
|
206
|
+
- [charts] Improve SVG `pattern` and `gradient` support (#15720) @JCQuintas
|
|
207
|
+
|
|
208
|
+
#### `@mui/x-charts-pro@8.0.0-alpha.3` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
209
|
+
|
|
210
|
+
Same changes as in `@mui/x-charts@8.0.0-alpha.3`.
|
|
211
|
+
|
|
212
|
+
### Tree View
|
|
213
|
+
|
|
214
|
+
#### `@mui/x-tree-view@8.0.0-alpha.3`
|
|
215
|
+
|
|
216
|
+
No changes since `@mui/x-tree-view-pro@v8.0.0-alpha.2`.
|
|
217
|
+
|
|
218
|
+
#### `@mui/x-tree-view-pro@8.0.0-alpha.3` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
219
|
+
|
|
220
|
+
Same changes as in `@mui/x-tree-view@8.0.0-alpha.3`.
|
|
221
|
+
|
|
222
|
+
### Docs
|
|
223
|
+
|
|
224
|
+
- [docs] Add a customization demo for the Date and Time Pickers overview page (#15118) @noraleonte
|
|
225
|
+
- [docs] Fix typo in charts axis documentation (#15743) @JCQuintas
|
|
226
|
+
- [docs] Improve SEO titles for the Data Grid (#15695) @MBilalShafi
|
|
227
|
+
|
|
228
|
+
### Core
|
|
229
|
+
|
|
230
|
+
- [core] Add `@mui/x-tree-view-pro` to `releaseChangelog` (#15316) @flaviendelangle
|
|
231
|
+
- [code-infra] Lock file maintenance (#11894)
|
|
232
|
+
- [code-infra] Check if `preset-safe` folder exists in codemod test (#15703) @JCQuintas
|
|
233
|
+
- [code-infra] Import Pickers `preset-safe` into global codemod config (#15659) @JCQuintas
|
|
234
|
+
- [code-infra] Playwright 1.49 (#15493) @JCQuintas
|
|
235
|
+
- [test] Force hover in headless Chrome (#15710) @cherniavskii
|
|
236
|
+
|
|
8
237
|
## v8.0.0-alpha.2
|
|
9
238
|
|
|
10
239
|
_Nov 29, 2024_
|
|
@@ -465,6 +694,153 @@ Same changes as in `@mui/x-charts@8.0.0-alpha.0`.
|
|
|
465
694
|
- [release] v8 preparation (#15054) @michelengelen
|
|
466
695
|
- [test] Fix advanced list view regression test snapshot (#15260) @KenanYusuf
|
|
467
696
|
|
|
697
|
+
## 7.23.2
|
|
698
|
+
|
|
699
|
+
_Dec 12, 2024_
|
|
700
|
+
|
|
701
|
+
We'd like to offer a big thanks to the 11 contributors who made this release possible. Here are some highlights ✨:
|
|
702
|
+
|
|
703
|
+
- 🌍 Improve Romanian and Turkish locales on the Data Grid
|
|
704
|
+
- 🌍 Improve Romanian locale on the Pickers
|
|
705
|
+
- 📚 Documentation improvements
|
|
706
|
+
- 🐞 Bugfixes
|
|
707
|
+
|
|
708
|
+
Special thanks go out to the community contributors who have helped make this release possible:
|
|
709
|
+
@ihsanberkozcan, @k-rajat19, @lhilgert9, @nusr, @rares985.
|
|
710
|
+
|
|
711
|
+
Following are all team members who have contributed to this release:
|
|
712
|
+
@alexfauquette, @arminmeh, @flaviendelangle, @JCQuintas, @KenanYusuf, @LukasTy.
|
|
713
|
+
|
|
714
|
+
<!--/ HIGHLIGHT_ABOVE_SEPARATOR /-->
|
|
715
|
+
|
|
716
|
+
### Data Grid
|
|
717
|
+
|
|
718
|
+
#### `@mui/x-data-grid@7.23.2`
|
|
719
|
+
|
|
720
|
+
- [DataGrid] Fix "No rows" displaying when all rows are pinned (#15851) @nusr
|
|
721
|
+
- [DataGrid] Use `columnsManagement` slot (#15821) @k-rajat19
|
|
722
|
+
- [l10n] Improve Romanian (ro-RO) locale (#15751) @rares985
|
|
723
|
+
- [l10n] Improve Turkish (tr-TR) locale (#15748) @ihsanberkozcan
|
|
724
|
+
|
|
725
|
+
#### `@mui/x-data-grid-pro@7.23.2` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
726
|
+
|
|
727
|
+
Same changes as in `@mui/x-data-grid@7.23.2`, plus:
|
|
728
|
+
|
|
729
|
+
- [DataGridPro] Make Row reordering work with pagination (#15782) @k-rajat19
|
|
730
|
+
|
|
731
|
+
#### `@mui/x-data-grid-premium@7.23.2` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
732
|
+
|
|
733
|
+
Same changes as in `@mui/x-data-grid-pro@7.23.2`, plus:
|
|
734
|
+
|
|
735
|
+
- [DataGridPremium] Fix group column ignoring `valueOptions` for `singleSelect` column type (#15754) @arminmeh
|
|
736
|
+
|
|
737
|
+
### Date and Time Pickers
|
|
738
|
+
|
|
739
|
+
#### `@mui/x-date-pickers@7.23.2`
|
|
740
|
+
|
|
741
|
+
- [l10n] Improve Romanian (ro-RO) locale (#15751) @rares985
|
|
742
|
+
|
|
743
|
+
#### `@mui/x-date-pickers-pro@7.23.2` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
744
|
+
|
|
745
|
+
Same changes as in `@mui/x-date-pickers@7.23.2`.
|
|
746
|
+
|
|
747
|
+
### Charts
|
|
748
|
+
|
|
749
|
+
#### `@mui/x-charts@7.23.2`
|
|
750
|
+
|
|
751
|
+
- [charts] Fix key generation for the ChartsGrid (#15864) @alexfauquette
|
|
752
|
+
- [charts] Fix scatter dataset with missing data (#15804) @alexfauquette
|
|
753
|
+
|
|
754
|
+
#### `@mui/x-charts-pro@7.23.2` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
755
|
+
|
|
756
|
+
Same changes as in `@mui/x-charts@7.23.2`.
|
|
757
|
+
|
|
758
|
+
#### `@mui/x-tree-view@v7.23.2`
|
|
759
|
+
|
|
760
|
+
No changes, releasing to keep the versions in sync.
|
|
761
|
+
|
|
762
|
+
#### `@mui/x-tree-view-pro@7.23.2` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
763
|
+
|
|
764
|
+
Releasing to benefit from license package fix (#15818).
|
|
765
|
+
|
|
766
|
+
### Docs
|
|
767
|
+
|
|
768
|
+
- [docs] Fix typo in charts axis documentation (#15746) @JCQuintas
|
|
769
|
+
- [docs] Improve Pickers accessible DOM structure description (#15752) @LukasTy
|
|
770
|
+
- [docs] Use `updateRows` method for list view demos (#15824) @KenanYusuf
|
|
771
|
+
- [docs] Use date library version from package dev dependencies for sandboxes (#15767) @LukasTy
|
|
772
|
+
|
|
773
|
+
### Core
|
|
774
|
+
|
|
775
|
+
- [core] Add `@mui/x-tree-view-pro` to `releaseChangelog` (#15747) @flaviendelangle
|
|
776
|
+
- [license] Use `console.log` for the error message on Codesandbox to avoid rendering error (#15818) @arminmeh
|
|
777
|
+
|
|
778
|
+
## 7.23.1
|
|
779
|
+
|
|
780
|
+
_Dec 5, 2024_
|
|
781
|
+
|
|
782
|
+
We'd like to offer a big thanks to the 7 contributors who made this release possible. Here are some highlights ✨:
|
|
783
|
+
|
|
784
|
+
- 🌍 Improve German locale on the Data Grid component
|
|
785
|
+
- 🐞 Bugfixes
|
|
786
|
+
|
|
787
|
+
Special thanks go out to the community contributors who have helped make this release possible:
|
|
788
|
+
@lhilgert9.
|
|
789
|
+
|
|
790
|
+
Following are all team members who have contributed to this release:
|
|
791
|
+
@arthurbalduini, @cherniavskii, @flaviendelangle, @JCQuintas, @LukasTy and @MBilalShafi.
|
|
792
|
+
|
|
793
|
+
<!--/ HIGHLIGHT_ABOVE_SEPARATOR /-->
|
|
794
|
+
|
|
795
|
+
### Data Grid
|
|
796
|
+
|
|
797
|
+
#### `@mui/x-data-grid@7.23.1`
|
|
798
|
+
|
|
799
|
+
- [DataGrid] Make column autosizing work with flex columns (#15712) @cherniavskii
|
|
800
|
+
- [l10n] Improve German (de-DE) locale (#15641) @lhilgert9
|
|
801
|
+
|
|
802
|
+
#### `@mui/x-data-grid-pro@7.23.1` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
803
|
+
|
|
804
|
+
Same changes as in `@mui/x-data-grid@7.23.1`, plus:
|
|
805
|
+
|
|
806
|
+
- [DataGridPro] Cleanup pinned rows on removal (#15702) @cherniavskii
|
|
807
|
+
|
|
808
|
+
#### `@mui/x-data-grid-premium@7.23.1` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
809
|
+
|
|
810
|
+
Same changes as in `@mui/x-data-grid-pro@7.23.1`.
|
|
811
|
+
|
|
812
|
+
### Date and Time Pickers
|
|
813
|
+
|
|
814
|
+
#### `@mui/x-date-pickers@7.23.1`
|
|
815
|
+
|
|
816
|
+
- [TimePicker] Prevent mouse events after `touchend` event (#15430) @arthurbalduini
|
|
817
|
+
|
|
818
|
+
#### `@mui/x-date-pickers-pro@7.23.1` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
819
|
+
|
|
820
|
+
Same changes as in `@mui/x-date-pickers@7.23.1`.
|
|
821
|
+
|
|
822
|
+
### Charts
|
|
823
|
+
|
|
824
|
+
#### `@mui/x-charts@7.23.1`
|
|
825
|
+
|
|
826
|
+
- [charts] Improve SVG `pattern` and `gradient` support (#15724) @JCQuintas
|
|
827
|
+
|
|
828
|
+
#### `@mui/x-charts-pro@7.23.1` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
829
|
+
|
|
830
|
+
Same changes as in `@mui/x-charts@7.23.1`.
|
|
831
|
+
|
|
832
|
+
### Docs
|
|
833
|
+
|
|
834
|
+
- [docs] Fix Pickers theme augmentation example (#15675) @LukasTy
|
|
835
|
+
- [docs] Remove duplicated warning (#15715) @cherniavskii
|
|
836
|
+
- [test] Force hover in headless Chrome (#15711) @cherniavskii
|
|
837
|
+
- [docs-infra] Bump `@mui/internal-markdown` to support nested demo imports (#15738) @alexfauquette
|
|
838
|
+
- [docs] Improve SEO titles for the Data Grid (#15695) @MBilalShafi
|
|
839
|
+
|
|
840
|
+
### Core
|
|
841
|
+
|
|
842
|
+
- [core] Add `@mui/x-tree-view-pro` to `releaseChangelog` (#15747) @flaviendelangle
|
|
843
|
+
|
|
468
844
|
## 7.23.0
|
|
469
845
|
|
|
470
846
|
_Nov 29, 2024_
|
|
@@ -2,21 +2,18 @@
|
|
|
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 = ["value", "rangePosition", "onRangePositionChange", "toolbarFormat", "className", "onViewChange", "view", "views"];
|
|
5
|
+
const _excluded = ["value", "rangePosition", "onRangePositionChange", "toolbarFormat", "className", "classes", "onViewChange", "view", "views"];
|
|
6
6
|
import * as React from 'react';
|
|
7
7
|
import PropTypes from 'prop-types';
|
|
8
8
|
import clsx from 'clsx';
|
|
9
9
|
import Typography from '@mui/material/Typography';
|
|
10
10
|
import { styled, useThemeProps } from '@mui/material/styles';
|
|
11
11
|
import composeClasses from '@mui/utils/composeClasses';
|
|
12
|
-
import { PickersToolbar, PickersToolbarButton, useUtils } from '@mui/x-date-pickers/internals';
|
|
12
|
+
import { PickersToolbar, PickersToolbarButton, useUtils, useToolbarOwnerState } from '@mui/x-date-pickers/internals';
|
|
13
13
|
import { usePickerTranslations } from '@mui/x-date-pickers/hooks';
|
|
14
14
|
import { getDateRangePickerToolbarUtilityClass } from "./dateRangePickerToolbarClasses.js";
|
|
15
15
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
16
|
-
const useUtilityClasses =
|
|
17
|
-
const {
|
|
18
|
-
classes
|
|
19
|
-
} = ownerState;
|
|
16
|
+
const useUtilityClasses = classes => {
|
|
20
17
|
const slots = {
|
|
21
18
|
root: ['root'],
|
|
22
19
|
container: ['container']
|
|
@@ -56,14 +53,15 @@ const DateRangePickerToolbar = /*#__PURE__*/React.forwardRef(function DateRangeP
|
|
|
56
53
|
rangePosition,
|
|
57
54
|
onRangePositionChange,
|
|
58
55
|
toolbarFormat,
|
|
59
|
-
className
|
|
56
|
+
className,
|
|
57
|
+
classes: classesProp
|
|
60
58
|
} = props,
|
|
61
59
|
other = _objectWithoutPropertiesLoose(props, _excluded);
|
|
62
60
|
const translations = usePickerTranslations();
|
|
61
|
+
const ownerState = useToolbarOwnerState();
|
|
62
|
+
const classes = useUtilityClasses(classesProp);
|
|
63
63
|
const startDateValue = start ? utils.formatByString(start, toolbarFormat || utils.formats.shortDate) : translations.start;
|
|
64
64
|
const endDateValue = end ? utils.formatByString(end, toolbarFormat || utils.formats.shortDate) : translations.end;
|
|
65
|
-
const ownerState = props;
|
|
66
|
-
const classes = useUtilityClasses(ownerState);
|
|
67
65
|
return /*#__PURE__*/_jsx(DateRangePickerToolbarRoot, _extends({}, other, {
|
|
68
66
|
toolbarTitle: translations.dateRangePickerToolbarTitle,
|
|
69
67
|
isLandscape: false,
|
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import { BaseToolbarProps, ExportedBaseToolbarProps, DateOrTimeViewWithMeridiem,
|
|
2
|
+
import { BaseToolbarProps, ExportedBaseToolbarProps, DateOrTimeViewWithMeridiem, PickerRangeValue } from '@mui/x-date-pickers/internals';
|
|
3
3
|
import { UseRangePositionResponse } from '../internals/hooks/useRangePosition';
|
|
4
4
|
import { DateTimeRangePickerToolbarClasses } from './dateTimeRangePickerToolbarClasses';
|
|
5
5
|
type DateTimeRangeViews = Exclude<DateOrTimeViewWithMeridiem, 'year' | 'month'>;
|
|
6
6
|
export interface DateTimeRangePickerToolbarProps extends BaseToolbarProps<PickerRangeValue, DateTimeRangeViews>, Pick<UseRangePositionResponse, 'rangePosition' | 'onRangePositionChange'>, ExportedDateTimeRangePickerToolbarProps {
|
|
7
7
|
ampm?: boolean;
|
|
8
|
-
toolbarVariant?: PickerVariant;
|
|
9
8
|
}
|
|
10
9
|
export interface ExportedDateTimeRangePickerToolbarProps extends ExportedBaseToolbarProps {
|
|
11
10
|
/**
|
|
@@ -2,22 +2,19 @@
|
|
|
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 = ["value", "rangePosition", "onRangePositionChange", "className", "
|
|
5
|
+
const _excluded = ["value", "rangePosition", "onRangePositionChange", "className", "classes", "onViewChange", "onChange", "classes", "view", "isLandscape", "views", "ampm", "hidden", "toolbarFormat", "toolbarPlaceholder", "titleId", "sx"];
|
|
6
6
|
import * as React from 'react';
|
|
7
7
|
import PropTypes from 'prop-types';
|
|
8
8
|
import clsx from 'clsx';
|
|
9
9
|
import { styled, useThemeProps } from '@mui/material/styles';
|
|
10
10
|
import composeClasses from '@mui/utils/composeClasses';
|
|
11
|
-
import { useUtils } from '@mui/x-date-pickers/internals';
|
|
11
|
+
import { useUtils, useToolbarOwnerState, DateTimePickerToolbarForceDesktopVariant } from '@mui/x-date-pickers/internals';
|
|
12
12
|
import { usePickerContext, usePickerTranslations } from '@mui/x-date-pickers/hooks';
|
|
13
13
|
import { DateTimePickerToolbar } from '@mui/x-date-pickers/DateTimePicker';
|
|
14
14
|
import { getDateTimeRangePickerToolbarUtilityClass } from "./dateTimeRangePickerToolbarClasses.js";
|
|
15
15
|
import { calculateRangeChange } from "../internals/utils/date-range-manager.js";
|
|
16
16
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
17
|
-
const useUtilityClasses =
|
|
18
|
-
const {
|
|
19
|
-
classes
|
|
20
|
-
} = ownerState;
|
|
17
|
+
const useUtilityClasses = classes => {
|
|
21
18
|
const slots = {
|
|
22
19
|
root: ['root'],
|
|
23
20
|
startToolbar: ['startToolbar'],
|
|
@@ -39,36 +36,13 @@ const DateTimeRangePickerToolbarStart = styled(DateTimePickerToolbar, {
|
|
|
39
36
|
overridesResolver: (_, styles) => styles.startToolbar
|
|
40
37
|
})({
|
|
41
38
|
borderBottom: 'none',
|
|
42
|
-
|
|
43
|
-
props: ({
|
|
44
|
-
toolbarVariant
|
|
45
|
-
}) => toolbarVariant !== 'desktop',
|
|
46
|
-
style: {
|
|
47
|
-
padding: '12px 8px 0 12px'
|
|
48
|
-
}
|
|
49
|
-
}, {
|
|
50
|
-
props: {
|
|
51
|
-
toolbarVariant: 'desktop'
|
|
52
|
-
},
|
|
53
|
-
style: {
|
|
54
|
-
paddingBottom: 0
|
|
55
|
-
}
|
|
56
|
-
}]
|
|
39
|
+
paddingBottom: 0
|
|
57
40
|
});
|
|
58
41
|
const DateTimeRangePickerToolbarEnd = styled(DateTimePickerToolbar, {
|
|
59
42
|
name: 'MuiDateTimeRangePickerToolbar',
|
|
60
43
|
slot: 'EndToolbar',
|
|
61
44
|
overridesResolver: (_, styles) => styles.endToolbar
|
|
62
|
-
})({
|
|
63
|
-
variants: [{
|
|
64
|
-
props: ({
|
|
65
|
-
toolbarVariant
|
|
66
|
-
}) => toolbarVariant !== 'desktop',
|
|
67
|
-
style: {
|
|
68
|
-
padding: '12px 8px 12px 12px'
|
|
69
|
-
}
|
|
70
|
-
}]
|
|
71
|
-
});
|
|
45
|
+
})({});
|
|
72
46
|
const DateTimeRangePickerToolbar = /*#__PURE__*/React.forwardRef(function DateTimeRangePickerToolbar(inProps, ref) {
|
|
73
47
|
const props = useThemeProps({
|
|
74
48
|
props: inProps,
|
|
@@ -80,6 +54,7 @@ const DateTimeRangePickerToolbar = /*#__PURE__*/React.forwardRef(function DateTi
|
|
|
80
54
|
rangePosition,
|
|
81
55
|
onRangePositionChange,
|
|
82
56
|
className,
|
|
57
|
+
classes: classesProp,
|
|
83
58
|
onViewChange,
|
|
84
59
|
onChange,
|
|
85
60
|
view,
|
|
@@ -97,6 +72,9 @@ const DateTimeRangePickerToolbar = /*#__PURE__*/React.forwardRef(function DateTi
|
|
|
97
72
|
disabled,
|
|
98
73
|
readOnly
|
|
99
74
|
} = usePickerContext();
|
|
75
|
+
const translations = usePickerTranslations();
|
|
76
|
+
const ownerState = useToolbarOwnerState();
|
|
77
|
+
const classes = useUtilityClasses(classesProp);
|
|
100
78
|
const commonToolbarProps = {
|
|
101
79
|
isLandscape,
|
|
102
80
|
views,
|
|
@@ -107,9 +85,6 @@ const DateTimeRangePickerToolbar = /*#__PURE__*/React.forwardRef(function DateTi
|
|
|
107
85
|
toolbarFormat,
|
|
108
86
|
toolbarPlaceholder
|
|
109
87
|
};
|
|
110
|
-
const translations = usePickerTranslations();
|
|
111
|
-
const ownerState = props;
|
|
112
|
-
const classes = useUtilityClasses(ownerState);
|
|
113
88
|
const handleStartRangeViewChange = React.useCallback(newView => {
|
|
114
89
|
if (newView === 'year' || newView === 'month') {
|
|
115
90
|
return;
|
|
@@ -145,33 +120,34 @@ const DateTimeRangePickerToolbar = /*#__PURE__*/React.forwardRef(function DateTi
|
|
|
145
120
|
if (hidden) {
|
|
146
121
|
return null;
|
|
147
122
|
}
|
|
148
|
-
return /*#__PURE__*/
|
|
123
|
+
return /*#__PURE__*/_jsx(DateTimeRangePickerToolbarRoot, _extends({
|
|
149
124
|
className: clsx(classes.root, className),
|
|
150
125
|
ownerState: ownerState,
|
|
151
126
|
ref: ref,
|
|
152
127
|
sx: sx
|
|
153
128
|
}, other, {
|
|
154
|
-
children:
|
|
155
|
-
value:
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
129
|
+
children: /*#__PURE__*/_jsxs(DateTimePickerToolbarForceDesktopVariant.Provider, {
|
|
130
|
+
value: true,
|
|
131
|
+
children: [/*#__PURE__*/_jsx(DateTimeRangePickerToolbarStart, _extends({
|
|
132
|
+
value: start,
|
|
133
|
+
onViewChange: handleStartRangeViewChange,
|
|
134
|
+
toolbarTitle: translations.start,
|
|
135
|
+
ownerState: ownerState,
|
|
136
|
+
view: rangePosition === 'start' ? view : undefined,
|
|
137
|
+
className: classes.startToolbar,
|
|
138
|
+
onChange: handleOnChange,
|
|
139
|
+
titleId: titleId ? `${titleId}-start-toolbar` : undefined
|
|
140
|
+
}, commonToolbarProps)), /*#__PURE__*/_jsx(DateTimeRangePickerToolbarEnd, _extends({
|
|
141
|
+
value: end,
|
|
142
|
+
onViewChange: handleEndRangeViewChange,
|
|
143
|
+
toolbarTitle: translations.end,
|
|
144
|
+
ownerState: ownerState,
|
|
145
|
+
view: rangePosition === 'end' ? view : undefined,
|
|
146
|
+
className: classes.endToolbar,
|
|
147
|
+
onChange: handleOnChange,
|
|
148
|
+
titleId: titleId ? `${titleId}-end-toolbar` : undefined
|
|
149
|
+
}, commonToolbarProps))]
|
|
150
|
+
})
|
|
175
151
|
}));
|
|
176
152
|
});
|
|
177
153
|
process.env.NODE_ENV !== "production" ? DateTimeRangePickerToolbar.propTypes = {
|
|
@@ -214,7 +190,6 @@ process.env.NODE_ENV !== "production" ? DateTimeRangePickerToolbar.propTypes = {
|
|
|
214
190
|
* @default "––"
|
|
215
191
|
*/
|
|
216
192
|
toolbarPlaceholder: PropTypes.node,
|
|
217
|
-
toolbarVariant: PropTypes.oneOf(['desktop', 'mobile']),
|
|
218
193
|
value: PropTypes.arrayOf(PropTypes.object).isRequired,
|
|
219
194
|
/**
|
|
220
195
|
* Currently visible picker view.
|
|
@@ -112,8 +112,7 @@ const DesktopDateTimeRangePicker = /*#__PURE__*/React.forwardRef(function Deskto
|
|
|
112
112
|
hidden: true
|
|
113
113
|
}, defaultizedProps.slotProps?.tabs),
|
|
114
114
|
toolbar: _extends({
|
|
115
|
-
hidden: true
|
|
116
|
-
toolbarVariant: 'desktop'
|
|
115
|
+
hidden: true
|
|
117
116
|
}, defaultizedProps.slotProps?.toolbar),
|
|
118
117
|
actionBar: ownerState => _extends({
|
|
119
118
|
actions: actionBarActions
|
|
@@ -114,8 +114,7 @@ const MobileDateTimeRangePicker = /*#__PURE__*/React.forwardRef(function MobileD
|
|
|
114
114
|
hidden: false
|
|
115
115
|
}, defaultizedProps.slotProps?.tabs),
|
|
116
116
|
toolbar: _extends({
|
|
117
|
-
hidden: false
|
|
118
|
-
toolbarVariant: 'mobile'
|
|
117
|
+
hidden: false
|
|
119
118
|
}, defaultizedProps.slotProps?.toolbar)
|
|
120
119
|
})
|
|
121
120
|
});
|
package/README.md
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
# MUI X Date Pickers Pro
|
|
2
2
|
|
|
3
3
|
This package is the Pro plan edition of the Date and Time Picker Components.
|
|
4
|
-
It's part of [MUI X](https://mui.com/x/), an open-core extension of
|
|
4
|
+
It's part of [MUI X](https://mui.com/x/), an open-core extension of our Core libraries, with advanced components.
|
|
5
5
|
|
|
6
6
|
## Installation
|
|
7
7
|
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { UseSingleInputDateRangeFieldProps } from './SingleInputDateRangeField.types';
|
|
2
|
-
export declare const useSingleInputDateRangeField: <TEnableAccessibleFieldDOMStructure extends boolean, TAllProps extends UseSingleInputDateRangeFieldProps<TEnableAccessibleFieldDOMStructure>>(inProps: TAllProps) => import("@mui/x-date-pickers/internals").UseFieldResponse<TEnableAccessibleFieldDOMStructure, Omit<TAllProps & Omit<UseSingleInputDateRangeFieldProps<TEnableAccessibleFieldDOMStructure>, keyof import("@mui/x-date-pickers/internals/hooks/defaultizedFieldProps").UseDefaultizedDateFieldBaseProps> & Required<Pick<UseSingleInputDateRangeFieldProps<TEnableAccessibleFieldDOMStructure>, keyof import("@mui/x-date-pickers/internals/hooks/defaultizedFieldProps").UseDefaultizedDateFieldBaseProps>>, "disabled" | "format" | "onChange" | "onError" | "defaultValue" | "value" | "readOnly" | "
|
|
2
|
+
export declare const useSingleInputDateRangeField: <TEnableAccessibleFieldDOMStructure extends boolean, TAllProps extends UseSingleInputDateRangeFieldProps<TEnableAccessibleFieldDOMStructure>>(inProps: TAllProps) => import("@mui/x-date-pickers/internals").UseFieldResponse<TEnableAccessibleFieldDOMStructure, Omit<TAllProps & Omit<UseSingleInputDateRangeFieldProps<TEnableAccessibleFieldDOMStructure>, keyof import("@mui/x-date-pickers/internals/hooks/defaultizedFieldProps").UseDefaultizedDateFieldBaseProps> & Required<Pick<UseSingleInputDateRangeFieldProps<TEnableAccessibleFieldDOMStructure>, keyof import("@mui/x-date-pickers/internals/hooks/defaultizedFieldProps").UseDefaultizedDateFieldBaseProps>>, "disabled" | "format" | "onChange" | "onError" | "defaultValue" | "value" | "readOnly" | "referenceDate" | "timezone" | "formatDensity" | "enableAccessibleFieldDOMStructure" | "selectedSections" | "onSelectedSectionsChange" | "shouldRespectLeadingZeros" | "unstableFieldRef" | keyof import("@mui/x-date-pickers/internals").BaseDateValidationProps | "shouldDisableDate" | "shouldDisableMonth" | "shouldDisableYear" | "dateSeparator">>;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { UseSingleInputDateTimeRangeFieldProps } from './SingleInputDateTimeRangeField.types';
|
|
2
|
-
export declare const useSingleInputDateTimeRangeField: <TEnableAccessibleFieldDOMStructure extends boolean, TAllProps extends UseSingleInputDateTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure>>(inProps: TAllProps) => import("@mui/x-date-pickers/internals").UseFieldResponse<TEnableAccessibleFieldDOMStructure, Omit<TAllProps & Omit<UseSingleInputDateTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure>, keyof import("@mui/x-date-pickers/internals/hooks/defaultizedFieldProps").UseDefaultizedDateTimeFieldBaseProps> & Required<Pick<UseSingleInputDateTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure>, keyof import("@mui/x-date-pickers/internals/hooks/defaultizedFieldProps").UseDefaultizedDateTimeFieldBaseProps>>, "disabled" | "format" | "onChange" | "onError" | "defaultValue" | "value" | "readOnly" | "
|
|
2
|
+
export declare const useSingleInputDateTimeRangeField: <TEnableAccessibleFieldDOMStructure extends boolean, TAllProps extends UseSingleInputDateTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure>>(inProps: TAllProps) => import("@mui/x-date-pickers/internals").UseFieldResponse<TEnableAccessibleFieldDOMStructure, Omit<TAllProps & Omit<UseSingleInputDateTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure>, keyof import("@mui/x-date-pickers/internals/hooks/defaultizedFieldProps").UseDefaultizedDateTimeFieldBaseProps> & Required<Pick<UseSingleInputDateTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure>, keyof import("@mui/x-date-pickers/internals/hooks/defaultizedFieldProps").UseDefaultizedDateTimeFieldBaseProps>>, "disabled" | "format" | "onChange" | "onError" | "defaultValue" | "value" | "readOnly" | "referenceDate" | "timezone" | "formatDensity" | "enableAccessibleFieldDOMStructure" | "selectedSections" | "onSelectedSectionsChange" | "shouldRespectLeadingZeros" | "unstableFieldRef" | "ampm" | "disableFuture" | "maxDate" | "disablePast" | "minDate" | "minTime" | "maxTime" | "minutesStep" | "shouldDisableTime" | "disableIgnoringDatePartForTimeValidation" | "minDateTime" | "maxDateTime" | "shouldDisableDate" | "shouldDisableMonth" | "shouldDisableYear" | "dateSeparator">>;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { UseSingleInputTimeRangeFieldProps } from './SingleInputTimeRangeField.types';
|
|
2
|
-
export declare const useSingleInputTimeRangeField: <TEnableAccessibleFieldDOMStructure extends boolean, TAllProps extends UseSingleInputTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure>>(inProps: TAllProps) => import("@mui/x-date-pickers/internals").UseFieldResponse<TEnableAccessibleFieldDOMStructure, Omit<TAllProps & Omit<UseSingleInputTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure>, keyof import("@mui/x-date-pickers/internals/hooks/defaultizedFieldProps").UseDefaultizedTimeFieldBaseProps> & Required<Pick<UseSingleInputTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure>, keyof import("@mui/x-date-pickers/internals/hooks/defaultizedFieldProps").UseDefaultizedTimeFieldBaseProps>>, "disabled" | "format" | "onChange" | "onError" | "defaultValue" | "value" | "readOnly" | "
|
|
2
|
+
export declare const useSingleInputTimeRangeField: <TEnableAccessibleFieldDOMStructure extends boolean, TAllProps extends UseSingleInputTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure>>(inProps: TAllProps) => import("@mui/x-date-pickers/internals").UseFieldResponse<TEnableAccessibleFieldDOMStructure, Omit<TAllProps & Omit<UseSingleInputTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure>, keyof import("@mui/x-date-pickers/internals/hooks/defaultizedFieldProps").UseDefaultizedTimeFieldBaseProps> & Required<Pick<UseSingleInputTimeRangeFieldProps<TEnableAccessibleFieldDOMStructure>, keyof import("@mui/x-date-pickers/internals/hooks/defaultizedFieldProps").UseDefaultizedTimeFieldBaseProps>>, "disabled" | "format" | "onChange" | "onError" | "defaultValue" | "value" | "readOnly" | "referenceDate" | "timezone" | "formatDensity" | "enableAccessibleFieldDOMStructure" | "selectedSections" | "onSelectedSectionsChange" | "shouldRespectLeadingZeros" | "unstableFieldRef" | "ampm" | keyof import("@mui/x-date-pickers/internals").BaseTimeValidationProps | keyof import("@mui/x-date-pickers/internals").TimeValidationProps | "dateSeparator">>;
|
package/index.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { UsePickerParams, BasePickerProps, ExportedBaseToolbarProps, UsePickerViewsProps, BaseNonStaticPickerProps, UsePickerValueNonStaticProps,
|
|
1
|
+
import { UsePickerParams, BasePickerProps, ExportedBaseToolbarProps, UsePickerViewsProps, BaseNonStaticPickerProps, UsePickerValueNonStaticProps, UsePickerProviderNonStaticProps, DateOrTimeViewWithMeridiem, ExportedBaseTabsProps, PickerRangeValue } from '@mui/x-date-pickers/internals';
|
|
2
2
|
import { ExportedPickersLayoutSlots, ExportedPickersLayoutSlotProps } from '@mui/x-date-pickers/PickersLayout';
|
|
3
3
|
import { BaseRangeNonStaticPickerProps } from '../../models';
|
|
4
4
|
import { UseRangePositionProps, UseRangePositionResponse } from '../useRangePosition';
|
|
@@ -9,7 +9,7 @@ export interface UseRangePickerSlotProps<TView extends DateOrTimeViewWithMeridie
|
|
|
9
9
|
tabs?: ExportedBaseTabsProps;
|
|
10
10
|
toolbar?: ExportedBaseToolbarProps;
|
|
11
11
|
}
|
|
12
|
-
export interface RangeOnlyPickerProps extends BaseNonStaticPickerProps, UsePickerValueNonStaticProps,
|
|
12
|
+
export interface RangeOnlyPickerProps extends BaseNonStaticPickerProps, UsePickerValueNonStaticProps, UsePickerProviderNonStaticProps, BaseRangeNonStaticPickerProps, UseRangePositionProps {
|
|
13
13
|
}
|
|
14
14
|
export interface UseRangePickerProps<TView extends DateOrTimeViewWithMeridiem, TError, TExternalProps extends UsePickerViewsProps<any, TView, any, any>, TAdditionalViewProps extends {}> extends RangeOnlyPickerProps, BasePickerProps<PickerRangeValue, TView, TError, TExternalProps, TAdditionalViewProps> {
|
|
15
15
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ponyfillGlobal } from '@mui/utils';
|
|
2
2
|
export const getReleaseInfo = () => {
|
|
3
|
-
const releaseInfo = "
|
|
3
|
+
const releaseInfo = "MTczNDA0MDgwMDAwMA==";
|
|
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
|
|
@@ -2,21 +2,18 @@
|
|
|
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 = ["value", "rangePosition", "onRangePositionChange", "toolbarFormat", "className", "onViewChange", "view", "views"];
|
|
5
|
+
const _excluded = ["value", "rangePosition", "onRangePositionChange", "toolbarFormat", "className", "classes", "onViewChange", "view", "views"];
|
|
6
6
|
import * as React from 'react';
|
|
7
7
|
import PropTypes from 'prop-types';
|
|
8
8
|
import clsx from 'clsx';
|
|
9
9
|
import Typography from '@mui/material/Typography';
|
|
10
10
|
import { styled, useThemeProps } from '@mui/material/styles';
|
|
11
11
|
import composeClasses from '@mui/utils/composeClasses';
|
|
12
|
-
import { PickersToolbar, PickersToolbarButton, useUtils } from '@mui/x-date-pickers/internals';
|
|
12
|
+
import { PickersToolbar, PickersToolbarButton, useUtils, useToolbarOwnerState } from '@mui/x-date-pickers/internals';
|
|
13
13
|
import { usePickerTranslations } from '@mui/x-date-pickers/hooks';
|
|
14
14
|
import { getDateRangePickerToolbarUtilityClass } from "./dateRangePickerToolbarClasses.js";
|
|
15
15
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
16
|
-
const useUtilityClasses =
|
|
17
|
-
const {
|
|
18
|
-
classes
|
|
19
|
-
} = ownerState;
|
|
16
|
+
const useUtilityClasses = classes => {
|
|
20
17
|
const slots = {
|
|
21
18
|
root: ['root'],
|
|
22
19
|
container: ['container']
|
|
@@ -56,14 +53,15 @@ const DateRangePickerToolbar = /*#__PURE__*/React.forwardRef(function DateRangeP
|
|
|
56
53
|
rangePosition,
|
|
57
54
|
onRangePositionChange,
|
|
58
55
|
toolbarFormat,
|
|
59
|
-
className
|
|
56
|
+
className,
|
|
57
|
+
classes: classesProp
|
|
60
58
|
} = props,
|
|
61
59
|
other = _objectWithoutPropertiesLoose(props, _excluded);
|
|
62
60
|
const translations = usePickerTranslations();
|
|
61
|
+
const ownerState = useToolbarOwnerState();
|
|
62
|
+
const classes = useUtilityClasses(classesProp);
|
|
63
63
|
const startDateValue = start ? utils.formatByString(start, toolbarFormat || utils.formats.shortDate) : translations.start;
|
|
64
64
|
const endDateValue = end ? utils.formatByString(end, toolbarFormat || utils.formats.shortDate) : translations.end;
|
|
65
|
-
const ownerState = props;
|
|
66
|
-
const classes = useUtilityClasses(ownerState);
|
|
67
65
|
return /*#__PURE__*/_jsx(DateRangePickerToolbarRoot, _extends({}, other, {
|
|
68
66
|
toolbarTitle: translations.dateRangePickerToolbarTitle,
|
|
69
67
|
isLandscape: false,
|
|
@@ -2,22 +2,19 @@
|
|
|
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 = ["value", "rangePosition", "onRangePositionChange", "className", "
|
|
5
|
+
const _excluded = ["value", "rangePosition", "onRangePositionChange", "className", "classes", "onViewChange", "onChange", "classes", "view", "isLandscape", "views", "ampm", "hidden", "toolbarFormat", "toolbarPlaceholder", "titleId", "sx"];
|
|
6
6
|
import * as React from 'react';
|
|
7
7
|
import PropTypes from 'prop-types';
|
|
8
8
|
import clsx from 'clsx';
|
|
9
9
|
import { styled, useThemeProps } from '@mui/material/styles';
|
|
10
10
|
import composeClasses from '@mui/utils/composeClasses';
|
|
11
|
-
import { useUtils } from '@mui/x-date-pickers/internals';
|
|
11
|
+
import { useUtils, useToolbarOwnerState, DateTimePickerToolbarForceDesktopVariant } from '@mui/x-date-pickers/internals';
|
|
12
12
|
import { usePickerContext, usePickerTranslations } from '@mui/x-date-pickers/hooks';
|
|
13
13
|
import { DateTimePickerToolbar } from '@mui/x-date-pickers/DateTimePicker';
|
|
14
14
|
import { getDateTimeRangePickerToolbarUtilityClass } from "./dateTimeRangePickerToolbarClasses.js";
|
|
15
15
|
import { calculateRangeChange } from "../internals/utils/date-range-manager.js";
|
|
16
16
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
17
|
-
const useUtilityClasses =
|
|
18
|
-
const {
|
|
19
|
-
classes
|
|
20
|
-
} = ownerState;
|
|
17
|
+
const useUtilityClasses = classes => {
|
|
21
18
|
const slots = {
|
|
22
19
|
root: ['root'],
|
|
23
20
|
startToolbar: ['startToolbar'],
|
|
@@ -39,36 +36,13 @@ const DateTimeRangePickerToolbarStart = styled(DateTimePickerToolbar, {
|
|
|
39
36
|
overridesResolver: (_, styles) => styles.startToolbar
|
|
40
37
|
})({
|
|
41
38
|
borderBottom: 'none',
|
|
42
|
-
|
|
43
|
-
props: ({
|
|
44
|
-
toolbarVariant
|
|
45
|
-
}) => toolbarVariant !== 'desktop',
|
|
46
|
-
style: {
|
|
47
|
-
padding: '12px 8px 0 12px'
|
|
48
|
-
}
|
|
49
|
-
}, {
|
|
50
|
-
props: {
|
|
51
|
-
toolbarVariant: 'desktop'
|
|
52
|
-
},
|
|
53
|
-
style: {
|
|
54
|
-
paddingBottom: 0
|
|
55
|
-
}
|
|
56
|
-
}]
|
|
39
|
+
paddingBottom: 0
|
|
57
40
|
});
|
|
58
41
|
const DateTimeRangePickerToolbarEnd = styled(DateTimePickerToolbar, {
|
|
59
42
|
name: 'MuiDateTimeRangePickerToolbar',
|
|
60
43
|
slot: 'EndToolbar',
|
|
61
44
|
overridesResolver: (_, styles) => styles.endToolbar
|
|
62
|
-
})({
|
|
63
|
-
variants: [{
|
|
64
|
-
props: ({
|
|
65
|
-
toolbarVariant
|
|
66
|
-
}) => toolbarVariant !== 'desktop',
|
|
67
|
-
style: {
|
|
68
|
-
padding: '12px 8px 12px 12px'
|
|
69
|
-
}
|
|
70
|
-
}]
|
|
71
|
-
});
|
|
45
|
+
})({});
|
|
72
46
|
const DateTimeRangePickerToolbar = /*#__PURE__*/React.forwardRef(function DateTimeRangePickerToolbar(inProps, ref) {
|
|
73
47
|
const props = useThemeProps({
|
|
74
48
|
props: inProps,
|
|
@@ -80,6 +54,7 @@ const DateTimeRangePickerToolbar = /*#__PURE__*/React.forwardRef(function DateTi
|
|
|
80
54
|
rangePosition,
|
|
81
55
|
onRangePositionChange,
|
|
82
56
|
className,
|
|
57
|
+
classes: classesProp,
|
|
83
58
|
onViewChange,
|
|
84
59
|
onChange,
|
|
85
60
|
view,
|
|
@@ -97,6 +72,9 @@ const DateTimeRangePickerToolbar = /*#__PURE__*/React.forwardRef(function DateTi
|
|
|
97
72
|
disabled,
|
|
98
73
|
readOnly
|
|
99
74
|
} = usePickerContext();
|
|
75
|
+
const translations = usePickerTranslations();
|
|
76
|
+
const ownerState = useToolbarOwnerState();
|
|
77
|
+
const classes = useUtilityClasses(classesProp);
|
|
100
78
|
const commonToolbarProps = {
|
|
101
79
|
isLandscape,
|
|
102
80
|
views,
|
|
@@ -107,9 +85,6 @@ const DateTimeRangePickerToolbar = /*#__PURE__*/React.forwardRef(function DateTi
|
|
|
107
85
|
toolbarFormat,
|
|
108
86
|
toolbarPlaceholder
|
|
109
87
|
};
|
|
110
|
-
const translations = usePickerTranslations();
|
|
111
|
-
const ownerState = props;
|
|
112
|
-
const classes = useUtilityClasses(ownerState);
|
|
113
88
|
const handleStartRangeViewChange = React.useCallback(newView => {
|
|
114
89
|
if (newView === 'year' || newView === 'month') {
|
|
115
90
|
return;
|
|
@@ -145,33 +120,34 @@ const DateTimeRangePickerToolbar = /*#__PURE__*/React.forwardRef(function DateTi
|
|
|
145
120
|
if (hidden) {
|
|
146
121
|
return null;
|
|
147
122
|
}
|
|
148
|
-
return /*#__PURE__*/
|
|
123
|
+
return /*#__PURE__*/_jsx(DateTimeRangePickerToolbarRoot, _extends({
|
|
149
124
|
className: clsx(classes.root, className),
|
|
150
125
|
ownerState: ownerState,
|
|
151
126
|
ref: ref,
|
|
152
127
|
sx: sx
|
|
153
128
|
}, other, {
|
|
154
|
-
children:
|
|
155
|
-
value:
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
129
|
+
children: /*#__PURE__*/_jsxs(DateTimePickerToolbarForceDesktopVariant.Provider, {
|
|
130
|
+
value: true,
|
|
131
|
+
children: [/*#__PURE__*/_jsx(DateTimeRangePickerToolbarStart, _extends({
|
|
132
|
+
value: start,
|
|
133
|
+
onViewChange: handleStartRangeViewChange,
|
|
134
|
+
toolbarTitle: translations.start,
|
|
135
|
+
ownerState: ownerState,
|
|
136
|
+
view: rangePosition === 'start' ? view : undefined,
|
|
137
|
+
className: classes.startToolbar,
|
|
138
|
+
onChange: handleOnChange,
|
|
139
|
+
titleId: titleId ? `${titleId}-start-toolbar` : undefined
|
|
140
|
+
}, commonToolbarProps)), /*#__PURE__*/_jsx(DateTimeRangePickerToolbarEnd, _extends({
|
|
141
|
+
value: end,
|
|
142
|
+
onViewChange: handleEndRangeViewChange,
|
|
143
|
+
toolbarTitle: translations.end,
|
|
144
|
+
ownerState: ownerState,
|
|
145
|
+
view: rangePosition === 'end' ? view : undefined,
|
|
146
|
+
className: classes.endToolbar,
|
|
147
|
+
onChange: handleOnChange,
|
|
148
|
+
titleId: titleId ? `${titleId}-end-toolbar` : undefined
|
|
149
|
+
}, commonToolbarProps))]
|
|
150
|
+
})
|
|
175
151
|
}));
|
|
176
152
|
});
|
|
177
153
|
process.env.NODE_ENV !== "production" ? DateTimeRangePickerToolbar.propTypes = {
|
|
@@ -214,7 +190,6 @@ process.env.NODE_ENV !== "production" ? DateTimeRangePickerToolbar.propTypes = {
|
|
|
214
190
|
* @default "––"
|
|
215
191
|
*/
|
|
216
192
|
toolbarPlaceholder: PropTypes.node,
|
|
217
|
-
toolbarVariant: PropTypes.oneOf(['desktop', 'mobile']),
|
|
218
193
|
value: PropTypes.arrayOf(PropTypes.object).isRequired,
|
|
219
194
|
/**
|
|
220
195
|
* Currently visible picker view.
|
|
@@ -112,8 +112,7 @@ const DesktopDateTimeRangePicker = /*#__PURE__*/React.forwardRef(function Deskto
|
|
|
112
112
|
hidden: true
|
|
113
113
|
}, defaultizedProps.slotProps?.tabs),
|
|
114
114
|
toolbar: _extends({
|
|
115
|
-
hidden: true
|
|
116
|
-
toolbarVariant: 'desktop'
|
|
115
|
+
hidden: true
|
|
117
116
|
}, defaultizedProps.slotProps?.toolbar),
|
|
118
117
|
actionBar: ownerState => _extends({
|
|
119
118
|
actions: actionBarActions
|
|
@@ -114,8 +114,7 @@ const MobileDateTimeRangePicker = /*#__PURE__*/React.forwardRef(function MobileD
|
|
|
114
114
|
hidden: false
|
|
115
115
|
}, defaultizedProps.slotProps?.tabs),
|
|
116
116
|
toolbar: _extends({
|
|
117
|
-
hidden: false
|
|
118
|
-
toolbarVariant: 'mobile'
|
|
117
|
+
hidden: false
|
|
119
118
|
}, defaultizedProps.slotProps?.toolbar)
|
|
120
119
|
})
|
|
121
120
|
});
|
package/modern/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { ponyfillGlobal } from '@mui/utils';
|
|
2
2
|
export const getReleaseInfo = () => {
|
|
3
|
-
const releaseInfo = "
|
|
3
|
+
const releaseInfo = "MTczNDA0MDgwMDAwMA==";
|
|
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
|
|
@@ -19,11 +19,8 @@ var _internals = require("@mui/x-date-pickers/internals");
|
|
|
19
19
|
var _hooks = require("@mui/x-date-pickers/hooks");
|
|
20
20
|
var _dateRangePickerToolbarClasses = require("./dateRangePickerToolbarClasses");
|
|
21
21
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
22
|
-
const _excluded = ["value", "rangePosition", "onRangePositionChange", "toolbarFormat", "className", "onViewChange", "view", "views"];
|
|
23
|
-
const useUtilityClasses =
|
|
24
|
-
const {
|
|
25
|
-
classes
|
|
26
|
-
} = ownerState;
|
|
22
|
+
const _excluded = ["value", "rangePosition", "onRangePositionChange", "toolbarFormat", "className", "classes", "onViewChange", "view", "views"];
|
|
23
|
+
const useUtilityClasses = classes => {
|
|
27
24
|
const slots = {
|
|
28
25
|
root: ['root'],
|
|
29
26
|
container: ['container']
|
|
@@ -63,14 +60,15 @@ const DateRangePickerToolbar = exports.DateRangePickerToolbar = /*#__PURE__*/Rea
|
|
|
63
60
|
rangePosition,
|
|
64
61
|
onRangePositionChange,
|
|
65
62
|
toolbarFormat,
|
|
66
|
-
className
|
|
63
|
+
className,
|
|
64
|
+
classes: classesProp
|
|
67
65
|
} = props,
|
|
68
66
|
other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
|
|
69
67
|
const translations = (0, _hooks.usePickerTranslations)();
|
|
68
|
+
const ownerState = (0, _internals.useToolbarOwnerState)();
|
|
69
|
+
const classes = useUtilityClasses(classesProp);
|
|
70
70
|
const startDateValue = start ? utils.formatByString(start, toolbarFormat || utils.formats.shortDate) : translations.start;
|
|
71
71
|
const endDateValue = end ? utils.formatByString(end, toolbarFormat || utils.formats.shortDate) : translations.end;
|
|
72
|
-
const ownerState = props;
|
|
73
|
-
const classes = useUtilityClasses(ownerState);
|
|
74
72
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(DateRangePickerToolbarRoot, (0, _extends2.default)({}, other, {
|
|
75
73
|
toolbarTitle: translations.dateRangePickerToolbarTitle,
|
|
76
74
|
isLandscape: false,
|
|
@@ -20,11 +20,8 @@ var _DateTimePicker = require("@mui/x-date-pickers/DateTimePicker");
|
|
|
20
20
|
var _dateTimeRangePickerToolbarClasses = require("./dateTimeRangePickerToolbarClasses");
|
|
21
21
|
var _dateRangeManager = require("../internals/utils/date-range-manager");
|
|
22
22
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
23
|
-
const _excluded = ["value", "rangePosition", "onRangePositionChange", "className", "
|
|
24
|
-
const useUtilityClasses =
|
|
25
|
-
const {
|
|
26
|
-
classes
|
|
27
|
-
} = ownerState;
|
|
23
|
+
const _excluded = ["value", "rangePosition", "onRangePositionChange", "className", "classes", "onViewChange", "onChange", "classes", "view", "isLandscape", "views", "ampm", "hidden", "toolbarFormat", "toolbarPlaceholder", "titleId", "sx"];
|
|
24
|
+
const useUtilityClasses = classes => {
|
|
28
25
|
const slots = {
|
|
29
26
|
root: ['root'],
|
|
30
27
|
startToolbar: ['startToolbar'],
|
|
@@ -46,36 +43,13 @@ const DateTimeRangePickerToolbarStart = (0, _styles.styled)(_DateTimePicker.Date
|
|
|
46
43
|
overridesResolver: (_, styles) => styles.startToolbar
|
|
47
44
|
})({
|
|
48
45
|
borderBottom: 'none',
|
|
49
|
-
|
|
50
|
-
props: ({
|
|
51
|
-
toolbarVariant
|
|
52
|
-
}) => toolbarVariant !== 'desktop',
|
|
53
|
-
style: {
|
|
54
|
-
padding: '12px 8px 0 12px'
|
|
55
|
-
}
|
|
56
|
-
}, {
|
|
57
|
-
props: {
|
|
58
|
-
toolbarVariant: 'desktop'
|
|
59
|
-
},
|
|
60
|
-
style: {
|
|
61
|
-
paddingBottom: 0
|
|
62
|
-
}
|
|
63
|
-
}]
|
|
46
|
+
paddingBottom: 0
|
|
64
47
|
});
|
|
65
48
|
const DateTimeRangePickerToolbarEnd = (0, _styles.styled)(_DateTimePicker.DateTimePickerToolbar, {
|
|
66
49
|
name: 'MuiDateTimeRangePickerToolbar',
|
|
67
50
|
slot: 'EndToolbar',
|
|
68
51
|
overridesResolver: (_, styles) => styles.endToolbar
|
|
69
|
-
})({
|
|
70
|
-
variants: [{
|
|
71
|
-
props: ({
|
|
72
|
-
toolbarVariant
|
|
73
|
-
}) => toolbarVariant !== 'desktop',
|
|
74
|
-
style: {
|
|
75
|
-
padding: '12px 8px 12px 12px'
|
|
76
|
-
}
|
|
77
|
-
}]
|
|
78
|
-
});
|
|
52
|
+
})({});
|
|
79
53
|
const DateTimeRangePickerToolbar = exports.DateTimeRangePickerToolbar = /*#__PURE__*/React.forwardRef(function DateTimeRangePickerToolbar(inProps, ref) {
|
|
80
54
|
const props = (0, _styles.useThemeProps)({
|
|
81
55
|
props: inProps,
|
|
@@ -87,6 +61,7 @@ const DateTimeRangePickerToolbar = exports.DateTimeRangePickerToolbar = /*#__PUR
|
|
|
87
61
|
rangePosition,
|
|
88
62
|
onRangePositionChange,
|
|
89
63
|
className,
|
|
64
|
+
classes: classesProp,
|
|
90
65
|
onViewChange,
|
|
91
66
|
onChange,
|
|
92
67
|
view,
|
|
@@ -104,6 +79,9 @@ const DateTimeRangePickerToolbar = exports.DateTimeRangePickerToolbar = /*#__PUR
|
|
|
104
79
|
disabled,
|
|
105
80
|
readOnly
|
|
106
81
|
} = (0, _hooks.usePickerContext)();
|
|
82
|
+
const translations = (0, _hooks.usePickerTranslations)();
|
|
83
|
+
const ownerState = (0, _internals.useToolbarOwnerState)();
|
|
84
|
+
const classes = useUtilityClasses(classesProp);
|
|
107
85
|
const commonToolbarProps = {
|
|
108
86
|
isLandscape,
|
|
109
87
|
views,
|
|
@@ -114,9 +92,6 @@ const DateTimeRangePickerToolbar = exports.DateTimeRangePickerToolbar = /*#__PUR
|
|
|
114
92
|
toolbarFormat,
|
|
115
93
|
toolbarPlaceholder
|
|
116
94
|
};
|
|
117
|
-
const translations = (0, _hooks.usePickerTranslations)();
|
|
118
|
-
const ownerState = props;
|
|
119
|
-
const classes = useUtilityClasses(ownerState);
|
|
120
95
|
const handleStartRangeViewChange = React.useCallback(newView => {
|
|
121
96
|
if (newView === 'year' || newView === 'month') {
|
|
122
97
|
return;
|
|
@@ -152,33 +127,34 @@ const DateTimeRangePickerToolbar = exports.DateTimeRangePickerToolbar = /*#__PUR
|
|
|
152
127
|
if (hidden) {
|
|
153
128
|
return null;
|
|
154
129
|
}
|
|
155
|
-
return /*#__PURE__*/(0, _jsxRuntime.
|
|
130
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(DateTimeRangePickerToolbarRoot, (0, _extends2.default)({
|
|
156
131
|
className: (0, _clsx.default)(classes.root, className),
|
|
157
132
|
ownerState: ownerState,
|
|
158
133
|
ref: ref,
|
|
159
134
|
sx: sx
|
|
160
135
|
}, other, {
|
|
161
|
-
children:
|
|
162
|
-
value:
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
136
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_internals.DateTimePickerToolbarForceDesktopVariant.Provider, {
|
|
137
|
+
value: true,
|
|
138
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(DateTimeRangePickerToolbarStart, (0, _extends2.default)({
|
|
139
|
+
value: start,
|
|
140
|
+
onViewChange: handleStartRangeViewChange,
|
|
141
|
+
toolbarTitle: translations.start,
|
|
142
|
+
ownerState: ownerState,
|
|
143
|
+
view: rangePosition === 'start' ? view : undefined,
|
|
144
|
+
className: classes.startToolbar,
|
|
145
|
+
onChange: handleOnChange,
|
|
146
|
+
titleId: titleId ? `${titleId}-start-toolbar` : undefined
|
|
147
|
+
}, commonToolbarProps)), /*#__PURE__*/(0, _jsxRuntime.jsx)(DateTimeRangePickerToolbarEnd, (0, _extends2.default)({
|
|
148
|
+
value: end,
|
|
149
|
+
onViewChange: handleEndRangeViewChange,
|
|
150
|
+
toolbarTitle: translations.end,
|
|
151
|
+
ownerState: ownerState,
|
|
152
|
+
view: rangePosition === 'end' ? view : undefined,
|
|
153
|
+
className: classes.endToolbar,
|
|
154
|
+
onChange: handleOnChange,
|
|
155
|
+
titleId: titleId ? `${titleId}-end-toolbar` : undefined
|
|
156
|
+
}, commonToolbarProps))]
|
|
157
|
+
})
|
|
182
158
|
}));
|
|
183
159
|
});
|
|
184
160
|
process.env.NODE_ENV !== "production" ? DateTimeRangePickerToolbar.propTypes = {
|
|
@@ -221,7 +197,6 @@ process.env.NODE_ENV !== "production" ? DateTimeRangePickerToolbar.propTypes = {
|
|
|
221
197
|
* @default "––"
|
|
222
198
|
*/
|
|
223
199
|
toolbarPlaceholder: _propTypes.default.node,
|
|
224
|
-
toolbarVariant: _propTypes.default.oneOf(['desktop', 'mobile']),
|
|
225
200
|
value: _propTypes.default.arrayOf(_propTypes.default.object).isRequired,
|
|
226
201
|
/**
|
|
227
202
|
* Currently visible picker view.
|
|
@@ -119,8 +119,7 @@ const DesktopDateTimeRangePicker = exports.DesktopDateTimeRangePicker = /*#__PUR
|
|
|
119
119
|
hidden: true
|
|
120
120
|
}, defaultizedProps.slotProps?.tabs),
|
|
121
121
|
toolbar: (0, _extends2.default)({
|
|
122
|
-
hidden: true
|
|
123
|
-
toolbarVariant: 'desktop'
|
|
122
|
+
hidden: true
|
|
124
123
|
}, defaultizedProps.slotProps?.toolbar),
|
|
125
124
|
actionBar: ownerState => (0, _extends2.default)({
|
|
126
125
|
actions: actionBarActions
|
|
@@ -121,8 +121,7 @@ const MobileDateTimeRangePicker = exports.MobileDateTimeRangePicker = /*#__PURE_
|
|
|
121
121
|
hidden: false
|
|
122
122
|
}, defaultizedProps.slotProps?.tabs),
|
|
123
123
|
toolbar: (0, _extends2.default)({
|
|
124
|
-
hidden: false
|
|
125
|
-
toolbarVariant: 'mobile'
|
|
124
|
+
hidden: false
|
|
126
125
|
}, defaultizedProps.slotProps?.toolbar)
|
|
127
126
|
})
|
|
128
127
|
});
|
package/node/index.js
CHANGED
|
@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.getReleaseInfo = void 0;
|
|
7
7
|
var _utils = require("@mui/utils");
|
|
8
8
|
const getReleaseInfo = () => {
|
|
9
|
-
const releaseInfo = "
|
|
9
|
+
const releaseInfo = "MTczNDA0MDgwMDAwMA==";
|
|
10
10
|
if (process.env.NODE_ENV !== 'production') {
|
|
11
11
|
// A simple hack to set the value in the test environment (has no build step).
|
|
12
12
|
// eslint-disable-next-line no-useless-concat
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mui/x-date-pickers-pro",
|
|
3
|
-
"version": "8.0.0-alpha.
|
|
3
|
+
"version": "8.0.0-alpha.4",
|
|
4
4
|
"description": "The Pro plan edition of the Date and Time Picker components (MUI X).",
|
|
5
5
|
"author": "MUI Team",
|
|
6
6
|
"main": "./node/index.js",
|
|
@@ -37,9 +37,9 @@
|
|
|
37
37
|
"clsx": "^2.1.1",
|
|
38
38
|
"prop-types": "^15.8.1",
|
|
39
39
|
"react-transition-group": "^4.4.5",
|
|
40
|
-
"@mui/x-date-pickers": "8.0.0-alpha.
|
|
40
|
+
"@mui/x-date-pickers": "8.0.0-alpha.4",
|
|
41
41
|
"@mui/x-internals": "8.0.0-alpha.2",
|
|
42
|
-
"@mui/x-license": "8.0.0-alpha.
|
|
42
|
+
"@mui/x-license": "8.0.0-alpha.4"
|
|
43
43
|
},
|
|
44
44
|
"peerDependencies": {
|
|
45
45
|
"@emotion/react": "^11.9.0",
|