@mui/x-date-pickers 8.3.0 → 8.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/AdapterDateFns/AdapterDateFns.js +2 -1
- package/AdapterDateFnsJalali/AdapterDateFnsJalali.js +2 -1
- package/AdapterDateFnsJalaliV2/AdapterDateFnsJalaliV2.js +5 -1
- package/AdapterDateFnsV2/AdapterDateFnsV2.js +5 -1
- package/AdapterDayjs/AdapterDayjs.js +12 -9
- package/AdapterLuxon/AdapterLuxon.js +3 -2
- package/AdapterMoment/AdapterMoment.js +2 -2
- package/AdapterMomentHijri/AdapterMomentHijri.js +3 -0
- package/AdapterMomentJalaali/AdapterMomentJalaali.js +1 -0
- package/CHANGELOG.md +206 -10
- package/DateCalendar/DateCalendar.js +1 -0
- package/DateField/DateField.js +1 -0
- package/DatePicker/DatePicker.js +1 -0
- package/DatePicker/DatePickerToolbar.js +1 -0
- package/DateTimeField/DateTimeField.js +1 -0
- package/DateTimePicker/DateTimePicker.js +1 -0
- package/DateTimePicker/DateTimePickerTabs.js +1 -0
- package/DateTimePicker/DateTimePickerToolbar.js +1 -0
- package/DesktopDatePicker/DesktopDatePicker.js +1 -0
- package/DesktopDateTimePicker/DesktopDateTimePicker.js +2 -0
- package/DesktopDateTimePicker/DesktopDateTimePickerLayout.js +1 -0
- package/DesktopTimePicker/DesktopTimePicker.js +1 -0
- package/DigitalClock/DigitalClock.d.ts +1 -1
- package/DigitalClock/DigitalClock.js +1 -0
- package/LocalizationProvider/LocalizationProvider.js +2 -3
- package/MobileDatePicker/MobileDatePicker.js +1 -0
- package/MobileDateTimePicker/MobileDateTimePicker.js +1 -0
- package/MobileTimePicker/MobileTimePicker.js +1 -0
- package/MonthCalendar/MonthCalendar.js +1 -0
- package/MonthCalendar/MonthCalendarButton.js +2 -1
- package/MultiSectionDigitalClock/MultiSectionDigitalClock.js +5 -4
- package/MultiSectionDigitalClock/MultiSectionDigitalClockSection.js +2 -1
- package/PickersActionBar/PickersActionBar.js +2 -1
- package/PickersCalendarHeader/PickersCalendarHeader.js +1 -0
- package/PickersDay/PickersDay.js +3 -1
- package/PickersLayout/PickersLayout.d.ts +2 -2
- package/PickersLayout/PickersLayout.js +1 -0
- package/PickersSectionList/PickersSectionList.d.ts +1 -1
- package/PickersSectionList/PickersSectionList.js +1 -0
- package/PickersTextField/PickersFilledInput/PickersFilledInput.js +1 -0
- package/PickersTextField/PickersFilledInput/pickersFilledInputClasses.d.ts +6 -6
- package/PickersTextField/PickersInput/PickersInput.js +1 -0
- package/PickersTextField/PickersInput/pickersInputClasses.d.ts +6 -6
- package/PickersTextField/PickersInputBase/PickersInputBase.d.ts +2 -2
- package/PickersTextField/PickersInputBase/PickersInputBase.js +1 -0
- package/PickersTextField/PickersOutlinedInput/PickersOutlinedInput.js +1 -0
- package/PickersTextField/PickersOutlinedInput/pickersOutlinedInputClasses.d.ts +5 -5
- package/PickersTextField/PickersTextField.js +12 -2
- package/PickersTextField/usePickerTextFieldOwnerState.js +1 -0
- package/StaticDatePicker/StaticDatePicker.js +1 -0
- package/StaticDateTimePicker/StaticDateTimePicker.js +1 -0
- package/StaticTimePicker/StaticTimePicker.js +1 -0
- package/TimeClock/TimeClock.js +1 -0
- package/TimeField/TimeField.js +1 -0
- package/TimePicker/TimePicker.js +1 -0
- package/YearCalendar/YearCalendar.js +1 -0
- package/YearCalendar/YearCalendarButton.js +2 -1
- package/YearCalendar/yearCalendarClasses.d.ts +1 -1
- package/dateViewRenderers/dateViewRenderers.js +2 -1
- package/esm/AdapterDateFns/AdapterDateFns.js +2 -1
- package/esm/AdapterDateFnsJalali/AdapterDateFnsJalali.js +2 -1
- package/esm/AdapterDateFnsJalaliV2/AdapterDateFnsJalaliV2.js +5 -1
- package/esm/AdapterDateFnsV2/AdapterDateFnsV2.js +5 -1
- package/esm/AdapterDayjs/AdapterDayjs.js +12 -9
- package/esm/AdapterLuxon/AdapterLuxon.js +3 -2
- package/esm/AdapterMoment/AdapterMoment.js +2 -2
- package/esm/AdapterMomentHijri/AdapterMomentHijri.js +3 -0
- package/esm/AdapterMomentJalaali/AdapterMomentJalaali.js +1 -0
- package/esm/DateCalendar/DateCalendar.js +1 -0
- package/esm/DateField/DateField.js +1 -0
- package/esm/DatePicker/DatePicker.js +1 -0
- package/esm/DatePicker/DatePickerToolbar.js +1 -0
- package/esm/DateTimeField/DateTimeField.js +1 -0
- package/esm/DateTimePicker/DateTimePicker.js +1 -0
- package/esm/DateTimePicker/DateTimePickerTabs.js +1 -0
- package/esm/DateTimePicker/DateTimePickerToolbar.js +1 -0
- package/esm/DesktopDatePicker/DesktopDatePicker.js +1 -0
- package/esm/DesktopDateTimePicker/DesktopDateTimePicker.js +2 -0
- package/esm/DesktopDateTimePicker/DesktopDateTimePickerLayout.js +1 -0
- package/esm/DesktopTimePicker/DesktopTimePicker.js +1 -0
- package/esm/DigitalClock/DigitalClock.d.ts +1 -1
- package/esm/DigitalClock/DigitalClock.js +1 -0
- package/esm/LocalizationProvider/LocalizationProvider.js +2 -3
- package/esm/MobileDatePicker/MobileDatePicker.js +1 -0
- package/esm/MobileDateTimePicker/MobileDateTimePicker.js +1 -0
- package/esm/MobileTimePicker/MobileTimePicker.js +1 -0
- package/esm/MonthCalendar/MonthCalendar.js +1 -0
- package/esm/MonthCalendar/MonthCalendarButton.js +2 -1
- package/esm/MultiSectionDigitalClock/MultiSectionDigitalClock.js +1 -0
- package/esm/MultiSectionDigitalClock/MultiSectionDigitalClockSection.js +2 -1
- package/esm/PickersActionBar/PickersActionBar.js +1 -0
- package/esm/PickersCalendarHeader/PickersCalendarHeader.js +1 -0
- package/esm/PickersDay/PickersDay.js +3 -1
- package/esm/PickersLayout/PickersLayout.d.ts +2 -2
- package/esm/PickersLayout/PickersLayout.js +1 -0
- package/esm/PickersSectionList/PickersSectionList.d.ts +1 -1
- package/esm/PickersSectionList/PickersSectionList.js +1 -0
- package/esm/PickersTextField/PickersFilledInput/PickersFilledInput.js +1 -0
- package/esm/PickersTextField/PickersFilledInput/pickersFilledInputClasses.d.ts +6 -6
- package/esm/PickersTextField/PickersInput/PickersInput.js +1 -0
- package/esm/PickersTextField/PickersInput/pickersInputClasses.d.ts +6 -6
- package/esm/PickersTextField/PickersInputBase/PickersInputBase.d.ts +2 -2
- package/esm/PickersTextField/PickersInputBase/PickersInputBase.js +1 -0
- package/esm/PickersTextField/PickersOutlinedInput/PickersOutlinedInput.js +1 -0
- package/esm/PickersTextField/PickersOutlinedInput/pickersOutlinedInputClasses.d.ts +5 -5
- package/esm/PickersTextField/PickersTextField.js +12 -2
- package/esm/PickersTextField/usePickerTextFieldOwnerState.js +1 -0
- package/esm/StaticDatePicker/StaticDatePicker.js +1 -0
- package/esm/StaticDateTimePicker/StaticDateTimePicker.js +1 -0
- package/esm/StaticTimePicker/StaticTimePicker.js +1 -0
- package/esm/TimeClock/TimeClock.js +1 -0
- package/esm/TimeField/TimeField.js +1 -0
- package/esm/TimePicker/TimePicker.js +1 -0
- package/esm/YearCalendar/YearCalendar.js +1 -0
- package/esm/YearCalendar/YearCalendarButton.js +2 -1
- package/esm/YearCalendar/yearCalendarClasses.d.ts +1 -1
- package/esm/dateViewRenderers/dateViewRenderers.js +2 -1
- package/esm/hooks/useIsValidValue.js +1 -0
- package/esm/hooks/usePickerContext.js +1 -0
- package/esm/index.js +1 -1
- package/esm/internals/components/PickerFieldUI.js +1 -0
- package/esm/internals/components/PickerPopper/PickerPopper.js +1 -0
- package/esm/internals/components/PickerProvider.js +2 -0
- package/esm/internals/components/PickersArrowSwitcher/PickersArrowSwitcher.js +2 -1
- package/esm/internals/components/PickersArrowSwitcher/pickersArrowSwitcherClasses.d.ts +1 -1
- package/esm/internals/components/PickersToolbar.js +2 -1
- package/esm/internals/components/PickersToolbarButton.js +2 -1
- package/esm/internals/components/PickersToolbarText.js +2 -1
- package/esm/internals/components/pickersToolbarClasses.d.ts +1 -1
- package/esm/internals/hooks/useDesktopPicker/useDesktopPicker.js +1 -0
- package/esm/internals/hooks/useField/useFieldCharacterEditing.js +27 -11
- package/esm/internals/hooks/useField/useFieldSectionContainerProps.js +2 -3
- package/esm/internals/hooks/useField/useFieldSectionContentProps.js +2 -2
- package/esm/internals/hooks/useField/useFieldState.js +2 -2
- package/esm/internals/hooks/useMobilePicker/useMobilePicker.js +1 -0
- package/esm/internals/hooks/useNullableFieldPrivateContext.js +1 -0
- package/esm/internals/hooks/useStaticPicker/useStaticPicker.js +1 -0
- package/esm/timeViewRenderers/timeViewRenderers.js +4 -1
- package/hooks/useIsValidValue.js +1 -0
- package/hooks/usePickerContext.js +1 -0
- package/index.js +1 -1
- package/internals/components/PickerFieldUI.js +1 -0
- package/internals/components/PickerPopper/PickerPopper.js +1 -0
- package/internals/components/PickerProvider.js +2 -0
- package/internals/components/PickersArrowSwitcher/PickersArrowSwitcher.js +2 -1
- package/internals/components/PickersArrowSwitcher/pickersArrowSwitcherClasses.d.ts +1 -1
- package/internals/components/PickersToolbar.js +2 -1
- package/internals/components/PickersToolbarButton.js +2 -1
- package/internals/components/PickersToolbarText.js +2 -1
- package/internals/components/pickersToolbarClasses.d.ts +1 -1
- package/internals/hooks/useDesktopPicker/useDesktopPicker.js +1 -0
- package/internals/hooks/useField/useFieldCharacterEditing.js +27 -11
- package/internals/hooks/useField/useFieldSectionContainerProps.js +2 -4
- package/internals/hooks/useField/useFieldSectionContentProps.js +2 -2
- package/internals/hooks/useField/useFieldState.js +2 -2
- package/internals/hooks/useMobilePicker/useMobilePicker.js +1 -0
- package/internals/hooks/useNullableFieldPrivateContext.js +1 -0
- package/internals/hooks/useStaticPicker/useStaticPicker.js +1 -0
- package/package.json +2 -2
- package/timeViewRenderers/timeViewRenderers.js +4 -1
|
@@ -29,7 +29,9 @@ const VARIANT_COMPONENT = {
|
|
|
29
29
|
const PickersTextFieldRoot = styled(FormControl, {
|
|
30
30
|
name: 'MuiPickersTextField',
|
|
31
31
|
slot: 'Root'
|
|
32
|
-
})({
|
|
32
|
+
})({
|
|
33
|
+
maxWidth: '100%'
|
|
34
|
+
});
|
|
33
35
|
const useUtilityClasses = (classes, ownerState) => {
|
|
34
36
|
const {
|
|
35
37
|
isFieldFocused,
|
|
@@ -112,6 +114,13 @@ const PickersTextField = /*#__PURE__*/React.forwardRef(function PickersTextField
|
|
|
112
114
|
}), [fieldOwnerState, areAllSectionsEmpty, focused, error, props.size, color, fullWidth, startAdornment, endAdornment, InputProps?.startAdornment, InputProps?.endAdornment, label]);
|
|
113
115
|
const classes = useUtilityClasses(classesProp, ownerState);
|
|
114
116
|
const PickersInputComponent = VARIANT_COMPONENT[variant];
|
|
117
|
+
const inputAdditionalProps = {};
|
|
118
|
+
if (variant === 'outlined') {
|
|
119
|
+
if (InputLabelProps && typeof InputLabelProps.shrink !== 'undefined') {
|
|
120
|
+
inputAdditionalProps.notched = InputLabelProps.shrink;
|
|
121
|
+
}
|
|
122
|
+
inputAdditionalProps.label = label;
|
|
123
|
+
}
|
|
115
124
|
return /*#__PURE__*/_jsx(PickerTextFieldOwnerStateContext.Provider, {
|
|
116
125
|
value: ownerState,
|
|
117
126
|
children: /*#__PURE__*/_jsxs(PickersTextFieldRoot, _extends({
|
|
@@ -159,7 +168,7 @@ const PickersTextField = /*#__PURE__*/React.forwardRef(function PickersTextField
|
|
|
159
168
|
"aria-describedby": helperTextId,
|
|
160
169
|
"aria-live": helperTextId ? 'polite' : undefined,
|
|
161
170
|
"data-active-range-position": dataActiveRangePosition
|
|
162
|
-
}, InputProps)), helperText && /*#__PURE__*/_jsx(FormHelperText, _extends({
|
|
171
|
+
}, inputAdditionalProps, InputProps)), helperText && /*#__PURE__*/_jsx(FormHelperText, _extends({
|
|
163
172
|
id: helperTextId
|
|
164
173
|
}, FormHelperTextProps, {
|
|
165
174
|
children: helperText
|
|
@@ -167,6 +176,7 @@ const PickersTextField = /*#__PURE__*/React.forwardRef(function PickersTextField
|
|
|
167
176
|
}))
|
|
168
177
|
});
|
|
169
178
|
});
|
|
179
|
+
if (process.env.NODE_ENV !== "production") PickersTextField.displayName = "PickersTextField";
|
|
170
180
|
process.env.NODE_ENV !== "production" ? PickersTextField.propTypes = {
|
|
171
181
|
// ----------------------------- Warning --------------------------------
|
|
172
182
|
// | These PropTypes are generated from the TypeScript type definitions |
|
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
import * as React from 'react';
|
|
4
4
|
export const PickerTextFieldOwnerStateContext = /*#__PURE__*/React.createContext(null);
|
|
5
|
+
if (process.env.NODE_ENV !== "production") PickerTextFieldOwnerStateContext.displayName = "PickerTextFieldOwnerStateContext";
|
|
5
6
|
export const usePickerTextFieldOwnerState = () => {
|
|
6
7
|
const value = React.useContext(PickerTextFieldOwnerStateContext);
|
|
7
8
|
if (value == null) {
|
|
@@ -50,6 +50,7 @@ const StaticDatePicker = /*#__PURE__*/React.forwardRef(function StaticDatePicker
|
|
|
50
50
|
});
|
|
51
51
|
return renderPicker();
|
|
52
52
|
});
|
|
53
|
+
if (process.env.NODE_ENV !== "production") StaticDatePicker.displayName = "StaticDatePicker";
|
|
53
54
|
StaticDatePicker.propTypes = {
|
|
54
55
|
// ----------------------------- Warning --------------------------------
|
|
55
56
|
// | These PropTypes are generated from the TypeScript type definitions |
|
|
@@ -99,6 +99,7 @@ const StaticDateTimePicker = /*#__PURE__*/React.forwardRef(function StaticDateTi
|
|
|
99
99
|
});
|
|
100
100
|
return renderPicker();
|
|
101
101
|
});
|
|
102
|
+
if (process.env.NODE_ENV !== "production") StaticDateTimePicker.displayName = "StaticDateTimePicker";
|
|
102
103
|
StaticDateTimePicker.propTypes = {
|
|
103
104
|
// ----------------------------- Warning --------------------------------
|
|
104
105
|
// | These PropTypes are generated from the TypeScript type definitions |
|
|
@@ -52,6 +52,7 @@ const StaticTimePicker = /*#__PURE__*/React.forwardRef(function StaticTimePicker
|
|
|
52
52
|
});
|
|
53
53
|
return renderPicker();
|
|
54
54
|
});
|
|
55
|
+
if (process.env.NODE_ENV !== "production") StaticTimePicker.displayName = "StaticTimePicker";
|
|
55
56
|
StaticTimePicker.propTypes = {
|
|
56
57
|
// ----------------------------- Warning --------------------------------
|
|
57
58
|
// | These PropTypes are generated from the TypeScript type definitions |
|
|
@@ -329,6 +329,7 @@ export const TimeClock = /*#__PURE__*/React.forwardRef(function TimeClock(inProp
|
|
|
329
329
|
})]
|
|
330
330
|
}));
|
|
331
331
|
});
|
|
332
|
+
if (process.env.NODE_ENV !== "production") TimeClock.displayName = "TimeClock";
|
|
332
333
|
process.env.NODE_ENV !== "production" ? TimeClock.propTypes = {
|
|
333
334
|
// ----------------------------- Warning --------------------------------
|
|
334
335
|
// | These PropTypes are generated from the TypeScript type definitions |
|
|
@@ -43,6 +43,7 @@ const TimeField = /*#__PURE__*/React.forwardRef(function TimeField(inProps, inRe
|
|
|
43
43
|
defaultOpenPickerIcon: ClockIcon
|
|
44
44
|
});
|
|
45
45
|
});
|
|
46
|
+
if (process.env.NODE_ENV !== "production") TimeField.displayName = "TimeField";
|
|
46
47
|
process.env.NODE_ENV !== "production" ? TimeField.propTypes = {
|
|
47
48
|
// ----------------------------- Warning --------------------------------
|
|
48
49
|
// | These PropTypes are generated from the TypeScript type definitions |
|
|
@@ -45,6 +45,7 @@ const TimePicker = /*#__PURE__*/React.forwardRef(function TimePicker(inProps, re
|
|
|
45
45
|
ref: ref
|
|
46
46
|
}, other));
|
|
47
47
|
});
|
|
48
|
+
if (process.env.NODE_ENV !== "production") TimePicker.displayName = "TimePicker";
|
|
48
49
|
process.env.NODE_ENV !== "production" ? TimePicker.propTypes = {
|
|
49
50
|
// ----------------------------- Warning --------------------------------
|
|
50
51
|
// | These PropTypes are generated from the TypeScript type definitions |
|
|
@@ -296,6 +296,7 @@ export const YearCalendar = /*#__PURE__*/React.forwardRef(function YearCalendar(
|
|
|
296
296
|
}, (_, index) => /*#__PURE__*/_jsx(YearCalendarButtonFiller, {}, index))]
|
|
297
297
|
}));
|
|
298
298
|
});
|
|
299
|
+
if (process.env.NODE_ENV !== "production") YearCalendar.displayName = "YearCalendar";
|
|
299
300
|
process.env.NODE_ENV !== "production" ? YearCalendar.propTypes = {
|
|
300
301
|
// ----------------------------- Warning --------------------------------
|
|
301
302
|
// | These PropTypes are generated from the TypeScript type definitions |
|
|
@@ -112,4 +112,5 @@ export const YearCalendarButton = /*#__PURE__*/React.memo(function YearCalendarB
|
|
|
112
112
|
className: classes.button
|
|
113
113
|
});
|
|
114
114
|
return /*#__PURE__*/_jsx(YearButton, _extends({}, yearButtonProps));
|
|
115
|
-
});
|
|
115
|
+
});
|
|
116
|
+
if (process.env.NODE_ENV !== "production") YearCalendarButton.displayName = "YearCalendarButton";
|
|
@@ -10,4 +10,4 @@ export interface YearCalendarClasses {
|
|
|
10
10
|
}
|
|
11
11
|
export type YearCalendarClassKey = keyof YearCalendarClasses;
|
|
12
12
|
export declare function getYearCalendarUtilityClass(slot: string): string;
|
|
13
|
-
export declare const yearCalendarClasses: Record<"
|
|
13
|
+
export declare const yearCalendarClasses: Record<"root" | "disabled" | "button" | "selected", string>;
|
|
@@ -6,6 +6,7 @@ export const IsValidValueContext = /*#__PURE__*/React.createContext(() => true);
|
|
|
6
6
|
/**
|
|
7
7
|
* Returns a function to check if a value is valid according to the validation props passed to the parent Picker.
|
|
8
8
|
*/
|
|
9
|
+
if (process.env.NODE_ENV !== "production") IsValidValueContext.displayName = "IsValidValueContext";
|
|
9
10
|
export function useIsValidValue() {
|
|
10
11
|
return React.useContext(IsValidValueContext);
|
|
11
12
|
}
|
|
@@ -6,6 +6,7 @@ export const PickerContext = /*#__PURE__*/React.createContext(null);
|
|
|
6
6
|
/**
|
|
7
7
|
* Returns the context passed by the Picker wrapping the current component.
|
|
8
8
|
*/
|
|
9
|
+
if (process.env.NODE_ENV !== "production") PickerContext.displayName = "PickerContext";
|
|
9
10
|
export const usePickerContext = () => {
|
|
10
11
|
const value = React.useContext(PickerContext);
|
|
11
12
|
if (value == null) {
|
package/esm/index.js
CHANGED
|
@@ -95,6 +95,7 @@ export const PickerFieldUIContext = /*#__PURE__*/React.createContext({
|
|
|
95
95
|
* Adds the button to open the Picker and the button to clear the value of the field.
|
|
96
96
|
* @ignore - internal component.
|
|
97
97
|
*/
|
|
98
|
+
if (process.env.NODE_ENV !== "production") PickerFieldUIContext.displayName = "PickerFieldUIContext";
|
|
98
99
|
export function PickerFieldUI(props) {
|
|
99
100
|
const {
|
|
100
101
|
slots,
|
|
@@ -197,6 +197,7 @@ const PickerPopperPaperWrapper = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
|
197
197
|
children: children
|
|
198
198
|
}));
|
|
199
199
|
});
|
|
200
|
+
if (process.env.NODE_ENV !== "production") PickerPopperPaperWrapper.displayName = "PickerPopperPaperWrapper";
|
|
200
201
|
export function PickerPopper(inProps) {
|
|
201
202
|
const props = useThemeProps({
|
|
202
203
|
props: inProps,
|
|
@@ -5,6 +5,7 @@ import { PickerFieldPrivateContext } from "../hooks/useNullableFieldPrivateConte
|
|
|
5
5
|
import { PickerContext } from "../../hooks/usePickerContext.js";
|
|
6
6
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
7
7
|
export const PickerActionsContext = /*#__PURE__*/React.createContext(null);
|
|
8
|
+
if (process.env.NODE_ENV !== "production") PickerActionsContext.displayName = "PickerActionsContext";
|
|
8
9
|
export const PickerPrivateContext = /*#__PURE__*/React.createContext({
|
|
9
10
|
ownerState: {
|
|
10
11
|
isPickerDisabled: false,
|
|
@@ -34,6 +35,7 @@ export const PickerPrivateContext = /*#__PURE__*/React.createContext({
|
|
|
34
35
|
*
|
|
35
36
|
* @ignore - do not document.
|
|
36
37
|
*/
|
|
38
|
+
if (process.env.NODE_ENV !== "production") PickerPrivateContext.displayName = "PickerPrivateContext";
|
|
37
39
|
export function PickerProvider(props) {
|
|
38
40
|
const {
|
|
39
41
|
contextValue,
|
|
@@ -170,4 +170,5 @@ export const PickersArrowSwitcher = /*#__PURE__*/React.forwardRef(function Picke
|
|
|
170
170
|
children: isRtl ? /*#__PURE__*/_jsx(LeftArrowIcon, _extends({}, leftArrowIconProps)) : /*#__PURE__*/_jsx(RightArrowIcon, _extends({}, rightArrowIconProps))
|
|
171
171
|
}))]
|
|
172
172
|
}));
|
|
173
|
-
});
|
|
173
|
+
});
|
|
174
|
+
if (process.env.NODE_ENV !== "production") PickersArrowSwitcher.displayName = "PickersArrowSwitcher";
|
|
@@ -16,4 +16,4 @@ export interface PickersArrowSwitcherClasses {
|
|
|
16
16
|
}
|
|
17
17
|
export type PickersArrowSwitcherClassKey = keyof PickersArrowSwitcherClasses;
|
|
18
18
|
export declare function getPickersArrowSwitcherUtilityClass(slot: string): string;
|
|
19
|
-
export declare const pickersArrowSwitcherClasses: Record<"
|
|
19
|
+
export declare const pickersArrowSwitcherClasses: Record<"root" | "button" | "spacer" | "previousIconButton" | "nextIconButton" | "leftArrowIcon" | "rightArrowIcon", string>;
|
|
@@ -8,4 +8,4 @@ export interface PickersToolbarClasses {
|
|
|
8
8
|
}
|
|
9
9
|
export type PickersToolbarClassKey = keyof PickersToolbarClasses;
|
|
10
10
|
export declare function getPickersToolbarUtilityClass(slot: string): string;
|
|
11
|
-
export declare const pickersToolbarClasses: Record<"
|
|
11
|
+
export declare const pickersToolbarClasses: Record<"root" | "content" | "title", string>;
|
|
@@ -126,7 +126,11 @@ export const useFieldCharacterEditing = ({
|
|
|
126
126
|
return applyQuery(params, getFirstSectionValueMatchingWithQuery);
|
|
127
127
|
};
|
|
128
128
|
const applyNumericEditing = params => {
|
|
129
|
-
const getNewSectionValue = (
|
|
129
|
+
const getNewSectionValue = ({
|
|
130
|
+
queryValue,
|
|
131
|
+
skipIfBelowMinimum,
|
|
132
|
+
section
|
|
133
|
+
}) => {
|
|
130
134
|
const cleanQueryValue = removeLocalizedDigits(queryValue, localizedDigits);
|
|
131
135
|
const queryValueNumber = Number(cleanQueryValue);
|
|
132
136
|
const sectionBoundaries = sectionsValueBoundaries[section.type]({
|
|
@@ -143,7 +147,7 @@ export const useFieldCharacterEditing = ({
|
|
|
143
147
|
// If the user types `0` on a month section,
|
|
144
148
|
// It is below the minimum, but we want to store the `0` in the query,
|
|
145
149
|
// So that when he pressed `1`, it will store `01` and move to the next section.
|
|
146
|
-
if (queryValueNumber < sectionBoundaries.minimum) {
|
|
150
|
+
if (skipIfBelowMinimum && queryValueNumber < sectionBoundaries.minimum) {
|
|
147
151
|
return {
|
|
148
152
|
saveQuery: true
|
|
149
153
|
};
|
|
@@ -157,20 +161,28 @@ export const useFieldCharacterEditing = ({
|
|
|
157
161
|
};
|
|
158
162
|
const getFirstSectionValueMatchingWithQuery = (queryValue, activeSection) => {
|
|
159
163
|
if (activeSection.contentType === 'digit' || activeSection.contentType === 'digit-with-letter') {
|
|
160
|
-
return getNewSectionValue(
|
|
164
|
+
return getNewSectionValue({
|
|
165
|
+
queryValue,
|
|
166
|
+
skipIfBelowMinimum: false,
|
|
167
|
+
section: activeSection
|
|
168
|
+
});
|
|
161
169
|
}
|
|
162
170
|
|
|
163
171
|
// When editing a letter-format month and the user presses a digit,
|
|
164
172
|
// We can support the numeric editing by using the digit-format month and re-formatting the result.
|
|
165
173
|
if (activeSection.type === 'month') {
|
|
166
174
|
const hasLeadingZerosInFormat = doesSectionFormatHaveLeadingZeros(utils, 'digit', 'month', 'MM');
|
|
167
|
-
const response = getNewSectionValue(
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
175
|
+
const response = getNewSectionValue({
|
|
176
|
+
queryValue,
|
|
177
|
+
skipIfBelowMinimum: true,
|
|
178
|
+
section: {
|
|
179
|
+
type: activeSection.type,
|
|
180
|
+
format: 'MM',
|
|
181
|
+
hasLeadingZerosInFormat,
|
|
182
|
+
hasLeadingZerosInInput: true,
|
|
183
|
+
contentType: 'digit',
|
|
184
|
+
maxLength: 2
|
|
185
|
+
}
|
|
174
186
|
});
|
|
175
187
|
if (isQueryResponseWithoutValue(response)) {
|
|
176
188
|
return response;
|
|
@@ -184,7 +196,11 @@ export const useFieldCharacterEditing = ({
|
|
|
184
196
|
// When editing a letter-format weekDay and the user presses a digit,
|
|
185
197
|
// We can support the numeric editing by returning the nth day in the week day array.
|
|
186
198
|
if (activeSection.type === 'weekDay') {
|
|
187
|
-
const response = getNewSectionValue(
|
|
199
|
+
const response = getNewSectionValue({
|
|
200
|
+
queryValue,
|
|
201
|
+
skipIfBelowMinimum: true,
|
|
202
|
+
section: activeSection
|
|
203
|
+
});
|
|
188
204
|
if (isQueryResponseWithoutValue(response)) {
|
|
189
205
|
return response;
|
|
190
206
|
}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import useEventCallback from '@mui/utils/useEventCallback';
|
|
3
2
|
/**
|
|
4
3
|
* Generate the props to pass to the container element of each section of the field.
|
|
5
4
|
* It is not used by the non-accessible DOM structure (with an <input /> element for editing).
|
|
@@ -17,14 +16,14 @@ export function useFieldSectionContainerProps(parameters) {
|
|
|
17
16
|
disabled = false
|
|
18
17
|
}
|
|
19
18
|
} = parameters;
|
|
20
|
-
const createHandleClick =
|
|
19
|
+
const createHandleClick = React.useCallback(sectionIndex => event => {
|
|
21
20
|
// The click event on the clear button would propagate to the input, trigger this handler and result in a wrong section selection.
|
|
22
21
|
// We avoid this by checking if the call to this function is actually intended, or a side effect.
|
|
23
22
|
if (disabled || event.isDefaultPrevented()) {
|
|
24
23
|
return;
|
|
25
24
|
}
|
|
26
25
|
setSelectedSections(sectionIndex);
|
|
27
|
-
});
|
|
26
|
+
}, [disabled, setSelectedSections]);
|
|
28
27
|
return React.useCallback(sectionIndex => ({
|
|
29
28
|
'data-sectionindex': sectionIndex,
|
|
30
29
|
onClick: createHandleClick(sectionIndex)
|
|
@@ -128,12 +128,12 @@ export function useFieldSectionContentProps(parameters) {
|
|
|
128
128
|
event.preventDefault();
|
|
129
129
|
event.dataTransfer.dropEffect = 'none';
|
|
130
130
|
});
|
|
131
|
-
const createFocusHandler =
|
|
131
|
+
const createFocusHandler = React.useCallback(sectionIndex => () => {
|
|
132
132
|
if (disabled) {
|
|
133
133
|
return;
|
|
134
134
|
}
|
|
135
135
|
setSelectedSections(sectionIndex);
|
|
136
|
-
});
|
|
136
|
+
}, [disabled, setSelectedSections]);
|
|
137
137
|
return React.useCallback((section, sectionIndex) => {
|
|
138
138
|
const sectionBoundaries = sectionsValueBoundaries[section.type]({
|
|
139
139
|
currentDate: fieldValueManager.getDateFromSection(value, section),
|
|
@@ -268,10 +268,10 @@ export const useFieldState = parameters => {
|
|
|
268
268
|
}
|
|
269
269
|
|
|
270
270
|
/**
|
|
271
|
-
* If all the sections are filled but the date is invalid,
|
|
271
|
+
* If all the sections are filled but the date is invalid and the previous date is valid or null,
|
|
272
272
|
* Then we publish an invalid date.
|
|
273
273
|
*/
|
|
274
|
-
if (newActiveDateSections.every(sectionBis => sectionBis.value !== '')) {
|
|
274
|
+
if (newActiveDateSections.every(sectionBis => sectionBis.value !== '') && (activeDate == null || utils.isValid(activeDate))) {
|
|
275
275
|
setSectionUpdateToApplyOnNextInvalidDate(newSectionValue);
|
|
276
276
|
return publishValue(fieldValueManager.updateDateInValue(value, section, newActiveDate));
|
|
277
277
|
}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
export const PickerFieldPrivateContext = /*#__PURE__*/React.createContext(null);
|
|
3
|
+
if (process.env.NODE_ENV !== "production") PickerFieldPrivateContext.displayName = "PickerFieldPrivateContext";
|
|
3
4
|
export function useNullableFieldPrivateContext() {
|
|
4
5
|
return React.useContext(PickerFieldPrivateContext);
|
|
5
6
|
}
|
|
@@ -63,6 +63,7 @@ export const renderTimeViewClock = ({
|
|
|
63
63
|
disableIgnoringDatePartForTimeValidation: disableIgnoringDatePartForTimeValidation,
|
|
64
64
|
timezone: timezone
|
|
65
65
|
});
|
|
66
|
+
if (process.env.NODE_ENV !== "production") renderTimeViewClock.displayName = "renderTimeViewClock";
|
|
66
67
|
export const renderDigitalClockTimeView = ({
|
|
67
68
|
view,
|
|
68
69
|
onViewChange,
|
|
@@ -122,6 +123,7 @@ export const renderDigitalClockTimeView = ({
|
|
|
122
123
|
skipDisabled: skipDisabled,
|
|
123
124
|
timezone: timezone
|
|
124
125
|
});
|
|
126
|
+
if (process.env.NODE_ENV !== "production") renderDigitalClockTimeView.displayName = "renderDigitalClockTimeView";
|
|
125
127
|
export const renderMultiSectionDigitalClockTimeView = ({
|
|
126
128
|
view,
|
|
127
129
|
onViewChange,
|
|
@@ -180,4 +182,5 @@ export const renderMultiSectionDigitalClockTimeView = ({
|
|
|
180
182
|
timeSteps: timeSteps,
|
|
181
183
|
skipDisabled: skipDisabled,
|
|
182
184
|
timezone: timezone
|
|
183
|
-
});
|
|
185
|
+
});
|
|
186
|
+
if (process.env.NODE_ENV !== "production") renderMultiSectionDigitalClockTimeView.displayName = "renderMultiSectionDigitalClockTimeView";
|
package/hooks/useIsValidValue.js
CHANGED
|
@@ -13,6 +13,7 @@ const IsValidValueContext = exports.IsValidValueContext = /*#__PURE__*/React.cre
|
|
|
13
13
|
/**
|
|
14
14
|
* Returns a function to check if a value is valid according to the validation props passed to the parent Picker.
|
|
15
15
|
*/
|
|
16
|
+
if (process.env.NODE_ENV !== "production") IsValidValueContext.displayName = "IsValidValueContext";
|
|
16
17
|
function useIsValidValue() {
|
|
17
18
|
return React.useContext(IsValidValueContext);
|
|
18
19
|
}
|
|
@@ -12,6 +12,7 @@ const PickerContext = exports.PickerContext = /*#__PURE__*/React.createContext(n
|
|
|
12
12
|
/**
|
|
13
13
|
* Returns the context passed by the Picker wrapping the current component.
|
|
14
14
|
*/
|
|
15
|
+
if (process.env.NODE_ENV !== "production") PickerContext.displayName = "PickerContext";
|
|
15
16
|
const usePickerContext = () => {
|
|
16
17
|
const value = React.useContext(PickerContext);
|
|
17
18
|
if (value == null) {
|
package/index.js
CHANGED
|
@@ -109,6 +109,7 @@ const PickerFieldUIContext = exports.PickerFieldUIContext = /*#__PURE__*/React.c
|
|
|
109
109
|
* Adds the button to open the Picker and the button to clear the value of the field.
|
|
110
110
|
* @ignore - internal component.
|
|
111
111
|
*/
|
|
112
|
+
if (process.env.NODE_ENV !== "production") PickerFieldUIContext.displayName = "PickerFieldUIContext";
|
|
112
113
|
function PickerFieldUI(props) {
|
|
113
114
|
const {
|
|
114
115
|
slots,
|
|
@@ -205,6 +205,7 @@ const PickerPopperPaperWrapper = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
|
205
205
|
children: children
|
|
206
206
|
}));
|
|
207
207
|
});
|
|
208
|
+
if (process.env.NODE_ENV !== "production") PickerPopperPaperWrapper.displayName = "PickerPopperPaperWrapper";
|
|
208
209
|
function PickerPopper(inProps) {
|
|
209
210
|
const props = (0, _styles.useThemeProps)({
|
|
210
211
|
props: inProps,
|
|
@@ -13,6 +13,7 @@ var _useNullableFieldPrivateContext = require("../hooks/useNullableFieldPrivateC
|
|
|
13
13
|
var _usePickerContext = require("../../hooks/usePickerContext");
|
|
14
14
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
15
15
|
const PickerActionsContext = exports.PickerActionsContext = /*#__PURE__*/React.createContext(null);
|
|
16
|
+
if (process.env.NODE_ENV !== "production") PickerActionsContext.displayName = "PickerActionsContext";
|
|
16
17
|
const PickerPrivateContext = exports.PickerPrivateContext = /*#__PURE__*/React.createContext({
|
|
17
18
|
ownerState: {
|
|
18
19
|
isPickerDisabled: false,
|
|
@@ -42,6 +43,7 @@ const PickerPrivateContext = exports.PickerPrivateContext = /*#__PURE__*/React.c
|
|
|
42
43
|
*
|
|
43
44
|
* @ignore - do not document.
|
|
44
45
|
*/
|
|
46
|
+
if (process.env.NODE_ENV !== "production") PickerPrivateContext.displayName = "PickerPrivateContext";
|
|
45
47
|
function PickerProvider(props) {
|
|
46
48
|
const {
|
|
47
49
|
contextValue,
|
|
@@ -178,4 +178,5 @@ const PickersArrowSwitcher = exports.PickersArrowSwitcher = /*#__PURE__*/React.f
|
|
|
178
178
|
children: isRtl ? /*#__PURE__*/(0, _jsxRuntime.jsx)(LeftArrowIcon, (0, _extends2.default)({}, leftArrowIconProps)) : /*#__PURE__*/(0, _jsxRuntime.jsx)(RightArrowIcon, (0, _extends2.default)({}, rightArrowIconProps))
|
|
179
179
|
}))]
|
|
180
180
|
}));
|
|
181
|
-
});
|
|
181
|
+
});
|
|
182
|
+
if (process.env.NODE_ENV !== "production") PickersArrowSwitcher.displayName = "PickersArrowSwitcher";
|
|
@@ -16,4 +16,4 @@ export interface PickersArrowSwitcherClasses {
|
|
|
16
16
|
}
|
|
17
17
|
export type PickersArrowSwitcherClassKey = keyof PickersArrowSwitcherClasses;
|
|
18
18
|
export declare function getPickersArrowSwitcherUtilityClass(slot: string): string;
|
|
19
|
-
export declare const pickersArrowSwitcherClasses: Record<"
|
|
19
|
+
export declare const pickersArrowSwitcherClasses: Record<"root" | "button" | "spacer" | "previousIconButton" | "nextIconButton" | "leftArrowIcon" | "rightArrowIcon", string>;
|
|
@@ -8,4 +8,4 @@ export interface PickersToolbarClasses {
|
|
|
8
8
|
}
|
|
9
9
|
export type PickersToolbarClassKey = keyof PickersToolbarClasses;
|
|
10
10
|
export declare function getPickersToolbarUtilityClass(slot: string): string;
|
|
11
|
-
export declare const pickersToolbarClasses: Record<"
|
|
11
|
+
export declare const pickersToolbarClasses: Record<"root" | "content" | "title", string>;
|
|
@@ -133,7 +133,11 @@ const useFieldCharacterEditing = ({
|
|
|
133
133
|
return applyQuery(params, getFirstSectionValueMatchingWithQuery);
|
|
134
134
|
};
|
|
135
135
|
const applyNumericEditing = params => {
|
|
136
|
-
const getNewSectionValue = (
|
|
136
|
+
const getNewSectionValue = ({
|
|
137
|
+
queryValue,
|
|
138
|
+
skipIfBelowMinimum,
|
|
139
|
+
section
|
|
140
|
+
}) => {
|
|
137
141
|
const cleanQueryValue = (0, _useField.removeLocalizedDigits)(queryValue, localizedDigits);
|
|
138
142
|
const queryValueNumber = Number(cleanQueryValue);
|
|
139
143
|
const sectionBoundaries = sectionsValueBoundaries[section.type]({
|
|
@@ -150,7 +154,7 @@ const useFieldCharacterEditing = ({
|
|
|
150
154
|
// If the user types `0` on a month section,
|
|
151
155
|
// It is below the minimum, but we want to store the `0` in the query,
|
|
152
156
|
// So that when he pressed `1`, it will store `01` and move to the next section.
|
|
153
|
-
if (queryValueNumber < sectionBoundaries.minimum) {
|
|
157
|
+
if (skipIfBelowMinimum && queryValueNumber < sectionBoundaries.minimum) {
|
|
154
158
|
return {
|
|
155
159
|
saveQuery: true
|
|
156
160
|
};
|
|
@@ -164,20 +168,28 @@ const useFieldCharacterEditing = ({
|
|
|
164
168
|
};
|
|
165
169
|
const getFirstSectionValueMatchingWithQuery = (queryValue, activeSection) => {
|
|
166
170
|
if (activeSection.contentType === 'digit' || activeSection.contentType === 'digit-with-letter') {
|
|
167
|
-
return getNewSectionValue(
|
|
171
|
+
return getNewSectionValue({
|
|
172
|
+
queryValue,
|
|
173
|
+
skipIfBelowMinimum: false,
|
|
174
|
+
section: activeSection
|
|
175
|
+
});
|
|
168
176
|
}
|
|
169
177
|
|
|
170
178
|
// When editing a letter-format month and the user presses a digit,
|
|
171
179
|
// We can support the numeric editing by using the digit-format month and re-formatting the result.
|
|
172
180
|
if (activeSection.type === 'month') {
|
|
173
181
|
const hasLeadingZerosInFormat = (0, _useField.doesSectionFormatHaveLeadingZeros)(utils, 'digit', 'month', 'MM');
|
|
174
|
-
const response = getNewSectionValue(
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
182
|
+
const response = getNewSectionValue({
|
|
183
|
+
queryValue,
|
|
184
|
+
skipIfBelowMinimum: true,
|
|
185
|
+
section: {
|
|
186
|
+
type: activeSection.type,
|
|
187
|
+
format: 'MM',
|
|
188
|
+
hasLeadingZerosInFormat,
|
|
189
|
+
hasLeadingZerosInInput: true,
|
|
190
|
+
contentType: 'digit',
|
|
191
|
+
maxLength: 2
|
|
192
|
+
}
|
|
181
193
|
});
|
|
182
194
|
if (isQueryResponseWithoutValue(response)) {
|
|
183
195
|
return response;
|
|
@@ -191,7 +203,11 @@ const useFieldCharacterEditing = ({
|
|
|
191
203
|
// When editing a letter-format weekDay and the user presses a digit,
|
|
192
204
|
// We can support the numeric editing by returning the nth day in the week day array.
|
|
193
205
|
if (activeSection.type === 'weekDay') {
|
|
194
|
-
const response = getNewSectionValue(
|
|
206
|
+
const response = getNewSectionValue({
|
|
207
|
+
queryValue,
|
|
208
|
+
skipIfBelowMinimum: true,
|
|
209
|
+
section: activeSection
|
|
210
|
+
});
|
|
195
211
|
if (isQueryResponseWithoutValue(response)) {
|
|
196
212
|
return response;
|
|
197
213
|
}
|