@mui/x-date-pickers 8.5.2 → 8.6.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/CHANGELOG.md +203 -11
- package/DateCalendar/DateCalendar.js +16 -16
- package/DateCalendar/DayCalendar.js +48 -48
- package/DateCalendar/useCalendarState.js +25 -25
- package/DateCalendar/useIsDateDisabled.js +2 -2
- package/DatePicker/DatePickerToolbar.js +7 -9
- package/DateTimeField/DateTimeField.js +1 -1
- package/DateTimePicker/DateTimePicker.js +1 -1
- package/DateTimePicker/DateTimePickerToolbar.js +12 -13
- package/DateTimePicker/shared.js +3 -3
- package/DesktopDatePicker/DesktopDatePicker.js +3 -3
- package/DesktopDateTimePicker/DesktopDateTimePicker.js +4 -4
- package/DesktopTimePicker/DesktopTimePicker.js +4 -4
- package/DigitalClock/DigitalClock.d.ts +1 -1
- package/DigitalClock/DigitalClock.js +16 -16
- package/LocalizationProvider/LocalizationProvider.d.ts +9 -3
- package/LocalizationProvider/LocalizationProvider.js +28 -19
- package/MobileDatePicker/MobileDatePicker.js +3 -3
- package/MobileDateTimePicker/MobileDateTimePicker.js +4 -4
- package/MobileTimePicker/MobileTimePicker.js +4 -4
- package/MonthCalendar/MonthCalendar.js +19 -18
- package/MultiSectionDigitalClock/MultiSectionDigitalClock.js +32 -32
- package/MultiSectionDigitalClock/MultiSectionDigitalClock.utils.d.ts +4 -4
- package/MultiSectionDigitalClock/MultiSectionDigitalClock.utils.js +7 -7
- package/PickerDay2/PickerDay2.js +3 -3
- package/PickersActionBar/PickersActionBar.d.ts +2 -2
- package/PickersActionBar/PickersActionBar.js +2 -2
- package/PickersCalendarHeader/PickersCalendarHeader.js +7 -8
- package/PickersDay/PickersDay.js +3 -3
- package/PickersDay/usePickerDayOwnerState.js +5 -5
- package/PickersTextField/PickersFilledInput/pickersFilledInputClasses.d.ts +1 -0
- package/PickersTextField/PickersInput/pickersInputClasses.d.ts +1 -0
- package/PickersTextField/PickersInputBase/pickersInputBaseClasses.d.ts +2 -0
- package/PickersTextField/PickersInputBase/pickersInputBaseClasses.js +1 -1
- package/PickersTextField/PickersOutlinedInput/pickersOutlinedInputClasses.d.ts +1 -0
- package/StaticDateTimePicker/StaticDateTimePicker.js +1 -1
- package/StaticTimePicker/StaticTimePicker.js +1 -1
- package/TimeClock/Clock.js +8 -9
- package/TimeClock/ClockNumbers.d.ts +3 -3
- package/TimeClock/ClockNumbers.js +5 -5
- package/TimeClock/TimeClock.js +29 -29
- package/TimeField/TimeField.js +1 -1
- package/TimePicker/TimePicker.js +1 -1
- package/TimePicker/TimePickerToolbar.js +7 -9
- package/TimePicker/shared.js +3 -3
- package/YearCalendar/YearCalendar.js +19 -18
- package/esm/DateCalendar/DateCalendar.js +16 -16
- package/esm/DateCalendar/DayCalendar.js +48 -48
- package/esm/DateCalendar/useCalendarState.js +25 -25
- package/esm/DateCalendar/useIsDateDisabled.js +2 -2
- package/esm/DatePicker/DatePickerToolbar.js +6 -8
- package/esm/DateTimeField/DateTimeField.js +1 -1
- package/esm/DateTimePicker/DateTimePicker.js +1 -1
- package/esm/DateTimePicker/DateTimePickerToolbar.js +11 -12
- package/esm/DateTimePicker/shared.js +3 -3
- package/esm/DesktopDatePicker/DesktopDatePicker.js +3 -3
- package/esm/DesktopDateTimePicker/DesktopDateTimePicker.js +4 -4
- package/esm/DesktopTimePicker/DesktopTimePicker.js +4 -4
- package/esm/DigitalClock/DigitalClock.d.ts +1 -1
- package/esm/DigitalClock/DigitalClock.js +16 -16
- package/esm/LocalizationProvider/LocalizationProvider.d.ts +9 -3
- package/esm/LocalizationProvider/LocalizationProvider.js +27 -18
- package/esm/MobileDatePicker/MobileDatePicker.js +3 -3
- package/esm/MobileDateTimePicker/MobileDateTimePicker.js +4 -4
- package/esm/MobileTimePicker/MobileTimePicker.js +4 -4
- package/esm/MonthCalendar/MonthCalendar.js +20 -19
- package/esm/MultiSectionDigitalClock/MultiSectionDigitalClock.js +32 -32
- package/esm/MultiSectionDigitalClock/MultiSectionDigitalClock.utils.d.ts +4 -4
- package/esm/MultiSectionDigitalClock/MultiSectionDigitalClock.utils.js +7 -7
- package/esm/PickerDay2/PickerDay2.js +3 -3
- package/esm/PickersActionBar/PickersActionBar.d.ts +2 -2
- package/esm/PickersActionBar/PickersActionBar.js +2 -2
- package/esm/PickersCalendarHeader/PickersCalendarHeader.js +6 -7
- package/esm/PickersDay/PickersDay.js +3 -3
- package/esm/PickersDay/usePickerDayOwnerState.js +5 -5
- package/esm/PickersTextField/PickersFilledInput/pickersFilledInputClasses.d.ts +1 -0
- package/esm/PickersTextField/PickersInput/pickersInputClasses.d.ts +1 -0
- package/esm/PickersTextField/PickersInputBase/pickersInputBaseClasses.d.ts +2 -0
- package/esm/PickersTextField/PickersInputBase/pickersInputBaseClasses.js +1 -1
- package/esm/PickersTextField/PickersOutlinedInput/pickersOutlinedInputClasses.d.ts +1 -0
- package/esm/StaticDateTimePicker/StaticDateTimePicker.js +1 -1
- package/esm/StaticTimePicker/StaticTimePicker.js +1 -1
- package/esm/TimeClock/Clock.js +7 -8
- package/esm/TimeClock/ClockNumbers.d.ts +3 -3
- package/esm/TimeClock/ClockNumbers.js +5 -5
- package/esm/TimeClock/TimeClock.js +29 -29
- package/esm/TimeField/TimeField.js +1 -1
- package/esm/TimePicker/TimePicker.js +1 -1
- package/esm/TimePicker/TimePickerToolbar.js +6 -8
- package/esm/TimePicker/shared.js +3 -3
- package/esm/YearCalendar/YearCalendar.js +20 -19
- package/esm/hooks/index.d.ts +2 -1
- package/esm/hooks/index.js +2 -1
- package/esm/hooks/useParsedFormat.js +6 -6
- package/esm/hooks/usePickerAdapter.d.ts +7 -0
- package/esm/hooks/usePickerAdapter.js +20 -0
- package/esm/hooks/usePickerTranslations.js +1 -1
- package/esm/index.js +1 -1
- package/esm/internals/components/pickersToolbarClasses.d.ts +1 -1
- package/esm/internals/demo/DemoContainer.d.ts +2 -3
- package/esm/internals/demo/DemoContainer.js +3 -2
- package/esm/internals/hooks/date-helpers-hooks.js +16 -16
- package/esm/internals/hooks/useClockReferenceDate.d.ts +2 -2
- package/esm/internals/hooks/useClockReferenceDate.js +3 -3
- package/esm/internals/hooks/useControlledValue.js +8 -7
- package/esm/internals/hooks/useField/buildSectionsFromFormat.d.ts +1 -1
- package/esm/internals/hooks/useField/buildSectionsFromFormat.js +17 -17
- package/esm/internals/hooks/useField/useField.types.d.ts +2 -2
- package/esm/internals/hooks/useField/useField.utils.d.ts +10 -10
- package/esm/internals/hooks/useField/useField.utils.js +69 -69
- package/esm/internals/hooks/useField/useFieldCharacterEditing.js +11 -11
- package/esm/internals/hooks/useField/useFieldRootHandleKeyDown.js +7 -7
- package/esm/internals/hooks/useField/useFieldSectionContentProps.js +15 -16
- package/esm/internals/hooks/useField/useFieldState.js +22 -24
- package/esm/internals/hooks/usePicker/hooks/useValueAndOpenStates.js +6 -6
- package/esm/internals/hooks/usePicker/usePicker.js +5 -6
- package/esm/internals/hooks/useUtils.d.ts +1 -8
- package/esm/internals/hooks/useUtils.js +3 -19
- package/esm/internals/index.d.ts +2 -1
- package/esm/internals/index.js +2 -1
- package/esm/internals/models/manager.d.ts +14 -14
- package/esm/internals/models/props/time.d.ts +1 -1
- package/esm/internals/utils/date-time-utils.d.ts +1 -1
- package/esm/internals/utils/date-time-utils.js +5 -5
- package/esm/internals/utils/date-utils.d.ts +11 -11
- package/esm/internals/utils/date-utils.js +34 -34
- package/esm/internals/utils/getDefaultReferenceDate.d.ts +2 -2
- package/esm/internals/utils/getDefaultReferenceDate.js +16 -16
- package/esm/internals/utils/time-utils.d.ts +5 -5
- package/esm/internals/utils/time-utils.js +12 -12
- package/esm/internals/utils/valueManagers.js +4 -4
- package/esm/managers/useDateManager.js +12 -12
- package/esm/managers/useDateTimeManager.js +13 -13
- package/esm/managers/useTimeManager.js +9 -10
- package/esm/validation/useValidation.d.ts +2 -3
- package/esm/validation/useValidation.js +2 -2
- package/esm/validation/validateDate.js +6 -6
- package/esm/validation/validateTime.js +6 -6
- package/hooks/index.d.ts +2 -1
- package/hooks/index.js +8 -1
- package/hooks/useParsedFormat.js +6 -6
- package/hooks/usePickerAdapter.d.ts +7 -0
- package/hooks/usePickerAdapter.js +29 -0
- package/hooks/usePickerTranslations.js +2 -2
- package/index.js +1 -1
- package/internals/components/pickersToolbarClasses.d.ts +1 -1
- package/internals/demo/DemoContainer.d.ts +2 -3
- package/internals/demo/DemoContainer.js +3 -2
- package/internals/hooks/date-helpers-hooks.js +16 -16
- package/internals/hooks/useClockReferenceDate.d.ts +2 -2
- package/internals/hooks/useClockReferenceDate.js +3 -3
- package/internals/hooks/useControlledValue.js +7 -7
- package/internals/hooks/useField/buildSectionsFromFormat.d.ts +1 -1
- package/internals/hooks/useField/buildSectionsFromFormat.js +17 -17
- package/internals/hooks/useField/useField.types.d.ts +2 -2
- package/internals/hooks/useField/useField.utils.d.ts +10 -10
- package/internals/hooks/useField/useField.utils.js +69 -69
- package/internals/hooks/useField/useFieldCharacterEditing.js +11 -11
- package/internals/hooks/useField/useFieldRootHandleKeyDown.js +7 -7
- package/internals/hooks/useField/useFieldSectionContentProps.js +14 -15
- package/internals/hooks/useField/useFieldState.js +23 -25
- package/internals/hooks/usePicker/hooks/useValueAndOpenStates.js +6 -6
- package/internals/hooks/usePicker/usePicker.js +5 -6
- package/internals/hooks/useUtils.d.ts +1 -8
- package/internals/hooks/useUtils.js +5 -24
- package/internals/index.d.ts +2 -1
- package/internals/index.js +2 -7
- package/internals/models/manager.d.ts +14 -14
- package/internals/models/props/time.d.ts +1 -1
- package/internals/utils/date-time-utils.d.ts +1 -1
- package/internals/utils/date-time-utils.js +5 -5
- package/internals/utils/date-utils.d.ts +11 -11
- package/internals/utils/date-utils.js +34 -34
- package/internals/utils/getDefaultReferenceDate.d.ts +2 -2
- package/internals/utils/getDefaultReferenceDate.js +16 -16
- package/internals/utils/time-utils.d.ts +5 -5
- package/internals/utils/time-utils.js +12 -12
- package/internals/utils/valueManagers.js +4 -4
- package/managers/useDateManager.js +12 -12
- package/managers/useDateTimeManager.js +13 -13
- package/managers/useTimeManager.js +10 -11
- package/package.json +2 -2
- package/validation/useValidation.d.ts +2 -3
- package/validation/useValidation.js +2 -2
- package/validation/validateDate.js +6 -6
- package/validation/validateTime.js +6 -6
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { FieldSectionsValueBoundaries, SectionOrdering, FieldSectionValueBoundaries, FieldParsedSelectedSections } from "./useField.types.js";
|
|
2
2
|
import { FieldSectionType, FieldSection, MuiPickersAdapter, FieldSectionContentType, PickersTimezone, PickerValidDate, FieldSelectedSections, PickerValueType, InferFieldSection } from "../../../models/index.js";
|
|
3
3
|
import { PickerValidValue } from "../../models/index.js";
|
|
4
|
-
export declare const getDateSectionConfigFromFormatToken: (
|
|
4
|
+
export declare const getDateSectionConfigFromFormatToken: (adapter: MuiPickersAdapter, formatToken: string) => Pick<FieldSection, "type" | "contentType"> & {
|
|
5
5
|
maxLength: number | undefined;
|
|
6
6
|
};
|
|
7
|
-
export declare const getDaysInWeekStr: (
|
|
8
|
-
export declare const getLetterEditingOptions: (
|
|
7
|
+
export declare const getDaysInWeekStr: (adapter: MuiPickersAdapter, format: string) => string[];
|
|
8
|
+
export declare const getLetterEditingOptions: (adapter: MuiPickersAdapter, timezone: PickersTimezone, sectionType: FieldSectionType, format: string) => string[];
|
|
9
9
|
export declare const FORMAT_SECONDS_NO_LEADING_ZEROS = "s";
|
|
10
|
-
export declare const getLocalizedDigits: (
|
|
10
|
+
export declare const getLocalizedDigits: (adapter: MuiPickersAdapter) => string[];
|
|
11
11
|
export declare const removeLocalizedDigits: (valueStr: string, localizedDigits: string[]) => string;
|
|
12
12
|
export declare const applyLocalizedDigits: (valueStr: string, localizedDigits: string[]) => string;
|
|
13
13
|
export declare const isStringNumber: (valueStr: string, localizedDigits: string[]) => boolean;
|
|
@@ -17,20 +17,20 @@ export declare const isStringNumber: (valueStr: string, localizedDigits: string[
|
|
|
17
17
|
* Warning: Should only be called with non-localized digits. Call `removeLocalizedDigits` with your value if needed.
|
|
18
18
|
*/
|
|
19
19
|
export declare const cleanLeadingZeros: (valueStr: string, size: number) => string;
|
|
20
|
-
export declare const cleanDigitSectionValue: (
|
|
20
|
+
export declare const cleanDigitSectionValue: (adapter: MuiPickersAdapter, value: number, sectionBoundaries: FieldSectionValueBoundaries<any>, localizedDigits: string[], section: Pick<FieldSection, "format" | "type" | "contentType" | "hasLeadingZerosInFormat" | "hasLeadingZerosInInput" | "maxLength">) => string;
|
|
21
21
|
export declare const getSectionVisibleValue: (section: FieldSection, target: "input-rtl" | "input-ltr" | "non-input", localizedDigits: string[]) => string;
|
|
22
|
-
export declare const changeSectionValueFormat: (
|
|
23
|
-
export declare const doesSectionFormatHaveLeadingZeros: (
|
|
22
|
+
export declare const changeSectionValueFormat: (adapter: MuiPickersAdapter, valueStr: string, currentFormat: string, newFormat: string) => string;
|
|
23
|
+
export declare const doesSectionFormatHaveLeadingZeros: (adapter: MuiPickersAdapter, contentType: FieldSectionContentType, sectionType: FieldSectionType, format: string) => boolean;
|
|
24
24
|
/**
|
|
25
25
|
* Some date libraries like `dayjs` don't support parsing from date with escaped characters.
|
|
26
26
|
* To make sure that the parsing works, we are building a format and a date without any separator.
|
|
27
27
|
*/
|
|
28
|
-
export declare const getDateFromDateSections: (
|
|
28
|
+
export declare const getDateFromDateSections: (adapter: MuiPickersAdapter, sections: FieldSection[], localizedDigits: string[]) => PickerValidDate;
|
|
29
29
|
export declare const createDateStrForV7HiddenInputFromSections: (sections: FieldSection[]) => string;
|
|
30
30
|
export declare const createDateStrForV6InputFromSections: (sections: FieldSection[], localizedDigits: string[], isRtl: boolean) => string;
|
|
31
|
-
export declare const getSectionsBoundaries: (
|
|
31
|
+
export declare const getSectionsBoundaries: (adapter: MuiPickersAdapter, localizedDigits: string[], timezone: PickersTimezone) => FieldSectionsValueBoundaries;
|
|
32
32
|
export declare const validateSections: <TValue extends PickerValidValue>(sections: InferFieldSection<TValue>[], valueType: PickerValueType) => void;
|
|
33
|
-
export declare const mergeDateIntoReferenceDate: (
|
|
33
|
+
export declare const mergeDateIntoReferenceDate: (adapter: MuiPickersAdapter, dateToTransferFrom: PickerValidDate, sections: FieldSection[], referenceDate: PickerValidDate, shouldLimitToEditedSections: boolean) => PickerValidDate;
|
|
34
34
|
export declare const isAndroid: () => boolean;
|
|
35
35
|
export declare const getSectionOrder: (sections: FieldSection[], shouldApplyRTL: boolean) => SectionOrdering;
|
|
36
36
|
export declare const parseSelectedSections: (selectedSections: FieldSelectedSections, sections: FieldSection[]) => FieldParsedSelectedSections;
|
|
@@ -5,8 +5,8 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
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 = exports.FORMAT_SECONDS_NO_LEADING_ZEROS = void 0;
|
|
7
7
|
var _dateUtils = require("../../utils/date-utils");
|
|
8
|
-
const getDateSectionConfigFromFormatToken = (
|
|
9
|
-
const config =
|
|
8
|
+
const getDateSectionConfigFromFormatToken = (adapter, formatToken) => {
|
|
9
|
+
const config = adapter.formatTokenMap[formatToken];
|
|
10
10
|
if (config == null) {
|
|
11
11
|
throw new Error([`MUI X: The token "${formatToken}" is not supported by the Date and Time Pickers.`, 'Please try using another token or open an issue on https://github.com/mui/mui-x/issues/new/choose if you think it should be supported.'].join('\n'));
|
|
12
12
|
}
|
|
@@ -24,33 +24,33 @@ const getDateSectionConfigFromFormatToken = (utils, formatToken) => {
|
|
|
24
24
|
};
|
|
25
25
|
};
|
|
26
26
|
exports.getDateSectionConfigFromFormatToken = getDateSectionConfigFromFormatToken;
|
|
27
|
-
const getDaysInWeekStr = (
|
|
27
|
+
const getDaysInWeekStr = (adapter, format) => {
|
|
28
28
|
const elements = [];
|
|
29
|
-
const now =
|
|
30
|
-
const startDate =
|
|
31
|
-
const endDate =
|
|
29
|
+
const now = adapter.date(undefined, 'default');
|
|
30
|
+
const startDate = adapter.startOfWeek(now);
|
|
31
|
+
const endDate = adapter.endOfWeek(now);
|
|
32
32
|
let current = startDate;
|
|
33
|
-
while (
|
|
33
|
+
while (adapter.isBefore(current, endDate)) {
|
|
34
34
|
elements.push(current);
|
|
35
|
-
current =
|
|
35
|
+
current = adapter.addDays(current, 1);
|
|
36
36
|
}
|
|
37
|
-
return elements.map(weekDay =>
|
|
37
|
+
return elements.map(weekDay => adapter.formatByString(weekDay, format));
|
|
38
38
|
};
|
|
39
39
|
exports.getDaysInWeekStr = getDaysInWeekStr;
|
|
40
|
-
const getLetterEditingOptions = (
|
|
40
|
+
const getLetterEditingOptions = (adapter, timezone, sectionType, format) => {
|
|
41
41
|
switch (sectionType) {
|
|
42
42
|
case 'month':
|
|
43
43
|
{
|
|
44
|
-
return (0, _dateUtils.getMonthsInYear)(
|
|
44
|
+
return (0, _dateUtils.getMonthsInYear)(adapter, adapter.date(undefined, timezone)).map(month => adapter.formatByString(month, format));
|
|
45
45
|
}
|
|
46
46
|
case 'weekDay':
|
|
47
47
|
{
|
|
48
|
-
return getDaysInWeekStr(
|
|
48
|
+
return getDaysInWeekStr(adapter, format);
|
|
49
49
|
}
|
|
50
50
|
case 'meridiem':
|
|
51
51
|
{
|
|
52
|
-
const now =
|
|
53
|
-
return [
|
|
52
|
+
const now = adapter.date(undefined, timezone);
|
|
53
|
+
return [adapter.startOfDay(now), adapter.endOfDay(now)].map(date => adapter.formatByString(date, format));
|
|
54
54
|
}
|
|
55
55
|
default:
|
|
56
56
|
{
|
|
@@ -64,15 +64,15 @@ const getLetterEditingOptions = (utils, timezone, sectionType, format) => {
|
|
|
64
64
|
exports.getLetterEditingOptions = getLetterEditingOptions;
|
|
65
65
|
const FORMAT_SECONDS_NO_LEADING_ZEROS = exports.FORMAT_SECONDS_NO_LEADING_ZEROS = 's';
|
|
66
66
|
const NON_LOCALIZED_DIGITS = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9'];
|
|
67
|
-
const getLocalizedDigits =
|
|
68
|
-
const today =
|
|
69
|
-
const formattedZero =
|
|
67
|
+
const getLocalizedDigits = adapter => {
|
|
68
|
+
const today = adapter.date(undefined);
|
|
69
|
+
const formattedZero = adapter.formatByString(adapter.setSeconds(today, 0), FORMAT_SECONDS_NO_LEADING_ZEROS);
|
|
70
70
|
if (formattedZero === '0') {
|
|
71
71
|
return NON_LOCALIZED_DIGITS;
|
|
72
72
|
}
|
|
73
73
|
return Array.from({
|
|
74
74
|
length: 10
|
|
75
|
-
}).map((_, index) =>
|
|
75
|
+
}).map((_, index) => adapter.formatByString(adapter.setSeconds(today, index), FORMAT_SECONDS_NO_LEADING_ZEROS));
|
|
76
76
|
};
|
|
77
77
|
exports.getLocalizedDigits = getLocalizedDigits;
|
|
78
78
|
const removeLocalizedDigits = (valueStr, localizedDigits) => {
|
|
@@ -116,7 +116,7 @@ const cleanLeadingZeros = (valueStr, size) => {
|
|
|
116
116
|
return Number(valueStr).toString().padStart(size, '0');
|
|
117
117
|
};
|
|
118
118
|
exports.cleanLeadingZeros = cleanLeadingZeros;
|
|
119
|
-
const cleanDigitSectionValue = (
|
|
119
|
+
const cleanDigitSectionValue = (adapter, value, sectionBoundaries, localizedDigits, section) => {
|
|
120
120
|
if (process.env.NODE_ENV !== 'production') {
|
|
121
121
|
if (section.type !== 'day' && section.contentType === 'digit-with-letter') {
|
|
122
122
|
throw new Error([`MUI X: The token "${section.format}" is a digit format with letter in it.'
|
|
@@ -124,8 +124,8 @@ const cleanDigitSectionValue = (utils, value, sectionBoundaries, localizedDigits
|
|
|
124
124
|
}
|
|
125
125
|
}
|
|
126
126
|
if (section.type === 'day' && section.contentType === 'digit-with-letter') {
|
|
127
|
-
const date =
|
|
128
|
-
return
|
|
127
|
+
const date = adapter.setDate(sectionBoundaries.longestMonth, value);
|
|
128
|
+
return adapter.formatByString(date, section.format);
|
|
129
129
|
}
|
|
130
130
|
|
|
131
131
|
// queryValue without leading `0` (`01` => `1`)
|
|
@@ -158,54 +158,54 @@ const getSectionVisibleValue = (section, target, localizedDigits) => {
|
|
|
158
158
|
return value;
|
|
159
159
|
};
|
|
160
160
|
exports.getSectionVisibleValue = getSectionVisibleValue;
|
|
161
|
-
const changeSectionValueFormat = (
|
|
161
|
+
const changeSectionValueFormat = (adapter, valueStr, currentFormat, newFormat) => {
|
|
162
162
|
if (process.env.NODE_ENV !== 'production') {
|
|
163
|
-
if (getDateSectionConfigFromFormatToken(
|
|
163
|
+
if (getDateSectionConfigFromFormatToken(adapter, currentFormat).type === 'weekDay') {
|
|
164
164
|
throw new Error("changeSectionValueFormat doesn't support week day formats");
|
|
165
165
|
}
|
|
166
166
|
}
|
|
167
|
-
return
|
|
167
|
+
return adapter.formatByString(adapter.parse(valueStr, currentFormat), newFormat);
|
|
168
168
|
};
|
|
169
169
|
exports.changeSectionValueFormat = changeSectionValueFormat;
|
|
170
|
-
const isFourDigitYearFormat = (
|
|
171
|
-
const doesSectionFormatHaveLeadingZeros = (
|
|
170
|
+
const isFourDigitYearFormat = (adapter, format) => adapter.formatByString(adapter.date(undefined, 'system'), format).length === 4;
|
|
171
|
+
const doesSectionFormatHaveLeadingZeros = (adapter, contentType, sectionType, format) => {
|
|
172
172
|
if (contentType !== 'digit') {
|
|
173
173
|
return false;
|
|
174
174
|
}
|
|
175
|
-
const now =
|
|
175
|
+
const now = adapter.date(undefined, 'default');
|
|
176
176
|
switch (sectionType) {
|
|
177
|
-
// We can't use `changeSectionValueFormat`, because `
|
|
177
|
+
// We can't use `changeSectionValueFormat`, because `adapter.parse('1', 'YYYY')` returns `1971` instead of `1`.
|
|
178
178
|
case 'year':
|
|
179
179
|
{
|
|
180
180
|
// Remove once https://github.com/iamkun/dayjs/pull/2847 is merged and bump dayjs version
|
|
181
|
-
if (
|
|
181
|
+
if (adapter.lib === 'dayjs' && format === 'YY') {
|
|
182
182
|
return true;
|
|
183
183
|
}
|
|
184
|
-
return
|
|
184
|
+
return adapter.formatByString(adapter.setYear(now, 1), format).startsWith('0');
|
|
185
185
|
}
|
|
186
186
|
case 'month':
|
|
187
187
|
{
|
|
188
|
-
return
|
|
188
|
+
return adapter.formatByString(adapter.startOfYear(now), format).length > 1;
|
|
189
189
|
}
|
|
190
190
|
case 'day':
|
|
191
191
|
{
|
|
192
|
-
return
|
|
192
|
+
return adapter.formatByString(adapter.startOfMonth(now), format).length > 1;
|
|
193
193
|
}
|
|
194
194
|
case 'weekDay':
|
|
195
195
|
{
|
|
196
|
-
return
|
|
196
|
+
return adapter.formatByString(adapter.startOfWeek(now), format).length > 1;
|
|
197
197
|
}
|
|
198
198
|
case 'hours':
|
|
199
199
|
{
|
|
200
|
-
return
|
|
200
|
+
return adapter.formatByString(adapter.setHours(now, 1), format).length > 1;
|
|
201
201
|
}
|
|
202
202
|
case 'minutes':
|
|
203
203
|
{
|
|
204
|
-
return
|
|
204
|
+
return adapter.formatByString(adapter.setMinutes(now, 1), format).length > 1;
|
|
205
205
|
}
|
|
206
206
|
case 'seconds':
|
|
207
207
|
{
|
|
208
|
-
return
|
|
208
|
+
return adapter.formatByString(adapter.setSeconds(now, 1), format).length > 1;
|
|
209
209
|
}
|
|
210
210
|
default:
|
|
211
211
|
{
|
|
@@ -219,7 +219,7 @@ const doesSectionFormatHaveLeadingZeros = (utils, contentType, sectionType, form
|
|
|
219
219
|
* To make sure that the parsing works, we are building a format and a date without any separator.
|
|
220
220
|
*/
|
|
221
221
|
exports.doesSectionFormatHaveLeadingZeros = doesSectionFormatHaveLeadingZeros;
|
|
222
|
-
const getDateFromDateSections = (
|
|
222
|
+
const getDateFromDateSections = (adapter, sections, localizedDigits) => {
|
|
223
223
|
// If we have both a day and a weekDay section,
|
|
224
224
|
// Then we skip the weekDay in the parsing because libraries like dayjs can't parse complicated formats containing a weekDay.
|
|
225
225
|
// dayjs(dayjs().format('dddd MMMM D YYYY'), 'dddd MMMM D YYYY')) // returns `Invalid Date` even if the format is valid.
|
|
@@ -236,7 +236,7 @@ const getDateFromDateSections = (utils, sections, localizedDigits) => {
|
|
|
236
236
|
}
|
|
237
237
|
const formatWithoutSeparator = sectionFormats.join(' ');
|
|
238
238
|
const dateWithoutSeparatorStr = sectionValues.join(' ');
|
|
239
|
-
return
|
|
239
|
+
return adapter.parse(dateWithoutSeparatorStr, formatWithoutSeparator);
|
|
240
240
|
};
|
|
241
241
|
exports.getDateFromDateSections = getDateFromDateSections;
|
|
242
242
|
const createDateStrForV7HiddenInputFromSections = sections => sections.map(section => {
|
|
@@ -261,15 +261,15 @@ const createDateStrForV6InputFromSections = (sections, localizedDigits, isRtl) =
|
|
|
261
261
|
return `\u2066${dateStr}\u2069`;
|
|
262
262
|
};
|
|
263
263
|
exports.createDateStrForV6InputFromSections = createDateStrForV6InputFromSections;
|
|
264
|
-
const getSectionsBoundaries = (
|
|
265
|
-
const today =
|
|
266
|
-
const endOfYear =
|
|
267
|
-
const endOfDay =
|
|
264
|
+
const getSectionsBoundaries = (adapter, localizedDigits, timezone) => {
|
|
265
|
+
const today = adapter.date(undefined, timezone);
|
|
266
|
+
const endOfYear = adapter.endOfYear(today);
|
|
267
|
+
const endOfDay = adapter.endOfDay(today);
|
|
268
268
|
const {
|
|
269
269
|
maxDaysInMonth,
|
|
270
270
|
longestMonth
|
|
271
|
-
} = (0, _dateUtils.getMonthsInYear)(
|
|
272
|
-
const daysInMonth =
|
|
271
|
+
} = (0, _dateUtils.getMonthsInYear)(adapter, today).reduce((acc, month) => {
|
|
272
|
+
const daysInMonth = adapter.getDaysInMonth(month);
|
|
273
273
|
if (daysInMonth > acc.maxDaysInMonth) {
|
|
274
274
|
return {
|
|
275
275
|
maxDaysInMonth: daysInMonth,
|
|
@@ -286,18 +286,18 @@ const getSectionsBoundaries = (utils, localizedDigits, timezone) => {
|
|
|
286
286
|
format
|
|
287
287
|
}) => ({
|
|
288
288
|
minimum: 0,
|
|
289
|
-
maximum: isFourDigitYearFormat(
|
|
289
|
+
maximum: isFourDigitYearFormat(adapter, format) ? 9999 : 99
|
|
290
290
|
}),
|
|
291
291
|
month: () => ({
|
|
292
292
|
minimum: 1,
|
|
293
293
|
// Assumption: All years have the same amount of months
|
|
294
|
-
maximum:
|
|
294
|
+
maximum: adapter.getMonth(endOfYear) + 1
|
|
295
295
|
}),
|
|
296
296
|
day: ({
|
|
297
297
|
currentDate
|
|
298
298
|
}) => ({
|
|
299
299
|
minimum: 1,
|
|
300
|
-
maximum:
|
|
300
|
+
maximum: adapter.isValid(currentDate) ? adapter.getDaysInMonth(currentDate) : maxDaysInMonth,
|
|
301
301
|
longestMonth: longestMonth
|
|
302
302
|
}),
|
|
303
303
|
weekDay: ({
|
|
@@ -305,7 +305,7 @@ const getSectionsBoundaries = (utils, localizedDigits, timezone) => {
|
|
|
305
305
|
contentType
|
|
306
306
|
}) => {
|
|
307
307
|
if (contentType === 'digit') {
|
|
308
|
-
const daysInWeek = getDaysInWeekStr(
|
|
308
|
+
const daysInWeek = getDaysInWeekStr(adapter, format).map(Number);
|
|
309
309
|
return {
|
|
310
310
|
minimum: Math.min(...daysInWeek),
|
|
311
311
|
maximum: Math.max(...daysInWeek)
|
|
@@ -319,12 +319,12 @@ const getSectionsBoundaries = (utils, localizedDigits, timezone) => {
|
|
|
319
319
|
hours: ({
|
|
320
320
|
format
|
|
321
321
|
}) => {
|
|
322
|
-
const lastHourInDay =
|
|
323
|
-
const hasMeridiem = removeLocalizedDigits(
|
|
322
|
+
const lastHourInDay = adapter.getHours(endOfDay);
|
|
323
|
+
const hasMeridiem = removeLocalizedDigits(adapter.formatByString(adapter.endOfDay(today), format), localizedDigits) !== lastHourInDay.toString();
|
|
324
324
|
if (hasMeridiem) {
|
|
325
325
|
return {
|
|
326
326
|
minimum: 1,
|
|
327
|
-
maximum: Number(removeLocalizedDigits(
|
|
327
|
+
maximum: Number(removeLocalizedDigits(adapter.formatByString(adapter.startOfDay(today), format), localizedDigits))
|
|
328
328
|
};
|
|
329
329
|
}
|
|
330
330
|
return {
|
|
@@ -335,12 +335,12 @@ const getSectionsBoundaries = (utils, localizedDigits, timezone) => {
|
|
|
335
335
|
minutes: () => ({
|
|
336
336
|
minimum: 0,
|
|
337
337
|
// Assumption: All years have the same amount of minutes
|
|
338
|
-
maximum:
|
|
338
|
+
maximum: adapter.getMinutes(endOfDay)
|
|
339
339
|
}),
|
|
340
340
|
seconds: () => ({
|
|
341
341
|
minimum: 0,
|
|
342
342
|
// Assumption: All years have the same amount of seconds
|
|
343
|
-
maximum:
|
|
343
|
+
maximum: adapter.getSeconds(endOfDay)
|
|
344
344
|
}),
|
|
345
345
|
meridiem: () => ({
|
|
346
346
|
minimum: 0,
|
|
@@ -373,55 +373,55 @@ const validateSections = (sections, valueType) => {
|
|
|
373
373
|
}
|
|
374
374
|
};
|
|
375
375
|
exports.validateSections = validateSections;
|
|
376
|
-
const transferDateSectionValue = (
|
|
376
|
+
const transferDateSectionValue = (adapter, section, dateToTransferFrom, dateToTransferTo) => {
|
|
377
377
|
switch (section.type) {
|
|
378
378
|
case 'year':
|
|
379
379
|
{
|
|
380
|
-
return
|
|
380
|
+
return adapter.setYear(dateToTransferTo, adapter.getYear(dateToTransferFrom));
|
|
381
381
|
}
|
|
382
382
|
case 'month':
|
|
383
383
|
{
|
|
384
|
-
return
|
|
384
|
+
return adapter.setMonth(dateToTransferTo, adapter.getMonth(dateToTransferFrom));
|
|
385
385
|
}
|
|
386
386
|
case 'weekDay':
|
|
387
387
|
{
|
|
388
|
-
let dayInWeekStrOfActiveDate =
|
|
388
|
+
let dayInWeekStrOfActiveDate = adapter.formatByString(dateToTransferFrom, section.format);
|
|
389
389
|
if (section.hasLeadingZerosInInput) {
|
|
390
390
|
dayInWeekStrOfActiveDate = cleanLeadingZeros(dayInWeekStrOfActiveDate, section.maxLength);
|
|
391
391
|
}
|
|
392
|
-
const formattedDaysInWeek = getDaysInWeekStr(
|
|
392
|
+
const formattedDaysInWeek = getDaysInWeekStr(adapter, section.format);
|
|
393
393
|
const dayInWeekOfActiveDate = formattedDaysInWeek.indexOf(dayInWeekStrOfActiveDate);
|
|
394
394
|
const dayInWeekOfNewSectionValue = formattedDaysInWeek.indexOf(section.value);
|
|
395
395
|
const diff = dayInWeekOfNewSectionValue - dayInWeekOfActiveDate;
|
|
396
|
-
return
|
|
396
|
+
return adapter.addDays(dateToTransferFrom, diff);
|
|
397
397
|
}
|
|
398
398
|
case 'day':
|
|
399
399
|
{
|
|
400
|
-
return
|
|
400
|
+
return adapter.setDate(dateToTransferTo, adapter.getDate(dateToTransferFrom));
|
|
401
401
|
}
|
|
402
402
|
case 'meridiem':
|
|
403
403
|
{
|
|
404
|
-
const isAM =
|
|
405
|
-
const mergedDateHours =
|
|
404
|
+
const isAM = adapter.getHours(dateToTransferFrom) < 12;
|
|
405
|
+
const mergedDateHours = adapter.getHours(dateToTransferTo);
|
|
406
406
|
if (isAM && mergedDateHours >= 12) {
|
|
407
|
-
return
|
|
407
|
+
return adapter.addHours(dateToTransferTo, -12);
|
|
408
408
|
}
|
|
409
409
|
if (!isAM && mergedDateHours < 12) {
|
|
410
|
-
return
|
|
410
|
+
return adapter.addHours(dateToTransferTo, 12);
|
|
411
411
|
}
|
|
412
412
|
return dateToTransferTo;
|
|
413
413
|
}
|
|
414
414
|
case 'hours':
|
|
415
415
|
{
|
|
416
|
-
return
|
|
416
|
+
return adapter.setHours(dateToTransferTo, adapter.getHours(dateToTransferFrom));
|
|
417
417
|
}
|
|
418
418
|
case 'minutes':
|
|
419
419
|
{
|
|
420
|
-
return
|
|
420
|
+
return adapter.setMinutes(dateToTransferTo, adapter.getMinutes(dateToTransferFrom));
|
|
421
421
|
}
|
|
422
422
|
case 'seconds':
|
|
423
423
|
{
|
|
424
|
-
return
|
|
424
|
+
return adapter.setSeconds(dateToTransferTo, adapter.getSeconds(dateToTransferFrom));
|
|
425
425
|
}
|
|
426
426
|
default:
|
|
427
427
|
{
|
|
@@ -440,11 +440,11 @@ const reliableSectionModificationOrder = {
|
|
|
440
440
|
meridiem: 8,
|
|
441
441
|
empty: 9
|
|
442
442
|
};
|
|
443
|
-
const mergeDateIntoReferenceDate = (
|
|
443
|
+
const mergeDateIntoReferenceDate = (adapter, dateToTransferFrom, sections, referenceDate, shouldLimitToEditedSections) =>
|
|
444
444
|
// cloning sections before sort to avoid mutating it
|
|
445
445
|
[...sections].sort((a, b) => reliableSectionModificationOrder[a.type] - reliableSectionModificationOrder[b.type]).reduce((mergedDate, section) => {
|
|
446
446
|
if (!shouldLimitToEditedSections || section.modified) {
|
|
447
|
-
return transferDateSectionValue(
|
|
447
|
+
return transferDateSectionValue(adapter, section, dateToTransferFrom, mergedDate);
|
|
448
448
|
}
|
|
449
449
|
return mergedDate;
|
|
450
450
|
}, referenceDate);
|
|
@@ -7,8 +7,8 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
exports.useFieldCharacterEditing = void 0;
|
|
8
8
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
9
|
var _useEventCallback = _interopRequireDefault(require("@mui/utils/useEventCallback"));
|
|
10
|
-
var _useUtils = require("../useUtils");
|
|
11
10
|
var _useField = require("./useField.utils");
|
|
11
|
+
var _usePickerAdapter = require("../../../hooks/usePickerAdapter");
|
|
12
12
|
const isQueryResponseWithoutValue = response => response.saveQuery != null;
|
|
13
13
|
|
|
14
14
|
/**
|
|
@@ -31,7 +31,7 @@ const useFieldCharacterEditing = ({
|
|
|
31
31
|
updateSectionValue
|
|
32
32
|
}
|
|
33
33
|
}) => {
|
|
34
|
-
const
|
|
34
|
+
const adapter = (0, _usePickerAdapter.usePickerAdapter)();
|
|
35
35
|
const applyQuery = ({
|
|
36
36
|
keyPressed,
|
|
37
37
|
sectionIndex
|
|
@@ -82,7 +82,7 @@ const useFieldCharacterEditing = ({
|
|
|
82
82
|
};
|
|
83
83
|
};
|
|
84
84
|
const testQueryOnFormatAndFallbackFormat = (queryValue, activeSection, fallbackFormat, formatFallbackValue) => {
|
|
85
|
-
const getOptions = format => (0, _useField.getLetterEditingOptions)(
|
|
85
|
+
const getOptions = format => (0, _useField.getLetterEditingOptions)(adapter, timezone, activeSection.type, format);
|
|
86
86
|
if (activeSection.contentType === 'letter') {
|
|
87
87
|
return findMatchingOptions(activeSection.format, getOptions(activeSection.format), queryValue);
|
|
88
88
|
}
|
|
@@ -90,7 +90,7 @@ const useFieldCharacterEditing = ({
|
|
|
90
90
|
// When editing a digit-format month / weekDay and the user presses a letter,
|
|
91
91
|
// We can support the letter editing by using the letter-format month / weekDay and re-formatting the result.
|
|
92
92
|
// We just have to make sure that the default month / weekDay format is a letter format,
|
|
93
|
-
if (fallbackFormat && formatFallbackValue != null && (0, _useField.getDateSectionConfigFromFormatToken)(
|
|
93
|
+
if (fallbackFormat && formatFallbackValue != null && (0, _useField.getDateSectionConfigFromFormatToken)(adapter, fallbackFormat).contentType === 'letter') {
|
|
94
94
|
const fallbackOptions = getOptions(fallbackFormat);
|
|
95
95
|
const response = findMatchingOptions(fallbackFormat, fallbackOptions, queryValue);
|
|
96
96
|
if (isQueryResponseWithoutValue(response)) {
|
|
@@ -110,13 +110,13 @@ const useFieldCharacterEditing = ({
|
|
|
110
110
|
switch (activeSection.type) {
|
|
111
111
|
case 'month':
|
|
112
112
|
{
|
|
113
|
-
const formatFallbackValue = fallbackValue => (0, _useField.changeSectionValueFormat)(
|
|
114
|
-
return testQueryOnFormatAndFallbackFormat(queryValue, activeSection,
|
|
113
|
+
const formatFallbackValue = fallbackValue => (0, _useField.changeSectionValueFormat)(adapter, fallbackValue, adapter.formats.month, activeSection.format);
|
|
114
|
+
return testQueryOnFormatAndFallbackFormat(queryValue, activeSection, adapter.formats.month, formatFallbackValue);
|
|
115
115
|
}
|
|
116
116
|
case 'weekDay':
|
|
117
117
|
{
|
|
118
118
|
const formatFallbackValue = (fallbackValue, fallbackOptions) => fallbackOptions.indexOf(fallbackValue).toString();
|
|
119
|
-
return testQueryOnFormatAndFallbackFormat(queryValue, activeSection,
|
|
119
|
+
return testQueryOnFormatAndFallbackFormat(queryValue, activeSection, adapter.formats.weekday, formatFallbackValue);
|
|
120
120
|
}
|
|
121
121
|
case 'meridiem':
|
|
122
122
|
{
|
|
@@ -160,7 +160,7 @@ const useFieldCharacterEditing = ({
|
|
|
160
160
|
};
|
|
161
161
|
}
|
|
162
162
|
const shouldGoToNextSection = queryValueNumber * 10 > sectionBoundaries.maximum || cleanQueryValue.length === sectionBoundaries.maximum.toString().length;
|
|
163
|
-
const newSectionValue = (0, _useField.cleanDigitSectionValue)(
|
|
163
|
+
const newSectionValue = (0, _useField.cleanDigitSectionValue)(adapter, queryValueNumber, sectionBoundaries, localizedDigits, section);
|
|
164
164
|
return {
|
|
165
165
|
sectionValue: newSectionValue,
|
|
166
166
|
shouldGoToNextSection
|
|
@@ -178,7 +178,7 @@ const useFieldCharacterEditing = ({
|
|
|
178
178
|
// When editing a letter-format month and the user presses a digit,
|
|
179
179
|
// We can support the numeric editing by using the digit-format month and re-formatting the result.
|
|
180
180
|
if (activeSection.type === 'month') {
|
|
181
|
-
const hasLeadingZerosInFormat = (0, _useField.doesSectionFormatHaveLeadingZeros)(
|
|
181
|
+
const hasLeadingZerosInFormat = (0, _useField.doesSectionFormatHaveLeadingZeros)(adapter, 'digit', 'month', 'MM');
|
|
182
182
|
const response = getNewSectionValue({
|
|
183
183
|
queryValue,
|
|
184
184
|
skipIfBelowMinimum: true,
|
|
@@ -194,7 +194,7 @@ const useFieldCharacterEditing = ({
|
|
|
194
194
|
if (isQueryResponseWithoutValue(response)) {
|
|
195
195
|
return response;
|
|
196
196
|
}
|
|
197
|
-
const formattedValue = (0, _useField.changeSectionValueFormat)(
|
|
197
|
+
const formattedValue = (0, _useField.changeSectionValueFormat)(adapter, response.sectionValue, 'MM', activeSection.format);
|
|
198
198
|
return (0, _extends2.default)({}, response, {
|
|
199
199
|
sectionValue: formattedValue
|
|
200
200
|
});
|
|
@@ -211,7 +211,7 @@ const useFieldCharacterEditing = ({
|
|
|
211
211
|
if (isQueryResponseWithoutValue(response)) {
|
|
212
212
|
return response;
|
|
213
213
|
}
|
|
214
|
-
const formattedValue = (0, _useField.getDaysInWeekStr)(
|
|
214
|
+
const formattedValue = (0, _useField.getDaysInWeekStr)(adapter, activeSection.format)[Number(response.sectionValue) - 1];
|
|
215
215
|
return (0, _extends2.default)({}, response, {
|
|
216
216
|
sectionValue: formattedValue
|
|
217
217
|
});
|
|
@@ -6,13 +6,13 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
});
|
|
7
7
|
exports.useFieldRootHandleKeyDown = useFieldRootHandleKeyDown;
|
|
8
8
|
var _useEventCallback = _interopRequireDefault(require("@mui/utils/useEventCallback"));
|
|
9
|
-
var _useUtils = require("../useUtils");
|
|
10
9
|
var _useField = require("./useField.utils");
|
|
10
|
+
var _usePickerAdapter = require("../../../hooks/usePickerAdapter");
|
|
11
11
|
/**
|
|
12
12
|
* Returns the `onKeyDown` handler to pass to the root element of the field.
|
|
13
13
|
*/
|
|
14
14
|
function useFieldRootHandleKeyDown(parameters) {
|
|
15
|
-
const
|
|
15
|
+
const adapter = (0, _usePickerAdapter.usePickerAdapter)();
|
|
16
16
|
const {
|
|
17
17
|
manager: {
|
|
18
18
|
internal_fieldValueManager: fieldValueManager
|
|
@@ -118,7 +118,7 @@ function useFieldRootHandleKeyDown(parameters) {
|
|
|
118
118
|
setSelectedSections(activeSectionIndex);
|
|
119
119
|
}
|
|
120
120
|
const activeSection = state.sections[activeSectionIndex];
|
|
121
|
-
const newSectionValue = adjustSectionValue(
|
|
121
|
+
const newSectionValue = adjustSectionValue(adapter, timezone, activeSection, event.key, sectionsValueBoundaries, localizedDigits, fieldValueManager.getDateFromSection(value, activeSection), {
|
|
122
122
|
minutesStep
|
|
123
123
|
});
|
|
124
124
|
updateSectionValue({
|
|
@@ -145,7 +145,7 @@ function getDeltaFromKeyCode(keyCode) {
|
|
|
145
145
|
return 0;
|
|
146
146
|
}
|
|
147
147
|
}
|
|
148
|
-
function adjustSectionValue(
|
|
148
|
+
function adjustSectionValue(adapter, timezone, section, keyCode, sectionsValueBoundaries, localizedDigits, activeDate, stepsAttributes) {
|
|
149
149
|
const delta = getDeltaFromKeyCode(keyCode);
|
|
150
150
|
const isStart = keyCode === 'Home';
|
|
151
151
|
const isEnd = keyCode === 'End';
|
|
@@ -156,12 +156,12 @@ function adjustSectionValue(utils, timezone, section, keyCode, sectionsValueBoun
|
|
|
156
156
|
format: section.format,
|
|
157
157
|
contentType: section.contentType
|
|
158
158
|
});
|
|
159
|
-
const getCleanValue = value => (0, _useField.cleanDigitSectionValue)(
|
|
159
|
+
const getCleanValue = value => (0, _useField.cleanDigitSectionValue)(adapter, value, sectionBoundaries, localizedDigits, section);
|
|
160
160
|
const step = section.type === 'minutes' && stepsAttributes?.minutesStep ? stepsAttributes.minutesStep : 1;
|
|
161
161
|
let newSectionValueNumber;
|
|
162
162
|
if (shouldSetAbsolute) {
|
|
163
163
|
if (section.type === 'year' && !isEnd && !isStart) {
|
|
164
|
-
return
|
|
164
|
+
return adapter.formatByString(adapter.date(undefined, timezone), section.format);
|
|
165
165
|
}
|
|
166
166
|
if (delta > 0 || isStart) {
|
|
167
167
|
newSectionValueNumber = sectionBoundaries.minimum;
|
|
@@ -189,7 +189,7 @@ function adjustSectionValue(utils, timezone, section, keyCode, sectionsValueBoun
|
|
|
189
189
|
return getCleanValue(newSectionValueNumber);
|
|
190
190
|
};
|
|
191
191
|
const adjustLetterSection = () => {
|
|
192
|
-
const options = (0, _useField.getLetterEditingOptions)(
|
|
192
|
+
const options = (0, _useField.getLetterEditingOptions)(adapter, timezone, section.type, section.format);
|
|
193
193
|
if (options.length === 0) {
|
|
194
194
|
return section.value;
|
|
195
195
|
}
|
|
@@ -9,7 +9,6 @@ exports.useFieldSectionContentProps = useFieldSectionContentProps;
|
|
|
9
9
|
var React = _interopRequireWildcard(require("react"));
|
|
10
10
|
var _useEventCallback = _interopRequireDefault(require("@mui/utils/useEventCallback"));
|
|
11
11
|
var _useId = _interopRequireDefault(require("@mui/utils/useId"));
|
|
12
|
-
var _useUtils = require("../useUtils");
|
|
13
12
|
var _hooks = require("../../../hooks");
|
|
14
13
|
var _syncSelectionToDOM = require("./syncSelectionToDOM");
|
|
15
14
|
/**
|
|
@@ -20,7 +19,7 @@ var _syncSelectionToDOM = require("./syncSelectionToDOM");
|
|
|
20
19
|
* @returns {UseFieldRootPropsReturnValue} The props to forward to the content element of each section of the field.
|
|
21
20
|
*/
|
|
22
21
|
function useFieldSectionContentProps(parameters) {
|
|
23
|
-
const
|
|
22
|
+
const adapter = (0, _hooks.usePickerAdapter)();
|
|
24
23
|
const translations = (0, _hooks.usePickerTranslations)();
|
|
25
24
|
const id = (0, _useId.default)();
|
|
26
25
|
const {
|
|
@@ -158,10 +157,10 @@ function useFieldSectionContentProps(parameters) {
|
|
|
158
157
|
// Aria attributes
|
|
159
158
|
'aria-labelledby': `${id}-${section.type}`,
|
|
160
159
|
'aria-readonly': readOnly,
|
|
161
|
-
'aria-valuenow': getSectionValueNow(section,
|
|
160
|
+
'aria-valuenow': getSectionValueNow(section, adapter),
|
|
162
161
|
'aria-valuemin': sectionBoundaries.minimum,
|
|
163
162
|
'aria-valuemax': sectionBoundaries.maximum,
|
|
164
|
-
'aria-valuetext': section.value ? getSectionValueText(section,
|
|
163
|
+
'aria-valuetext': section.value ? getSectionValueText(section, adapter) : translations.empty,
|
|
165
164
|
'aria-label': translations[section.type],
|
|
166
165
|
'aria-disabled': disabled,
|
|
167
166
|
// Other
|
|
@@ -176,9 +175,9 @@ function useFieldSectionContentProps(parameters) {
|
|
|
176
175
|
children: section.value || section.placeholder,
|
|
177
176
|
inputMode: section.contentType === 'letter' ? 'text' : 'numeric'
|
|
178
177
|
};
|
|
179
|
-
}, [sectionsValueBoundaries, id, isContainerEditable, disabled, readOnly, isEditable, translations,
|
|
178
|
+
}, [sectionsValueBoundaries, id, isContainerEditable, disabled, readOnly, isEditable, translations, adapter, handleInput, handlePaste, handleMouseUp, handleDragOver, createFocusHandler, fieldValueManager, value]);
|
|
180
179
|
}
|
|
181
|
-
function getSectionValueText(section,
|
|
180
|
+
function getSectionValueText(section, adapter) {
|
|
182
181
|
if (!section.value) {
|
|
183
182
|
return undefined;
|
|
184
183
|
}
|
|
@@ -186,13 +185,13 @@ function getSectionValueText(section, utils) {
|
|
|
186
185
|
case 'month':
|
|
187
186
|
{
|
|
188
187
|
if (section.contentType === 'digit') {
|
|
189
|
-
return
|
|
188
|
+
return adapter.format(adapter.setMonth(adapter.date(), Number(section.value) - 1), 'month');
|
|
190
189
|
}
|
|
191
|
-
const parsedDate =
|
|
192
|
-
return parsedDate ?
|
|
190
|
+
const parsedDate = adapter.parse(section.value, section.format);
|
|
191
|
+
return parsedDate ? adapter.format(parsedDate, 'month') : undefined;
|
|
193
192
|
}
|
|
194
193
|
case 'day':
|
|
195
|
-
return section.contentType === 'digit' ?
|
|
194
|
+
return section.contentType === 'digit' ? adapter.format(adapter.setDate(adapter.startOfYear(adapter.date()), Number(section.value)), 'dayOfMonthFull') : section.value;
|
|
196
195
|
case 'weekDay':
|
|
197
196
|
// TODO: improve by providing the label of the week day
|
|
198
197
|
return undefined;
|
|
@@ -200,7 +199,7 @@ function getSectionValueText(section, utils) {
|
|
|
200
199
|
return undefined;
|
|
201
200
|
}
|
|
202
201
|
}
|
|
203
|
-
function getSectionValueNow(section,
|
|
202
|
+
function getSectionValueNow(section, adapter) {
|
|
204
203
|
if (!section.value) {
|
|
205
204
|
return undefined;
|
|
206
205
|
}
|
|
@@ -215,9 +214,9 @@ function getSectionValueNow(section, utils) {
|
|
|
215
214
|
}
|
|
216
215
|
case 'meridiem':
|
|
217
216
|
{
|
|
218
|
-
const parsedDate =
|
|
217
|
+
const parsedDate = adapter.parse(`01:00 ${section.value}`, `${adapter.formats.hours12h}:${adapter.formats.minutes} ${section.format}`);
|
|
219
218
|
if (parsedDate) {
|
|
220
|
-
return
|
|
219
|
+
return adapter.getHours(parsedDate) >= 12 ? 1 : 0;
|
|
221
220
|
}
|
|
222
221
|
return undefined;
|
|
223
222
|
}
|
|
@@ -228,8 +227,8 @@ function getSectionValueNow(section, utils) {
|
|
|
228
227
|
if (section.contentType === 'digit') {
|
|
229
228
|
return Number(section.value);
|
|
230
229
|
}
|
|
231
|
-
const parsedDate =
|
|
232
|
-
return parsedDate ?
|
|
230
|
+
const parsedDate = adapter.parse(section.value, section.format);
|
|
231
|
+
return parsedDate ? adapter.getMonth(parsedDate) + 1 : undefined;
|
|
233
232
|
}
|
|
234
233
|
default:
|
|
235
234
|
return section.contentType !== 'letter' ? Number(section.value) : undefined;
|