@mui/x-date-pickers 8.29.0 → 8.29.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +176 -1
- package/PickersTextField/PickersFilledInput/PickersFilledInput.js +1 -0
- package/PickersTextField/PickersFilledInput/PickersFilledInput.mjs +1 -0
- package/PickersTextField/PickersInput/PickersInput.js +1 -0
- package/PickersTextField/PickersInput/PickersInput.mjs +1 -0
- package/PickersTextField/PickersInputBase/PickersInputBase.js +20 -20
- package/PickersTextField/PickersInputBase/PickersInputBase.mjs +20 -20
- package/PickersTextField/PickersInputBase/PickersInputBase.types.d.mts +1 -0
- package/PickersTextField/PickersInputBase/PickersInputBase.types.d.ts +1 -0
- package/PickersTextField/PickersInputBase/pickersInputBaseClasses.js +1 -1
- package/PickersTextField/PickersInputBase/pickersInputBaseClasses.mjs +1 -1
- package/PickersTextField/PickersOutlinedInput/PickersOutlinedInput.js +12 -8
- package/PickersTextField/PickersOutlinedInput/PickersOutlinedInput.mjs +12 -8
- package/PickersTextField/PickersTextField.js +4 -1
- package/PickersTextField/PickersTextField.mjs +4 -1
- package/index.js +1 -1
- package/index.mjs +1 -1
- package/internals/hooks/useField/useField.types.d.mts +1 -0
- package/internals/hooks/useField/useField.types.d.ts +1 -0
- package/internals/hooks/useField/useField.utils.d.mts +0 -1
- package/internals/hooks/useField/useField.utils.d.ts +0 -1
- package/internals/hooks/useField/useField.utils.js +2 -2
- package/internals/hooks/useField/useField.utils.mjs +1 -1
- package/internals/hooks/useField/useFieldRootProps.d.mts +1 -0
- package/internals/hooks/useField/useFieldRootProps.d.ts +1 -0
- package/internals/hooks/useField/useFieldRootProps.js +135 -8
- package/internals/hooks/useField/useFieldRootProps.mjs +135 -8
- package/internals/hooks/useField/useFieldSectionContainerProps.js +23 -4
- package/internals/hooks/useField/useFieldSectionContainerProps.mjs +22 -4
- package/internals/hooks/useField/useFieldSectionContentProps.d.mts +2 -2
- package/internals/hooks/useField/useFieldSectionContentProps.d.ts +2 -2
- package/internals/hooks/useField/useFieldSectionContentProps.js +14 -11
- package/internals/hooks/useField/useFieldSectionContentProps.mjs +14 -11
- package/internals/hooks/useField/useFieldV7TextField.js +13 -0
- package/internals/hooks/useField/useFieldV7TextField.mjs +13 -0
- package/package.json +182 -182
package/CHANGELOG.md
CHANGED
|
@@ -5,8 +5,183 @@
|
|
|
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.29.3
|
|
9
|
+
|
|
10
|
+
_Aug 21, 2026_
|
|
11
|
+
|
|
12
|
+
We'd like to extend a big thank you to the 2 contributors who made this release possible. Here are some highlights ✨:
|
|
13
|
+
|
|
14
|
+
- 🐞 Bugfixes
|
|
15
|
+
|
|
16
|
+
The following team members contributed to this release:
|
|
17
|
+
@LukasTy, @MBilalShafi
|
|
18
|
+
|
|
19
|
+
### Data Grid
|
|
20
|
+
|
|
21
|
+
#### `@mui/x-data-grid@8.29.3`
|
|
22
|
+
|
|
23
|
+
- [DataGrid] Fix toolbar button stealing focus when a sibling's disabled state changes (#23265) @MBilalShafi
|
|
24
|
+
|
|
25
|
+
#### `@mui/x-data-grid-pro@8.29.3` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
26
|
+
|
|
27
|
+
Same changes as in `@mui/x-data-grid@8.29.3`.
|
|
28
|
+
|
|
29
|
+
#### `@mui/x-data-grid-premium@8.29.3` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
30
|
+
|
|
31
|
+
Same changes as in `@mui/x-data-grid-pro@8.29.3`.
|
|
32
|
+
|
|
33
|
+
### Date and Time Pickers
|
|
34
|
+
|
|
35
|
+
#### `@mui/x-date-pickers@8.29.3`
|
|
36
|
+
|
|
37
|
+
- [fields] Keep the field editable on blank space clicks (#23372) @LukasTy
|
|
38
|
+
- [pickers] Fix format placeholder brightness with a start adornment (#23205) @LukasTy
|
|
39
|
+
|
|
40
|
+
#### `@mui/x-date-pickers-pro@8.29.3` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
41
|
+
|
|
42
|
+
Same changes as in `@mui/x-date-pickers@8.29.3`, plus:
|
|
43
|
+
|
|
44
|
+
- [DateRangePicker] Fix broken active range position underline in single input range fields (#23201) @LukasTy
|
|
45
|
+
|
|
46
|
+
### Charts
|
|
47
|
+
|
|
48
|
+
#### `@mui/x-charts@8.29.3`
|
|
49
|
+
|
|
50
|
+
Internal changes.
|
|
51
|
+
|
|
52
|
+
#### `@mui/x-charts-pro@8.29.3` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
53
|
+
|
|
54
|
+
Same changes as in `@mui/x-charts@8.29.3`.
|
|
55
|
+
|
|
56
|
+
#### `@mui/x-charts-premium@8.29.3` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
57
|
+
|
|
58
|
+
Same changes as in `@mui/x-charts-pro@8.29.3`.
|
|
59
|
+
|
|
60
|
+
### Tree View
|
|
61
|
+
|
|
62
|
+
#### `@mui/x-tree-view@8.29.3`
|
|
63
|
+
|
|
64
|
+
Internal changes.
|
|
65
|
+
|
|
66
|
+
#### `@mui/x-tree-view-pro@8.29.3` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
67
|
+
|
|
68
|
+
Same changes as in `@mui/x-tree-view@8.29.3`.
|
|
69
|
+
|
|
70
|
+
### Codemod
|
|
71
|
+
|
|
72
|
+
#### `@mui/x-codemod@8.29.3`
|
|
73
|
+
|
|
74
|
+
Internal changes.
|
|
75
|
+
|
|
76
|
+
### Miscellaneous
|
|
77
|
+
|
|
78
|
+
- [core] Fix `test-react-18` install failure on v8.x (#23202) @LukasTy
|
|
79
|
+
|
|
80
|
+
## 8.29.2
|
|
81
|
+
|
|
82
|
+
_Jul 2, 2026_
|
|
83
|
+
|
|
84
|
+
We'd like to extend a big thank you to the 8 contributors who made this release possible. Here are some highlights ✨:
|
|
85
|
+
|
|
86
|
+
- 🐞 Bugfixes
|
|
87
|
+
|
|
88
|
+
Special thanks go out to these community members for their valuable contributions:
|
|
89
|
+
@Anexus5919, @timbuckley
|
|
90
|
+
|
|
91
|
+
The following team members contributed to this release:
|
|
92
|
+
@alexfauquette, @arminmeh, @brijeshb42, @cherniavskii, @LukasTy, @MBilalShafi
|
|
93
|
+
|
|
94
|
+
### Data Grid
|
|
95
|
+
|
|
96
|
+
#### `@mui/x-data-grid@8.29.2`
|
|
97
|
+
|
|
98
|
+
- [DataGrid] Avoid reading `type` of `undefined` in `gridRowUtils` (#22963) @timbuckley
|
|
99
|
+
- [DataGrid] Define `overflowAnchor` style at the right element (#22860) @arminmeh
|
|
100
|
+
- [DataGrid] Fix panel placement jump on mount (#22946) @cherniavskii
|
|
101
|
+
- [DataGrid] Fix scrollbars not showing up on scroll on iOS (#22884) @cherniavskii
|
|
102
|
+
- [DataGrid] Wait for rows before reacting on `autosizeOnMount` (#22886) @MBilalShafi
|
|
103
|
+
|
|
104
|
+
#### `@mui/x-data-grid-pro@8.29.2` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
105
|
+
|
|
106
|
+
Same changes as in `@mui/x-data-grid@8.29.2`.
|
|
107
|
+
|
|
108
|
+
#### `@mui/x-data-grid-premium@8.29.2` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
109
|
+
|
|
110
|
+
Same changes as in `@mui/x-data-grid-pro@8.29.2`, plus:
|
|
111
|
+
|
|
112
|
+
- [DataGridPremium] Escape `singleSelect` values in Excel export with `escapeFormulas` enabled (#22966) @Anexus5919
|
|
113
|
+
|
|
114
|
+
### Date and Time Pickers
|
|
115
|
+
|
|
116
|
+
#### `@mui/x-date-pickers@8.29.2`
|
|
117
|
+
|
|
118
|
+
- [pickers] Fix localized digit crash (#23010) @alexfauquette
|
|
119
|
+
- [pickers] Respect explicit `notched` prop on the outlined `PickersTextField` (#22875) (#22893) @LukasTy
|
|
120
|
+
|
|
121
|
+
#### `@mui/x-date-pickers-pro@8.29.2` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
122
|
+
|
|
123
|
+
Same changes as in `@mui/x-date-pickers@8.29.2`.
|
|
124
|
+
|
|
125
|
+
### Charts
|
|
126
|
+
|
|
127
|
+
#### `@mui/x-charts@8.29.2`
|
|
128
|
+
|
|
129
|
+
Internal changes.
|
|
130
|
+
|
|
131
|
+
#### `@mui/x-charts-pro@8.29.2` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
132
|
+
|
|
133
|
+
Same changes as in `@mui/x-charts@8.29.2`.
|
|
134
|
+
|
|
135
|
+
#### `@mui/x-charts-premium@8.29.2` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
136
|
+
|
|
137
|
+
Same changes as in `@mui/x-charts-pro@8.29.2`.
|
|
138
|
+
|
|
139
|
+
### Tree View
|
|
140
|
+
|
|
141
|
+
#### `@mui/x-tree-view@8.29.2`
|
|
142
|
+
|
|
143
|
+
Internal changes.
|
|
144
|
+
|
|
145
|
+
#### `@mui/x-tree-view-pro@8.29.2` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
146
|
+
|
|
147
|
+
Same changes as in `@mui/x-tree-view@8.29.2`.
|
|
148
|
+
|
|
149
|
+
### Codemod
|
|
150
|
+
|
|
151
|
+
#### `@mui/x-codemod@8.29.2`
|
|
152
|
+
|
|
153
|
+
Internal changes.
|
|
154
|
+
|
|
155
|
+
### Core
|
|
156
|
+
|
|
157
|
+
- [code-infra] Pin mui-public actions to nearest git hash (#22824) @brijeshb42
|
|
158
|
+
- [internal] Switch resolutions to workspace overrides (#22865) @cherniavskii
|
|
159
|
+
|
|
160
|
+
### Miscellaneous
|
|
161
|
+
|
|
162
|
+
- [virtualizer] Improve the dimensions' initial state (#22890) @arminmeh
|
|
163
|
+
- [virtualizer] Remeasure scrollbars when layout changes (#23003) @arminmeh
|
|
164
|
+
|
|
165
|
+
## 8.29.1
|
|
166
|
+
|
|
167
|
+
_Jun 11, 2026_
|
|
168
|
+
|
|
169
|
+
### Data Grid
|
|
170
|
+
|
|
171
|
+
#### `@mui/x-data-grid@8.29.1`
|
|
172
|
+
|
|
173
|
+
- [DataGrid] Prevent React state update before mount (#22749) @arminmeh
|
|
174
|
+
|
|
175
|
+
#### `@mui/x-data-grid-pro@8.29.1` [](https://mui.com/r/x-pro-svg-link 'Pro plan')
|
|
176
|
+
|
|
177
|
+
Same changes as in `@mui/x-data-grid@8.29.1`.
|
|
178
|
+
|
|
179
|
+
#### `@mui/x-data-grid-premium@8.29.1` [](https://mui.com/r/x-premium-svg-link 'Premium plan')
|
|
180
|
+
|
|
181
|
+
Same changes as in `@mui/x-data-grid-pro@8.29.1`.
|
|
182
|
+
|
|
8
183
|
## 8.29.0
|
|
9
|
-
|
|
184
|
+
|
|
10
185
|
_Jun 5, 2026_
|
|
11
186
|
|
|
12
187
|
We'd like to extend a big thank you to the 2 contributors who made this release possible. Here are some highlights ✨:
|
|
@@ -279,6 +279,7 @@ process.env.NODE_ENV !== "production" ? PickersFilledInput.propTypes = {
|
|
|
279
279
|
onClick: _propTypes.default.func.isRequired,
|
|
280
280
|
onInput: _propTypes.default.func.isRequired,
|
|
281
281
|
onKeyDown: _propTypes.default.func.isRequired,
|
|
282
|
+
onMouseDown: _propTypes.default.func.isRequired,
|
|
282
283
|
onPaste: _propTypes.default.func.isRequired,
|
|
283
284
|
ownerState: _propTypes.default /* @typescript-to-proptypes-ignore */.any,
|
|
284
285
|
readOnly: _propTypes.default.bool,
|
|
@@ -272,6 +272,7 @@ process.env.NODE_ENV !== "production" ? PickersFilledInput.propTypes = {
|
|
|
272
272
|
onClick: PropTypes.func.isRequired,
|
|
273
273
|
onInput: PropTypes.func.isRequired,
|
|
274
274
|
onKeyDown: PropTypes.func.isRequired,
|
|
275
|
+
onMouseDown: PropTypes.func.isRequired,
|
|
275
276
|
onPaste: PropTypes.func.isRequired,
|
|
276
277
|
ownerState: PropTypes /* @typescript-to-proptypes-ignore */.any,
|
|
277
278
|
readOnly: PropTypes.bool,
|
|
@@ -197,6 +197,7 @@ process.env.NODE_ENV !== "production" ? PickersInput.propTypes = {
|
|
|
197
197
|
onClick: _propTypes.default.func.isRequired,
|
|
198
198
|
onInput: _propTypes.default.func.isRequired,
|
|
199
199
|
onKeyDown: _propTypes.default.func.isRequired,
|
|
200
|
+
onMouseDown: _propTypes.default.func.isRequired,
|
|
200
201
|
onPaste: _propTypes.default.func.isRequired,
|
|
201
202
|
ownerState: _propTypes.default /* @typescript-to-proptypes-ignore */.any,
|
|
202
203
|
readOnly: _propTypes.default.bool,
|
|
@@ -190,6 +190,7 @@ process.env.NODE_ENV !== "production" ? PickersInput.propTypes = {
|
|
|
190
190
|
onClick: PropTypes.func.isRequired,
|
|
191
191
|
onInput: PropTypes.func.isRequired,
|
|
192
192
|
onKeyDown: PropTypes.func.isRequired,
|
|
193
|
+
onMouseDown: PropTypes.func.isRequired,
|
|
193
194
|
onPaste: PropTypes.func.isRequired,
|
|
194
195
|
ownerState: PropTypes /* @typescript-to-proptypes-ignore */.any,
|
|
195
196
|
readOnly: PropTypes.bool,
|
|
@@ -88,39 +88,28 @@ const PickersInputBaseSectionsContainer = exports.PickersInputBaseSectionsContai
|
|
|
88
88
|
paddingTop: 1
|
|
89
89
|
}
|
|
90
90
|
}, {
|
|
91
|
+
// While the field is empty and blurred, the format is shown as a placeholder.
|
|
91
92
|
props: {
|
|
92
|
-
hasStartAdornment: false,
|
|
93
93
|
isFieldFocused: false,
|
|
94
94
|
isFieldValueEmpty: true
|
|
95
95
|
},
|
|
96
|
-
style: {
|
|
97
|
-
color: 'currentColor',
|
|
98
|
-
opacity: 0
|
|
99
|
-
}
|
|
100
|
-
}, {
|
|
101
|
-
props: {
|
|
102
|
-
hasStartAdornment: false,
|
|
103
|
-
isFieldFocused: false,
|
|
104
|
-
isFieldValueEmpty: true,
|
|
105
|
-
inputHasLabel: false
|
|
106
|
-
},
|
|
107
96
|
style: theme.vars ? {
|
|
108
97
|
opacity: theme.vars.opacity.inputPlaceholder
|
|
109
98
|
} : {
|
|
110
99
|
opacity: theme.palette.mode === 'light' ? 0.42 : 0.5
|
|
111
100
|
}
|
|
112
101
|
}, {
|
|
102
|
+
// ...except when a non-shrunk label sits in the notch, where the format would overlap it.
|
|
103
|
+
// A start adornment always shrinks the label, so it never triggers this case.
|
|
113
104
|
props: {
|
|
114
|
-
hasStartAdornment: false,
|
|
115
105
|
isFieldFocused: false,
|
|
116
106
|
isFieldValueEmpty: true,
|
|
107
|
+
hasStartAdornment: false,
|
|
117
108
|
inputHasLabel: true,
|
|
118
|
-
isLabelShrunk:
|
|
109
|
+
isLabelShrunk: false
|
|
119
110
|
},
|
|
120
|
-
style:
|
|
121
|
-
opacity:
|
|
122
|
-
} : {
|
|
123
|
-
opacity: theme.palette.mode === 'light' ? 0.42 : 0.5
|
|
111
|
+
style: {
|
|
112
|
+
opacity: 0
|
|
124
113
|
}
|
|
125
114
|
}]
|
|
126
115
|
}));
|
|
@@ -150,7 +139,16 @@ const PickersInputBaseSectionContent = (0, _styles.styled)(_PickersSectionList.U
|
|
|
150
139
|
// 23px
|
|
151
140
|
letterSpacing: 'inherit',
|
|
152
141
|
width: 'fit-content',
|
|
153
|
-
outline: 'none'
|
|
142
|
+
outline: 'none',
|
|
143
|
+
// Disables Chromium's focus-delegation onto contenteditable descendants
|
|
144
|
+
// while the field is not focused. Gated to Chromium via a Blink-only
|
|
145
|
+
// property, because the rule breaks Playwright's `fill()` on WebKit.
|
|
146
|
+
'@supports (-webkit-app-region: drag)': {
|
|
147
|
+
[`.${_pickersInputBaseClasses.pickersInputBaseClasses.root}:not(:focus-within) &`]: {
|
|
148
|
+
WebkitUserModify: 'read-only',
|
|
149
|
+
userSelect: 'none'
|
|
150
|
+
}
|
|
151
|
+
}
|
|
154
152
|
}));
|
|
155
153
|
const PickersInputBaseSectionSeparator = (0, _styles.styled)(_PickersSectionList.Unstable_PickersSectionListSectionSeparator, {
|
|
156
154
|
name: 'MuiPickersInputBase',
|
|
@@ -216,7 +214,8 @@ const useUtilityClasses = (classes, ownerState) => {
|
|
|
216
214
|
return (0, _composeClasses.default)(slots, _pickersInputBaseClasses.getPickersInputBaseUtilityClass, classes);
|
|
217
215
|
};
|
|
218
216
|
function resolveSectionElementWidth(sectionElement, rootRef, index, dateRangePosition) {
|
|
219
|
-
|
|
217
|
+
// Only measure sections that belong to a range date.
|
|
218
|
+
if (sectionElement.content['data-range-position'] !== undefined) {
|
|
220
219
|
const activeSectionElements = rootRef.current?.querySelectorAll(`[data-sectionindex="${index}"] [data-range-position="${dateRangePosition}"]`);
|
|
221
220
|
if (activeSectionElements) {
|
|
222
221
|
return Array.from(activeSectionElements).reduce((currentActiveBarWidth, element) => {
|
|
@@ -461,6 +460,7 @@ process.env.NODE_ENV !== "production" ? PickersInputBase.propTypes = {
|
|
|
461
460
|
onClick: _propTypes.default.func.isRequired,
|
|
462
461
|
onInput: _propTypes.default.func.isRequired,
|
|
463
462
|
onKeyDown: _propTypes.default.func.isRequired,
|
|
463
|
+
onMouseDown: _propTypes.default.func.isRequired,
|
|
464
464
|
onPaste: _propTypes.default.func.isRequired,
|
|
465
465
|
ownerState: _propTypes.default /* @typescript-to-proptypes-ignore */.any,
|
|
466
466
|
readOnly: _propTypes.default.bool,
|
|
@@ -81,39 +81,28 @@ export const PickersInputBaseSectionsContainer = styled(PickersSectionListRoot,
|
|
|
81
81
|
paddingTop: 1
|
|
82
82
|
}
|
|
83
83
|
}, {
|
|
84
|
+
// While the field is empty and blurred, the format is shown as a placeholder.
|
|
84
85
|
props: {
|
|
85
|
-
hasStartAdornment: false,
|
|
86
86
|
isFieldFocused: false,
|
|
87
87
|
isFieldValueEmpty: true
|
|
88
88
|
},
|
|
89
|
-
style: {
|
|
90
|
-
color: 'currentColor',
|
|
91
|
-
opacity: 0
|
|
92
|
-
}
|
|
93
|
-
}, {
|
|
94
|
-
props: {
|
|
95
|
-
hasStartAdornment: false,
|
|
96
|
-
isFieldFocused: false,
|
|
97
|
-
isFieldValueEmpty: true,
|
|
98
|
-
inputHasLabel: false
|
|
99
|
-
},
|
|
100
89
|
style: theme.vars ? {
|
|
101
90
|
opacity: theme.vars.opacity.inputPlaceholder
|
|
102
91
|
} : {
|
|
103
92
|
opacity: theme.palette.mode === 'light' ? 0.42 : 0.5
|
|
104
93
|
}
|
|
105
94
|
}, {
|
|
95
|
+
// ...except when a non-shrunk label sits in the notch, where the format would overlap it.
|
|
96
|
+
// A start adornment always shrinks the label, so it never triggers this case.
|
|
106
97
|
props: {
|
|
107
|
-
hasStartAdornment: false,
|
|
108
98
|
isFieldFocused: false,
|
|
109
99
|
isFieldValueEmpty: true,
|
|
100
|
+
hasStartAdornment: false,
|
|
110
101
|
inputHasLabel: true,
|
|
111
|
-
isLabelShrunk:
|
|
102
|
+
isLabelShrunk: false
|
|
112
103
|
},
|
|
113
|
-
style:
|
|
114
|
-
opacity:
|
|
115
|
-
} : {
|
|
116
|
-
opacity: theme.palette.mode === 'light' ? 0.42 : 0.5
|
|
104
|
+
style: {
|
|
105
|
+
opacity: 0
|
|
117
106
|
}
|
|
118
107
|
}]
|
|
119
108
|
}));
|
|
@@ -143,7 +132,16 @@ const PickersInputBaseSectionContent = styled(PickersSectionListSectionContent,
|
|
|
143
132
|
// 23px
|
|
144
133
|
letterSpacing: 'inherit',
|
|
145
134
|
width: 'fit-content',
|
|
146
|
-
outline: 'none'
|
|
135
|
+
outline: 'none',
|
|
136
|
+
// Disables Chromium's focus-delegation onto contenteditable descendants
|
|
137
|
+
// while the field is not focused. Gated to Chromium via a Blink-only
|
|
138
|
+
// property, because the rule breaks Playwright's `fill()` on WebKit.
|
|
139
|
+
'@supports (-webkit-app-region: drag)': {
|
|
140
|
+
[`.${pickersInputBaseClasses.root}:not(:focus-within) &`]: {
|
|
141
|
+
WebkitUserModify: 'read-only',
|
|
142
|
+
userSelect: 'none'
|
|
143
|
+
}
|
|
144
|
+
}
|
|
147
145
|
}));
|
|
148
146
|
const PickersInputBaseSectionSeparator = styled(PickersSectionListSectionSeparator, {
|
|
149
147
|
name: 'MuiPickersInputBase',
|
|
@@ -209,7 +207,8 @@ const useUtilityClasses = (classes, ownerState) => {
|
|
|
209
207
|
return composeClasses(slots, getPickersInputBaseUtilityClass, classes);
|
|
210
208
|
};
|
|
211
209
|
function resolveSectionElementWidth(sectionElement, rootRef, index, dateRangePosition) {
|
|
212
|
-
|
|
210
|
+
// Only measure sections that belong to a range date.
|
|
211
|
+
if (sectionElement.content['data-range-position'] !== undefined) {
|
|
213
212
|
const activeSectionElements = rootRef.current?.querySelectorAll(`[data-sectionindex="${index}"] [data-range-position="${dateRangePosition}"]`);
|
|
214
213
|
if (activeSectionElements) {
|
|
215
214
|
return Array.from(activeSectionElements).reduce((currentActiveBarWidth, element) => {
|
|
@@ -454,6 +453,7 @@ process.env.NODE_ENV !== "production" ? PickersInputBase.propTypes = {
|
|
|
454
453
|
onClick: PropTypes.func.isRequired,
|
|
455
454
|
onInput: PropTypes.func.isRequired,
|
|
456
455
|
onKeyDown: PropTypes.func.isRequired,
|
|
456
|
+
onMouseDown: PropTypes.func.isRequired,
|
|
457
457
|
onPaste: PropTypes.func.isRequired,
|
|
458
458
|
ownerState: PropTypes /* @typescript-to-proptypes-ignore */.any,
|
|
459
459
|
readOnly: PropTypes.bool,
|
|
@@ -11,6 +11,7 @@ export interface PickersInputPropsUsedByField extends Pick<PickersSectionListPro
|
|
|
11
11
|
*/
|
|
12
12
|
areAllSectionsEmpty: boolean;
|
|
13
13
|
onClick: React.MouseEventHandler<HTMLDivElement>;
|
|
14
|
+
onMouseDown: React.MouseEventHandler<HTMLDivElement>;
|
|
14
15
|
onKeyDown: React.EventHandler<MuiEvent<React.KeyboardEvent<HTMLDivElement>>>;
|
|
15
16
|
onInput: React.FormEventHandler<HTMLDivElement>;
|
|
16
17
|
onPaste: React.ClipboardEventHandler<HTMLDivElement>;
|
|
@@ -11,6 +11,7 @@ export interface PickersInputPropsUsedByField extends Pick<PickersSectionListPro
|
|
|
11
11
|
*/
|
|
12
12
|
areAllSectionsEmpty: boolean;
|
|
13
13
|
onClick: React.MouseEventHandler<HTMLDivElement>;
|
|
14
|
+
onMouseDown: React.MouseEventHandler<HTMLDivElement>;
|
|
14
15
|
onKeyDown: React.EventHandler<MuiEvent<React.KeyboardEvent<HTMLDivElement>>>;
|
|
15
16
|
onInput: React.FormEventHandler<HTMLDivElement>;
|
|
16
17
|
onPaste: React.ClipboardEventHandler<HTMLDivElement>;
|
|
@@ -11,4 +11,4 @@ var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generat
|
|
|
11
11
|
function getPickersInputBaseUtilityClass(slot) {
|
|
12
12
|
return (0, _generateUtilityClass.default)('MuiPickersInputBase', slot);
|
|
13
13
|
}
|
|
14
|
-
const pickersInputBaseClasses = exports.pickersInputBaseClasses = (0, _generateUtilityClasses.default)('MuiPickersInputBase', ['root', 'focused', 'disabled', 'error', 'notchedOutline', 'sectionContent', 'sectionBefore', 'sectionAfter', 'adornedStart', 'adornedEnd', 'input', 'inputSizeSmall', 'activeBar']);
|
|
14
|
+
const pickersInputBaseClasses = exports.pickersInputBaseClasses = (0, _generateUtilityClasses.default)('MuiPickersInputBase', ['root', 'focused', 'disabled', 'readOnly', 'error', 'notchedOutline', 'sectionsContainer', 'sectionContent', 'sectionBefore', 'sectionAfter', 'adornedStart', 'adornedEnd', 'input', 'inputSizeSmall', 'activeBar']);
|
|
@@ -3,4 +3,4 @@ import generateUtilityClasses from '@mui/utils/generateUtilityClasses';
|
|
|
3
3
|
export function getPickersInputBaseUtilityClass(slot) {
|
|
4
4
|
return generateUtilityClass('MuiPickersInputBase', slot);
|
|
5
5
|
}
|
|
6
|
-
export const pickersInputBaseClasses = generateUtilityClasses('MuiPickersInputBase', ['root', 'focused', 'disabled', 'error', 'notchedOutline', 'sectionContent', 'sectionBefore', 'sectionAfter', 'adornedStart', 'adornedEnd', 'input', 'inputSizeSmall', 'activeBar']);
|
|
6
|
+
export const pickersInputBaseClasses = generateUtilityClasses('MuiPickersInputBase', ['root', 'focused', 'disabled', 'readOnly', 'error', 'notchedOutline', 'sectionsContainer', 'sectionContent', 'sectionBefore', 'sectionAfter', 'adornedStart', 'adornedEnd', 'input', 'inputSizeSmall', 'activeBar']);
|
|
@@ -112,14 +112,17 @@ const PickersOutlinedInput = exports.PickersOutlinedInput = /*#__PURE__*/React.f
|
|
|
112
112
|
root: PickersOutlinedInputRoot,
|
|
113
113
|
input: PickersOutlinedInputSectionsContainer
|
|
114
114
|
},
|
|
115
|
-
renderSuffix: state =>
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
115
|
+
renderSuffix: state => {
|
|
116
|
+
const isNotched = typeof notched !== 'undefined' ? notched : Boolean(state.adornedStart || state.focused || state.filled);
|
|
117
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Outline.default, {
|
|
118
|
+
shrink: isNotched,
|
|
119
|
+
notched: isNotched,
|
|
120
|
+
className: classes.notchedOutline,
|
|
121
|
+
label: label != null && label !== '' && muiFormControl?.required ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
|
|
122
|
+
children: [label, "\u2009", '*']
|
|
123
|
+
}) : label
|
|
124
|
+
});
|
|
125
|
+
}
|
|
123
126
|
}, other, {
|
|
124
127
|
label: label,
|
|
125
128
|
classes: classes,
|
|
@@ -169,6 +172,7 @@ process.env.NODE_ENV !== "production" ? PickersOutlinedInput.propTypes = {
|
|
|
169
172
|
onClick: _propTypes.default.func.isRequired,
|
|
170
173
|
onInput: _propTypes.default.func.isRequired,
|
|
171
174
|
onKeyDown: _propTypes.default.func.isRequired,
|
|
175
|
+
onMouseDown: _propTypes.default.func.isRequired,
|
|
172
176
|
onPaste: _propTypes.default.func.isRequired,
|
|
173
177
|
ownerState: _propTypes.default /* @typescript-to-proptypes-ignore */.any,
|
|
174
178
|
readOnly: _propTypes.default.bool,
|
|
@@ -105,14 +105,17 @@ const PickersOutlinedInput = /*#__PURE__*/React.forwardRef(function PickersOutli
|
|
|
105
105
|
root: PickersOutlinedInputRoot,
|
|
106
106
|
input: PickersOutlinedInputSectionsContainer
|
|
107
107
|
},
|
|
108
|
-
renderSuffix: state =>
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
108
|
+
renderSuffix: state => {
|
|
109
|
+
const isNotched = typeof notched !== 'undefined' ? notched : Boolean(state.adornedStart || state.focused || state.filled);
|
|
110
|
+
return /*#__PURE__*/_jsx(Outline, {
|
|
111
|
+
shrink: isNotched,
|
|
112
|
+
notched: isNotched,
|
|
113
|
+
className: classes.notchedOutline,
|
|
114
|
+
label: label != null && label !== '' && muiFormControl?.required ? /*#__PURE__*/_jsxs(React.Fragment, {
|
|
115
|
+
children: [label, "\u2009", '*']
|
|
116
|
+
}) : label
|
|
117
|
+
});
|
|
118
|
+
}
|
|
116
119
|
}, other, {
|
|
117
120
|
label: label,
|
|
118
121
|
classes: classes,
|
|
@@ -162,6 +165,7 @@ process.env.NODE_ENV !== "production" ? PickersOutlinedInput.propTypes = {
|
|
|
162
165
|
onClick: PropTypes.func.isRequired,
|
|
163
166
|
onInput: PropTypes.func.isRequired,
|
|
164
167
|
onKeyDown: PropTypes.func.isRequired,
|
|
168
|
+
onMouseDown: PropTypes.func.isRequired,
|
|
165
169
|
onPaste: PropTypes.func.isRequired,
|
|
166
170
|
ownerState: PropTypes /* @typescript-to-proptypes-ignore */.any,
|
|
167
171
|
readOnly: PropTypes.bool,
|
|
@@ -27,7 +27,7 @@ var _PickersInput = require("./PickersInput");
|
|
|
27
27
|
var _useFieldOwnerState = require("../internals/hooks/useFieldOwnerState");
|
|
28
28
|
var _usePickerTextFieldOwnerState = require("./usePickerTextFieldOwnerState");
|
|
29
29
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
30
|
-
const _excluded = ["onFocus", "onBlur", "className", "classes", "color", "disabled", "error", "variant", "required", "hiddenLabel", "InputProps", "inputProps", "inputRef", "sectionListRef", "elements", "areAllSectionsEmpty", "onClick", "onKeyDown", "onKeyUp", "onPaste", "onInput", "endAdornment", "startAdornment", "tabIndex", "contentEditable", "focused", "value", "onChange", "fullWidth", "id", "name", "helperText", "FormHelperTextProps", "label", "InputLabelProps", "data-active-range-position"];
|
|
30
|
+
const _excluded = ["onFocus", "onBlur", "className", "classes", "color", "disabled", "error", "variant", "required", "hiddenLabel", "InputProps", "inputProps", "inputRef", "sectionListRef", "elements", "areAllSectionsEmpty", "onClick", "onMouseDown", "onKeyDown", "onKeyUp", "onPaste", "onInput", "endAdornment", "startAdornment", "tabIndex", "contentEditable", "focused", "value", "onChange", "fullWidth", "id", "name", "helperText", "FormHelperTextProps", "label", "InputLabelProps", "data-active-range-position"];
|
|
31
31
|
const VARIANT_COMPONENT = {
|
|
32
32
|
standard: _PickersInput.PickersInput,
|
|
33
33
|
filled: _PickersFilledInput.PickersFilledInput,
|
|
@@ -75,6 +75,7 @@ const PickersTextField = exports.PickersTextField = /*#__PURE__*/React.forwardRe
|
|
|
75
75
|
elements,
|
|
76
76
|
areAllSectionsEmpty,
|
|
77
77
|
onClick,
|
|
78
|
+
onMouseDown,
|
|
78
79
|
onKeyDown,
|
|
79
80
|
onKeyUp,
|
|
80
81
|
onPaste,
|
|
@@ -155,6 +156,7 @@ const PickersTextField = exports.PickersTextField = /*#__PURE__*/React.forwardRe
|
|
|
155
156
|
elements: elements,
|
|
156
157
|
areAllSectionsEmpty: areAllSectionsEmpty,
|
|
157
158
|
onClick: onClick,
|
|
159
|
+
onMouseDown: onMouseDown,
|
|
158
160
|
onKeyDown: onKeyDown,
|
|
159
161
|
onKeyUp: onKeyUp,
|
|
160
162
|
onInput: onInput,
|
|
@@ -267,6 +269,7 @@ process.env.NODE_ENV !== "production" ? PickersTextField.propTypes = {
|
|
|
267
269
|
onFocus: _propTypes.default.func.isRequired,
|
|
268
270
|
onInput: _propTypes.default.func.isRequired,
|
|
269
271
|
onKeyDown: _propTypes.default.func.isRequired,
|
|
272
|
+
onMouseDown: _propTypes.default.func.isRequired,
|
|
270
273
|
onPaste: _propTypes.default.func.isRequired,
|
|
271
274
|
readOnly: _propTypes.default.bool,
|
|
272
275
|
/**
|
|
@@ -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 = ["onFocus", "onBlur", "className", "classes", "color", "disabled", "error", "variant", "required", "hiddenLabel", "InputProps", "inputProps", "inputRef", "sectionListRef", "elements", "areAllSectionsEmpty", "onClick", "onKeyDown", "onKeyUp", "onPaste", "onInput", "endAdornment", "startAdornment", "tabIndex", "contentEditable", "focused", "value", "onChange", "fullWidth", "id", "name", "helperText", "FormHelperTextProps", "label", "InputLabelProps", "data-active-range-position"];
|
|
5
|
+
const _excluded = ["onFocus", "onBlur", "className", "classes", "color", "disabled", "error", "variant", "required", "hiddenLabel", "InputProps", "inputProps", "inputRef", "sectionListRef", "elements", "areAllSectionsEmpty", "onClick", "onMouseDown", "onKeyDown", "onKeyUp", "onPaste", "onInput", "endAdornment", "startAdornment", "tabIndex", "contentEditable", "focused", "value", "onChange", "fullWidth", "id", "name", "helperText", "FormHelperTextProps", "label", "InputLabelProps", "data-active-range-position"];
|
|
6
6
|
import * as React from 'react';
|
|
7
7
|
import PropTypes from 'prop-types';
|
|
8
8
|
import clsx from 'clsx';
|
|
@@ -68,6 +68,7 @@ const PickersTextField = /*#__PURE__*/React.forwardRef(function PickersTextField
|
|
|
68
68
|
elements,
|
|
69
69
|
areAllSectionsEmpty,
|
|
70
70
|
onClick,
|
|
71
|
+
onMouseDown,
|
|
71
72
|
onKeyDown,
|
|
72
73
|
onKeyUp,
|
|
73
74
|
onPaste,
|
|
@@ -148,6 +149,7 @@ const PickersTextField = /*#__PURE__*/React.forwardRef(function PickersTextField
|
|
|
148
149
|
elements: elements,
|
|
149
150
|
areAllSectionsEmpty: areAllSectionsEmpty,
|
|
150
151
|
onClick: onClick,
|
|
152
|
+
onMouseDown: onMouseDown,
|
|
151
153
|
onKeyDown: onKeyDown,
|
|
152
154
|
onKeyUp: onKeyUp,
|
|
153
155
|
onInput: onInput,
|
|
@@ -260,6 +262,7 @@ process.env.NODE_ENV !== "production" ? PickersTextField.propTypes = {
|
|
|
260
262
|
onFocus: PropTypes.func.isRequired,
|
|
261
263
|
onInput: PropTypes.func.isRequired,
|
|
262
264
|
onKeyDown: PropTypes.func.isRequired,
|
|
265
|
+
onMouseDown: PropTypes.func.isRequired,
|
|
263
266
|
onPaste: PropTypes.func.isRequired,
|
|
264
267
|
readOnly: PropTypes.bool,
|
|
265
268
|
/**
|
package/index.js
CHANGED
package/index.mjs
CHANGED
|
@@ -107,6 +107,7 @@ export type UseFieldForwardedProps<TEnableAccessibleFieldDOMStructure extends bo
|
|
|
107
107
|
focused?: boolean;
|
|
108
108
|
sectionListRef?: React.Ref<PickersSectionListRef>;
|
|
109
109
|
onClick?: React.MouseEventHandler;
|
|
110
|
+
onMouseDown?: React.MouseEventHandler;
|
|
110
111
|
onKeyDown?: React.KeyboardEventHandler;
|
|
111
112
|
onFocus?: React.FocusEventHandler;
|
|
112
113
|
onBlur?: React.FocusEventHandler;
|
|
@@ -107,6 +107,7 @@ export type UseFieldForwardedProps<TEnableAccessibleFieldDOMStructure extends bo
|
|
|
107
107
|
focused?: boolean;
|
|
108
108
|
sectionListRef?: React.Ref<PickersSectionListRef>;
|
|
109
109
|
onClick?: React.MouseEventHandler;
|
|
110
|
+
onMouseDown?: React.MouseEventHandler;
|
|
110
111
|
onKeyDown?: React.KeyboardEventHandler;
|
|
111
112
|
onFocus?: React.FocusEventHandler;
|
|
112
113
|
onBlur?: React.FocusEventHandler;
|
|
@@ -6,7 +6,6 @@ export declare const getDateSectionConfigFromFormatToken: (adapter: MuiPickersAd
|
|
|
6
6
|
};
|
|
7
7
|
export declare const getDaysInWeekStr: (adapter: MuiPickersAdapter, format: string) => string[];
|
|
8
8
|
export declare const getLetterEditingOptions: (adapter: MuiPickersAdapter, timezone: PickersTimezone, sectionType: FieldSectionType, format: string) => string[];
|
|
9
|
-
export declare const FORMAT_SECONDS_NO_LEADING_ZEROS = "s";
|
|
10
9
|
export declare const getLocalizedDigits: (adapter: MuiPickersAdapter) => string[];
|
|
11
10
|
export declare const removeLocalizedDigits: (valueStr: string, localizedDigits: string[]) => string;
|
|
12
11
|
export declare const applyLocalizedDigits: (valueStr: string, localizedDigits: string[]) => string;
|
|
@@ -6,7 +6,6 @@ export declare const getDateSectionConfigFromFormatToken: (adapter: MuiPickersAd
|
|
|
6
6
|
};
|
|
7
7
|
export declare const getDaysInWeekStr: (adapter: MuiPickersAdapter, format: string) => string[];
|
|
8
8
|
export declare const getLetterEditingOptions: (adapter: MuiPickersAdapter, timezone: PickersTimezone, sectionType: FieldSectionType, format: string) => string[];
|
|
9
|
-
export declare const FORMAT_SECONDS_NO_LEADING_ZEROS = "s";
|
|
10
9
|
export declare const getLocalizedDigits: (adapter: MuiPickersAdapter) => string[];
|
|
11
10
|
export declare const removeLocalizedDigits: (valueStr: string, localizedDigits: string[]) => string;
|
|
12
11
|
export declare const applyLocalizedDigits: (valueStr: string, localizedDigits: string[]) => string;
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.validateSections = exports.removeLocalizedDigits = exports.parseSelectedSections = exports.mergeDateIntoReferenceDate = exports.isStringNumber = exports.isAndroid = exports.getSectionsBoundaries = exports.getSectionVisibleValue = exports.getSectionOrder = exports.getLocalizedDigits = exports.getLetterEditingOptions = exports.getDaysInWeekStr = exports.getDateSectionConfigFromFormatToken = exports.getDateFromDateSections = exports.doesSectionFormatHaveLeadingZeros = exports.createDateStrForV7HiddenInputFromSections = exports.createDateStrForV6InputFromSections = exports.cleanLeadingZeros = exports.cleanDigitSectionValue = exports.changeSectionValueFormat = exports.applyLocalizedDigits =
|
|
6
|
+
exports.validateSections = exports.removeLocalizedDigits = exports.parseSelectedSections = exports.mergeDateIntoReferenceDate = exports.isStringNumber = exports.isAndroid = exports.getSectionsBoundaries = exports.getSectionVisibleValue = exports.getSectionOrder = exports.getLocalizedDigits = exports.getLetterEditingOptions = exports.getDaysInWeekStr = exports.getDateSectionConfigFromFormatToken = exports.getDateFromDateSections = exports.doesSectionFormatHaveLeadingZeros = exports.createDateStrForV7HiddenInputFromSections = exports.createDateStrForV6InputFromSections = exports.cleanLeadingZeros = exports.cleanDigitSectionValue = exports.changeSectionValueFormat = exports.applyLocalizedDigits = void 0;
|
|
7
7
|
var _dateUtils = require("../../utils/date-utils");
|
|
8
8
|
var _timeUtils = require("../../utils/time-utils");
|
|
9
9
|
const getDateSectionConfigFromFormatToken = (adapter, formatToken) => {
|
|
@@ -63,7 +63,7 @@ const getLetterEditingOptions = (adapter, timezone, sectionType, format) => {
|
|
|
63
63
|
// This format should be the same on all the adapters
|
|
64
64
|
// If some adapter does not respect this convention, then we will need to hardcode the format on each adapter.
|
|
65
65
|
exports.getLetterEditingOptions = getLetterEditingOptions;
|
|
66
|
-
const FORMAT_SECONDS_NO_LEADING_ZEROS =
|
|
66
|
+
const FORMAT_SECONDS_NO_LEADING_ZEROS = 's';
|
|
67
67
|
const NON_LOCALIZED_DIGITS = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];
|
|
68
68
|
const getLocalizedDigits = adapter => {
|
|
69
69
|
const today = adapter.date(undefined);
|
|
@@ -54,7 +54,7 @@ export const getLetterEditingOptions = (adapter, timezone, sectionType, format)
|
|
|
54
54
|
|
|
55
55
|
// This format should be the same on all the adapters
|
|
56
56
|
// If some adapter does not respect this convention, then we will need to hardcode the format on each adapter.
|
|
57
|
-
|
|
57
|
+
const FORMAT_SECONDS_NO_LEADING_ZEROS = 's';
|
|
58
58
|
const NON_LOCALIZED_DIGITS = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];
|
|
59
59
|
export const getLocalizedDigits = adapter => {
|
|
60
60
|
const today = adapter.date(undefined);
|
|
@@ -24,6 +24,7 @@ interface UseFieldRootPropsReturnValue {
|
|
|
24
24
|
onBlur: React.FocusEventHandler<HTMLDivElement>;
|
|
25
25
|
onFocus: React.FocusEventHandler<HTMLDivElement>;
|
|
26
26
|
onClick: React.MouseEventHandler<HTMLDivElement>;
|
|
27
|
+
onMouseDown: React.MouseEventHandler<HTMLDivElement>;
|
|
27
28
|
onPaste: React.ClipboardEventHandler<HTMLDivElement>;
|
|
28
29
|
onInput: React.FormEventHandler<HTMLDivElement>;
|
|
29
30
|
contentEditable: boolean;
|