@mui/x-date-pickers-pro 8.0.0-alpha.7 → 8.0.0-alpha.8

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.
Files changed (199) hide show
  1. package/CHANGELOG.md +115 -0
  2. package/DateRangeCalendar/DateRangeCalendar.js +4 -4
  3. package/DateRangePicker/DateRangePickerToolbar.js +3 -3
  4. package/DateTimeRangePicker/DateTimeRangePickerTabs.js +3 -3
  5. package/DateTimeRangePicker/DateTimeRangePickerTimeWrapper.js +2 -2
  6. package/DateTimeRangePicker/DateTimeRangePickerToolbar.js +7 -7
  7. package/MultiInputDateRangeField/MultiInputDateRangeField.d.ts +9 -4
  8. package/MultiInputDateRangeField/MultiInputDateRangeField.js +12 -116
  9. package/MultiInputDateRangeField/index.d.ts +5 -3
  10. package/MultiInputDateRangeField/index.js +2 -2
  11. package/MultiInputDateRangeField/multiInputDateRangeFieldClasses.d.ts +6 -0
  12. package/MultiInputDateRangeField/multiInputDateRangeFieldClasses.js +4 -0
  13. package/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.d.ts +9 -4
  14. package/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.js +12 -116
  15. package/MultiInputDateTimeRangeField/index.d.ts +5 -3
  16. package/MultiInputDateTimeRangeField/index.js +2 -2
  17. package/MultiInputDateTimeRangeField/multiInputDateTimeRangeFieldClasses.d.ts +6 -0
  18. package/MultiInputDateTimeRangeField/multiInputDateTimeRangeFieldClasses.js +4 -0
  19. package/MultiInputTimeRangeField/MultiInputTimeRangeField.d.ts +9 -4
  20. package/MultiInputTimeRangeField/MultiInputTimeRangeField.js +13 -117
  21. package/MultiInputTimeRangeField/index.d.ts +5 -3
  22. package/MultiInputTimeRangeField/index.js +2 -2
  23. package/MultiInputTimeRangeField/multiInputTimeRangeFieldClasses.d.ts +6 -0
  24. package/MultiInputTimeRangeField/multiInputTimeRangeFieldClasses.js +4 -0
  25. package/SingleInputDateRangeField/SingleInputDateRangeField.js +20 -30
  26. package/SingleInputDateRangeField/SingleInputDateRangeField.types.d.ts +6 -17
  27. package/SingleInputDateRangeField/useSingleInputDateRangeField.d.ts +1 -1
  28. package/SingleInputDateRangeField/useSingleInputDateRangeField.js +2 -1
  29. package/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.js +20 -30
  30. package/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.types.d.ts +6 -18
  31. package/SingleInputDateTimeRangeField/useSingleInputDateTimeRangeField.d.ts +1 -1
  32. package/SingleInputDateTimeRangeField/useSingleInputDateTimeRangeField.js +2 -1
  33. package/SingleInputTimeRangeField/SingleInputTimeRangeField.js +20 -30
  34. package/SingleInputTimeRangeField/SingleInputTimeRangeField.types.d.ts +6 -18
  35. package/SingleInputTimeRangeField/useSingleInputTimeRangeField.d.ts +1 -1
  36. package/SingleInputTimeRangeField/useSingleInputTimeRangeField.js +2 -1
  37. package/hooks/index.d.ts +1 -0
  38. package/hooks/index.js +2 -1
  39. package/hooks/useMultiInputRangeField/index.d.ts +1 -0
  40. package/hooks/useMultiInputRangeField/index.js +1 -0
  41. package/hooks/useMultiInputRangeField/useMultiInputRangeField.d.ts +53 -0
  42. package/hooks/useMultiInputRangeField/useMultiInputRangeField.js +149 -0
  43. package/{internals/hooks/useMultiInputFieldSelectedSections.d.ts → hooks/useMultiInputRangeField/useMultiInputRangeFieldSelectedSections.d.ts} +3 -4
  44. package/{modern/internals/hooks/useMultiInputFieldSelectedSections.js → hooks/useMultiInputRangeField/useMultiInputRangeFieldSelectedSections.js} +10 -8
  45. package/hooks/useMultiInputRangeField/useMultiInputRangeFieldTextFieldProps.d.ts +17 -0
  46. package/hooks/useMultiInputRangeField/useMultiInputRangeFieldTextFieldProps.js +59 -0
  47. package/index.js +1 -1
  48. package/internals/hooks/models/index.d.ts +1 -1
  49. package/internals/hooks/models/useRangePicker.d.ts +4 -6
  50. package/internals/hooks/useDesktopRangePicker/useDesktopRangePicker.js +32 -42
  51. package/internals/hooks/{useEnrichedRangePickerFieldProps.d.ts → useEnrichedRangePickerField.d.ts} +15 -6
  52. package/internals/hooks/{useEnrichedRangePickerFieldProps.js → useEnrichedRangePickerField.js} +39 -52
  53. package/internals/hooks/useMobileRangePicker/useMobileRangePicker.js +23 -32
  54. package/internals/hooks/useRangePosition.d.ts +1 -1
  55. package/internals/hooks/useRangePosition.js +1 -1
  56. package/internals/models/dateTimeRange.d.ts +1 -6
  57. package/internals/models/fields.d.ts +1 -2
  58. package/internals/models/index.d.ts +0 -1
  59. package/internals/models/index.js +0 -1
  60. package/internals/models/managers.d.ts +3 -0
  61. package/internals/utils/createMultiInputRangeField/createMultiInputRangeField.d.ts +3 -0
  62. package/internals/utils/createMultiInputRangeField/createMultiInputRangeField.js +133 -0
  63. package/internals/utils/createMultiInputRangeField/createMultiInputRangeField.types.d.ts +72 -0
  64. package/internals/utils/createMultiInputRangeField/index.d.ts +3 -0
  65. package/internals/utils/createMultiInputRangeField/index.js +2 -0
  66. package/internals/utils/releaseInfo.js +1 -1
  67. package/managers/index.d.ts +3 -3
  68. package/managers/useDateRangeManager.d.ts +1 -1
  69. package/managers/useDateRangeManager.js +3 -1
  70. package/managers/useDateTimeRangeManager.d.ts +1 -1
  71. package/managers/useDateTimeRangeManager.js +3 -1
  72. package/managers/useTimeRangeManager.d.ts +1 -1
  73. package/managers/useTimeRangeManager.js +3 -1
  74. package/models/fields.d.ts +1 -2
  75. package/models/index.d.ts +0 -2
  76. package/models/index.js +0 -2
  77. package/modern/DateRangeCalendar/DateRangeCalendar.js +4 -4
  78. package/modern/DateRangePicker/DateRangePickerToolbar.js +3 -3
  79. package/modern/DateTimeRangePicker/DateTimeRangePickerTabs.js +3 -3
  80. package/modern/DateTimeRangePicker/DateTimeRangePickerTimeWrapper.js +2 -2
  81. package/modern/DateTimeRangePicker/DateTimeRangePickerToolbar.js +7 -7
  82. package/modern/MultiInputDateRangeField/MultiInputDateRangeField.js +12 -116
  83. package/modern/MultiInputDateRangeField/index.js +2 -2
  84. package/modern/MultiInputDateRangeField/multiInputDateRangeFieldClasses.js +4 -0
  85. package/modern/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.js +12 -116
  86. package/modern/MultiInputDateTimeRangeField/index.js +2 -2
  87. package/modern/MultiInputDateTimeRangeField/multiInputDateTimeRangeFieldClasses.js +4 -0
  88. package/modern/MultiInputTimeRangeField/MultiInputTimeRangeField.js +13 -117
  89. package/modern/MultiInputTimeRangeField/index.js +2 -2
  90. package/modern/MultiInputTimeRangeField/multiInputTimeRangeFieldClasses.js +4 -0
  91. package/modern/SingleInputDateRangeField/SingleInputDateRangeField.js +20 -30
  92. package/modern/SingleInputDateRangeField/useSingleInputDateRangeField.js +2 -1
  93. package/modern/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.js +20 -30
  94. package/modern/SingleInputDateTimeRangeField/useSingleInputDateTimeRangeField.js +2 -1
  95. package/modern/SingleInputTimeRangeField/SingleInputTimeRangeField.js +20 -30
  96. package/modern/SingleInputTimeRangeField/useSingleInputTimeRangeField.js +2 -1
  97. package/modern/hooks/index.js +2 -1
  98. package/modern/hooks/useMultiInputRangeField/index.js +1 -0
  99. package/modern/hooks/useMultiInputRangeField/useMultiInputRangeField.js +149 -0
  100. package/{internals/hooks/useMultiInputFieldSelectedSections.js → modern/hooks/useMultiInputRangeField/useMultiInputRangeFieldSelectedSections.js} +10 -8
  101. package/modern/hooks/useMultiInputRangeField/useMultiInputRangeFieldTextFieldProps.js +59 -0
  102. package/modern/index.js +1 -1
  103. package/modern/internals/hooks/useDesktopRangePicker/useDesktopRangePicker.js +32 -42
  104. package/modern/internals/hooks/{useEnrichedRangePickerFieldProps.js → useEnrichedRangePickerField.js} +39 -52
  105. package/modern/internals/hooks/useMobileRangePicker/useMobileRangePicker.js +23 -32
  106. package/modern/internals/hooks/useRangePosition.js +1 -1
  107. package/modern/internals/models/index.js +0 -1
  108. package/modern/internals/utils/createMultiInputRangeField/createMultiInputRangeField.js +133 -0
  109. package/modern/internals/utils/createMultiInputRangeField/index.js +2 -0
  110. package/modern/internals/utils/releaseInfo.js +1 -1
  111. package/modern/managers/useDateRangeManager.js +3 -1
  112. package/modern/managers/useDateTimeRangeManager.js +3 -1
  113. package/modern/managers/useTimeRangeManager.js +3 -1
  114. package/modern/models/index.js +0 -2
  115. package/node/DateRangeCalendar/DateRangeCalendar.js +4 -4
  116. package/node/DateRangePicker/DateRangePickerToolbar.js +3 -3
  117. package/node/DateTimeRangePicker/DateTimeRangePickerTabs.js +3 -3
  118. package/node/DateTimeRangePicker/DateTimeRangePickerTimeWrapper.js +2 -2
  119. package/node/DateTimeRangePicker/DateTimeRangePickerToolbar.js +7 -7
  120. package/node/MultiInputDateRangeField/MultiInputDateRangeField.js +11 -119
  121. package/node/MultiInputDateRangeField/index.js +3 -9
  122. package/node/MultiInputDateRangeField/multiInputDateRangeFieldClasses.js +12 -0
  123. package/node/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.js +11 -119
  124. package/node/MultiInputDateTimeRangeField/index.js +3 -9
  125. package/node/MultiInputDateTimeRangeField/multiInputDateTimeRangeFieldClasses.js +12 -0
  126. package/node/MultiInputTimeRangeField/MultiInputTimeRangeField.js +12 -120
  127. package/node/MultiInputTimeRangeField/index.js +3 -9
  128. package/node/MultiInputTimeRangeField/multiInputTimeRangeFieldClasses.js +12 -0
  129. package/node/SingleInputDateRangeField/SingleInputDateRangeField.js +19 -29
  130. package/node/SingleInputDateRangeField/useSingleInputDateRangeField.js +2 -1
  131. package/node/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.js +19 -29
  132. package/node/SingleInputDateTimeRangeField/useSingleInputDateTimeRangeField.js +2 -1
  133. package/node/SingleInputTimeRangeField/SingleInputTimeRangeField.js +19 -29
  134. package/node/SingleInputTimeRangeField/useSingleInputTimeRangeField.js +2 -1
  135. package/node/hooks/index.js +8 -1
  136. package/node/hooks/useMultiInputRangeField/index.js +12 -0
  137. package/node/hooks/useMultiInputRangeField/useMultiInputRangeField.js +155 -0
  138. package/node/{internals/hooks/useMultiInputFieldSelectedSections.js → hooks/useMultiInputRangeField/useMultiInputRangeFieldSelectedSections.js} +11 -10
  139. package/node/hooks/useMultiInputRangeField/useMultiInputRangeFieldTextFieldProps.js +66 -0
  140. package/node/index.js +1 -1
  141. package/node/internals/hooks/useDesktopRangePicker/useDesktopRangePicker.js +31 -41
  142. package/node/internals/hooks/{useEnrichedRangePickerFieldProps.js → useEnrichedRangePickerField.js} +41 -54
  143. package/node/internals/hooks/useMobileRangePicker/useMobileRangePicker.js +22 -31
  144. package/node/internals/hooks/useRangePosition.js +1 -1
  145. package/node/internals/models/index.js +0 -11
  146. package/node/internals/utils/createMultiInputRangeField/createMultiInputRangeField.js +140 -0
  147. package/node/internals/utils/createMultiInputRangeField/index.js +19 -0
  148. package/node/internals/utils/releaseInfo.js +1 -1
  149. package/node/managers/useDateRangeManager.js +3 -1
  150. package/node/managers/useDateTimeRangeManager.js +3 -1
  151. package/node/managers/useTimeRangeManager.js +3 -1
  152. package/node/models/index.js +0 -22
  153. package/package.json +4 -4
  154. package/themeAugmentation/overrides.d.ts +6 -4
  155. package/themeAugmentation/props.d.ts +2 -2
  156. package/MultiInputDateRangeField/MultiInputDateRangeField.types.d.ts +0 -55
  157. package/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.types.d.ts +0 -56
  158. package/MultiInputTimeRangeField/MultiInputTimeRangeField.types.d.ts +0 -56
  159. package/internals/hooks/useMultiInputRangeField/shared.d.ts +0 -1
  160. package/internals/hooks/useMultiInputRangeField/shared.js +0 -9
  161. package/internals/hooks/useMultiInputRangeField/useMultiInputDateRangeField.d.ts +0 -3
  162. package/internals/hooks/useMultiInputRangeField/useMultiInputDateRangeField.js +0 -118
  163. package/internals/hooks/useMultiInputRangeField/useMultiInputDateTimeRangeField.d.ts +0 -3
  164. package/internals/hooks/useMultiInputRangeField/useMultiInputDateTimeRangeField.js +0 -118
  165. package/internals/hooks/useMultiInputRangeField/useMultiInputRangeField.types.d.ts +0 -11
  166. package/internals/hooks/useMultiInputRangeField/useMultiInputTimeRangeField.d.ts +0 -3
  167. package/internals/hooks/useMultiInputRangeField/useMultiInputTimeRangeField.js +0 -118
  168. package/internals/models/timeRange.d.ts +0 -6
  169. package/internals/models/timeRange.js +0 -1
  170. package/models/dateRange.d.ts +0 -7
  171. package/models/dateRange.js +0 -1
  172. package/models/multiInputRangeFieldClasses.d.ts +0 -7
  173. package/models/multiInputRangeFieldClasses.js +0 -1
  174. package/modern/MultiInputDateRangeField/MultiInputDateRangeField.types.js +0 -1
  175. package/modern/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.types.js +0 -1
  176. package/modern/MultiInputTimeRangeField/MultiInputTimeRangeField.types.js +0 -1
  177. package/modern/internals/hooks/useMultiInputRangeField/shared.js +0 -9
  178. package/modern/internals/hooks/useMultiInputRangeField/useMultiInputDateRangeField.js +0 -118
  179. package/modern/internals/hooks/useMultiInputRangeField/useMultiInputDateTimeRangeField.js +0 -118
  180. package/modern/internals/hooks/useMultiInputRangeField/useMultiInputRangeField.types.js +0 -1
  181. package/modern/internals/hooks/useMultiInputRangeField/useMultiInputTimeRangeField.js +0 -118
  182. package/modern/internals/models/timeRange.js +0 -1
  183. package/modern/models/dateRange.js +0 -1
  184. package/modern/models/multiInputRangeFieldClasses.js +0 -1
  185. package/node/MultiInputTimeRangeField/MultiInputTimeRangeField.types.js +0 -5
  186. package/node/internals/hooks/useMultiInputRangeField/shared.js +0 -16
  187. package/node/internals/hooks/useMultiInputRangeField/useMultiInputDateRangeField.js +0 -126
  188. package/node/internals/hooks/useMultiInputRangeField/useMultiInputDateTimeRangeField.js +0 -126
  189. package/node/internals/hooks/useMultiInputRangeField/useMultiInputRangeField.types.js +0 -5
  190. package/node/internals/hooks/useMultiInputRangeField/useMultiInputTimeRangeField.js +0 -126
  191. package/node/internals/models/timeRange.js +0 -5
  192. package/node/models/dateRange.js +0 -5
  193. package/node/models/multiInputRangeFieldClasses.js +0 -5
  194. /package/{MultiInputDateRangeField/MultiInputDateRangeField.types.js → internals/models/managers.js} +0 -0
  195. /package/{MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.types.js → internals/utils/createMultiInputRangeField/createMultiInputRangeField.types.js} +0 -0
  196. /package/{MultiInputTimeRangeField/MultiInputTimeRangeField.types.js → modern/internals/models/managers.js} +0 -0
  197. /package/{internals/hooks/useMultiInputRangeField/useMultiInputRangeField.types.js → modern/internals/utils/createMultiInputRangeField/createMultiInputRangeField.types.js} +0 -0
  198. /package/node/{MultiInputDateRangeField/MultiInputDateRangeField.types.js → internals/models/managers.js} +0 -0
  199. /package/node/{MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.types.js → internals/utils/createMultiInputRangeField/createMultiInputRangeField.types.js} +0 -0
@@ -1,118 +0,0 @@
1
- import _extends from "@babel/runtime/helpers/esm/extends";
2
- import useEventCallback from '@mui/utils/useEventCallback';
3
- import { unstable_useDateField as useDateField } from '@mui/x-date-pickers/DateField';
4
- import { useControlledValueWithTimezone, useFieldInternalPropsWithDefaults } from '@mui/x-date-pickers/internals';
5
- import { useValidation } from '@mui/x-date-pickers/validation';
6
- import { validateDateRange } from "../../../validation/index.js";
7
- import { rangeValueManager } from "../../utils/valueManagers.js";
8
- import { excludeProps } from "./shared.js";
9
- import { useMultiInputFieldSelectedSections } from "../useMultiInputFieldSelectedSections.js";
10
- import { useDateRangeManager } from "../../../managers/index.js";
11
- export const useMultiInputDateRangeField = ({
12
- sharedProps,
13
- startTextFieldProps,
14
- unstableStartFieldRef,
15
- endTextFieldProps,
16
- unstableEndFieldRef
17
- }) => {
18
- const manager = useDateRangeManager(sharedProps);
19
- const sharedPropsWithDefaults = useFieldInternalPropsWithDefaults({
20
- manager,
21
- internalProps: sharedProps
22
- });
23
- const {
24
- value: valueProp,
25
- defaultValue,
26
- referenceDate,
27
- format,
28
- formatDensity,
29
- shouldRespectLeadingZeros,
30
- onChange,
31
- disabled,
32
- readOnly,
33
- selectedSections,
34
- onSelectedSectionsChange,
35
- timezone: timezoneProp,
36
- enableAccessibleFieldDOMStructure,
37
- autoFocus
38
- } = sharedPropsWithDefaults;
39
- const {
40
- value,
41
- handleValueChange,
42
- timezone
43
- } = useControlledValueWithTimezone({
44
- name: 'useMultiInputDateRangeField',
45
- timezone: timezoneProp,
46
- value: valueProp,
47
- defaultValue,
48
- referenceDate,
49
- onChange,
50
- valueManager: rangeValueManager
51
- });
52
- const {
53
- validationError,
54
- getValidationErrorForNewValue
55
- } = useValidation({
56
- props: sharedPropsWithDefaults,
57
- value,
58
- timezone,
59
- validator: validateDateRange,
60
- onError: sharedPropsWithDefaults.onError
61
- });
62
-
63
- // TODO: Maybe export utility from `useField` instead of copy/pasting the logic
64
- const buildChangeHandler = index => {
65
- return (newDate, rawContext) => {
66
- const newDateRange = index === 0 ? [newDate, value[1]] : [value[0], newDate];
67
- const context = _extends({}, rawContext, {
68
- validationError: getValidationErrorForNewValue(newDateRange)
69
- });
70
- handleValueChange(newDateRange, context);
71
- };
72
- };
73
- const handleStartDateChange = useEventCallback(buildChangeHandler(0));
74
- const handleEndDateChange = useEventCallback(buildChangeHandler(1));
75
- const selectedSectionsResponse = useMultiInputFieldSelectedSections({
76
- selectedSections,
77
- onSelectedSectionsChange,
78
- unstableStartFieldRef,
79
- unstableEndFieldRef
80
- });
81
- const startFieldProps = _extends({
82
- error: !!validationError[0]
83
- }, startTextFieldProps, selectedSectionsResponse.start, {
84
- disabled,
85
- readOnly,
86
- format,
87
- formatDensity,
88
- shouldRespectLeadingZeros,
89
- timezone,
90
- value: valueProp === undefined ? undefined : valueProp[0],
91
- defaultValue: defaultValue === undefined ? undefined : defaultValue[0],
92
- onChange: handleStartDateChange,
93
- enableAccessibleFieldDOMStructure,
94
- autoFocus // Do not add on end field.
95
- });
96
- const endFieldProps = _extends({
97
- error: !!validationError[1]
98
- }, endTextFieldProps, selectedSectionsResponse.end, {
99
- format,
100
- formatDensity,
101
- shouldRespectLeadingZeros,
102
- disabled,
103
- readOnly,
104
- timezone,
105
- value: valueProp === undefined ? undefined : valueProp[1],
106
- defaultValue: defaultValue === undefined ? undefined : defaultValue[1],
107
- onChange: handleEndDateChange,
108
- enableAccessibleFieldDOMStructure
109
- });
110
- const startDateResponse = useDateField(startFieldProps);
111
- const endDateResponse = useDateField(endFieldProps);
112
-
113
- /* TODO: Undo this change when a clearable behavior for multiple input range fields is implemented */
114
- return {
115
- startDate: excludeProps(startDateResponse, ['clearable', 'onClear']),
116
- endDate: excludeProps(endDateResponse, ['clearable', 'onClear'])
117
- };
118
- };
@@ -1,118 +0,0 @@
1
- import _extends from "@babel/runtime/helpers/esm/extends";
2
- import useEventCallback from '@mui/utils/useEventCallback';
3
- import { unstable_useDateTimeField as useDateTimeField } from '@mui/x-date-pickers/DateTimeField';
4
- import { useControlledValueWithTimezone, useFieldInternalPropsWithDefaults } from '@mui/x-date-pickers/internals';
5
- import { useValidation } from '@mui/x-date-pickers/validation';
6
- import { validateDateTimeRange } from "../../../validation/index.js";
7
- import { rangeValueManager } from "../../utils/valueManagers.js";
8
- import { excludeProps } from "./shared.js";
9
- import { useMultiInputFieldSelectedSections } from "../useMultiInputFieldSelectedSections.js";
10
- import { useDateTimeRangeManager } from "../../../managers/index.js";
11
- export const useMultiInputDateTimeRangeField = ({
12
- sharedProps,
13
- startTextFieldProps,
14
- unstableStartFieldRef,
15
- endTextFieldProps,
16
- unstableEndFieldRef
17
- }) => {
18
- const manager = useDateTimeRangeManager(sharedProps);
19
- const sharedPropsWithDefaults = useFieldInternalPropsWithDefaults({
20
- manager,
21
- internalProps: sharedProps
22
- });
23
- const {
24
- value: valueProp,
25
- defaultValue,
26
- referenceDate,
27
- format,
28
- formatDensity,
29
- shouldRespectLeadingZeros,
30
- onChange,
31
- disabled,
32
- readOnly,
33
- selectedSections,
34
- onSelectedSectionsChange,
35
- timezone: timezoneProp,
36
- enableAccessibleFieldDOMStructure,
37
- autoFocus
38
- } = sharedPropsWithDefaults;
39
- const {
40
- value,
41
- handleValueChange,
42
- timezone
43
- } = useControlledValueWithTimezone({
44
- name: 'useMultiInputDateTimeRangeField',
45
- timezone: timezoneProp,
46
- value: valueProp,
47
- defaultValue,
48
- referenceDate,
49
- onChange,
50
- valueManager: rangeValueManager
51
- });
52
- const {
53
- validationError,
54
- getValidationErrorForNewValue
55
- } = useValidation({
56
- props: sharedPropsWithDefaults,
57
- value,
58
- timezone,
59
- validator: validateDateTimeRange,
60
- onError: sharedPropsWithDefaults.onError
61
- });
62
-
63
- // TODO: Maybe export utility from `useField` instead of copy/pasting the logic
64
- const buildChangeHandler = index => {
65
- return (newDate, rawContext) => {
66
- const newDateRange = index === 0 ? [newDate, value[1]] : [value[0], newDate];
67
- const context = _extends({}, rawContext, {
68
- validationError: getValidationErrorForNewValue(newDateRange)
69
- });
70
- handleValueChange(newDateRange, context);
71
- };
72
- };
73
- const handleStartDateChange = useEventCallback(buildChangeHandler(0));
74
- const handleEndDateChange = useEventCallback(buildChangeHandler(1));
75
- const selectedSectionsResponse = useMultiInputFieldSelectedSections({
76
- selectedSections,
77
- onSelectedSectionsChange,
78
- unstableStartFieldRef,
79
- unstableEndFieldRef
80
- });
81
- const startFieldProps = _extends({
82
- error: !!validationError[0]
83
- }, startTextFieldProps, selectedSectionsResponse.start, {
84
- disabled,
85
- readOnly,
86
- format,
87
- formatDensity,
88
- shouldRespectLeadingZeros,
89
- timezone,
90
- value: valueProp === undefined ? undefined : valueProp[0],
91
- defaultValue: defaultValue === undefined ? undefined : defaultValue[0],
92
- onChange: handleStartDateChange,
93
- enableAccessibleFieldDOMStructure,
94
- autoFocus // Do not add on end field.
95
- });
96
- const endFieldProps = _extends({
97
- error: !!validationError[1]
98
- }, endTextFieldProps, selectedSectionsResponse.end, {
99
- format,
100
- formatDensity,
101
- shouldRespectLeadingZeros,
102
- disabled,
103
- readOnly,
104
- timezone,
105
- value: valueProp === undefined ? undefined : valueProp[1],
106
- defaultValue: defaultValue === undefined ? undefined : defaultValue[1],
107
- onChange: handleEndDateChange,
108
- enableAccessibleFieldDOMStructure
109
- });
110
- const startDateResponse = useDateTimeField(startFieldProps);
111
- const endDateResponse = useDateTimeField(endFieldProps);
112
-
113
- /* TODO: Undo this change when a clearable behavior for multiple input range fields is implemented */
114
- return {
115
- startDate: excludeProps(startDateResponse, ['clearable', 'onClear']),
116
- endDate: excludeProps(endDateResponse, ['clearable', 'onClear'])
117
- };
118
- };
@@ -1,118 +0,0 @@
1
- import _extends from "@babel/runtime/helpers/esm/extends";
2
- import useEventCallback from '@mui/utils/useEventCallback';
3
- import { unstable_useTimeField as useTimeField } from '@mui/x-date-pickers/TimeField';
4
- import { useControlledValueWithTimezone, useFieldInternalPropsWithDefaults } from '@mui/x-date-pickers/internals';
5
- import { useValidation } from '@mui/x-date-pickers/validation';
6
- import { validateTimeRange } from "../../../validation/index.js";
7
- import { rangeValueManager } from "../../utils/valueManagers.js";
8
- import { excludeProps } from "./shared.js";
9
- import { useMultiInputFieldSelectedSections } from "../useMultiInputFieldSelectedSections.js";
10
- import { useTimeRangeManager } from "../../../managers/index.js";
11
- export const useMultiInputTimeRangeField = ({
12
- sharedProps,
13
- startTextFieldProps,
14
- unstableStartFieldRef,
15
- endTextFieldProps,
16
- unstableEndFieldRef
17
- }) => {
18
- const manager = useTimeRangeManager(sharedProps);
19
- const sharedPropsWithDefaults = useFieldInternalPropsWithDefaults({
20
- manager,
21
- internalProps: sharedProps
22
- });
23
- const {
24
- value: valueProp,
25
- defaultValue,
26
- referenceDate,
27
- format,
28
- formatDensity,
29
- shouldRespectLeadingZeros,
30
- onChange,
31
- disabled,
32
- readOnly,
33
- selectedSections,
34
- onSelectedSectionsChange,
35
- timezone: timezoneProp,
36
- enableAccessibleFieldDOMStructure,
37
- autoFocus
38
- } = sharedPropsWithDefaults;
39
- const {
40
- value,
41
- handleValueChange,
42
- timezone
43
- } = useControlledValueWithTimezone({
44
- name: 'useMultiInputTimeRangeField',
45
- timezone: timezoneProp,
46
- value: valueProp,
47
- defaultValue,
48
- onChange,
49
- valueManager: rangeValueManager,
50
- referenceDate
51
- });
52
- const {
53
- validationError,
54
- getValidationErrorForNewValue
55
- } = useValidation({
56
- props: sharedPropsWithDefaults,
57
- value,
58
- timezone,
59
- validator: validateTimeRange,
60
- onError: sharedPropsWithDefaults.onError
61
- });
62
-
63
- // TODO: Maybe export utility from `useField` instead of copy/pasting the logic
64
- const buildChangeHandler = index => {
65
- return (newDate, rawContext) => {
66
- const newDateRange = index === 0 ? [newDate, value[1]] : [value[0], newDate];
67
- const context = _extends({}, rawContext, {
68
- validationError: getValidationErrorForNewValue(newDateRange)
69
- });
70
- handleValueChange(newDateRange, context);
71
- };
72
- };
73
- const handleStartDateChange = useEventCallback(buildChangeHandler(0));
74
- const handleEndDateChange = useEventCallback(buildChangeHandler(1));
75
- const selectedSectionsResponse = useMultiInputFieldSelectedSections({
76
- selectedSections,
77
- onSelectedSectionsChange,
78
- unstableStartFieldRef,
79
- unstableEndFieldRef
80
- });
81
- const startFieldProps = _extends({
82
- error: !!validationError[0]
83
- }, startTextFieldProps, selectedSectionsResponse.start, {
84
- disabled,
85
- readOnly,
86
- format,
87
- formatDensity,
88
- shouldRespectLeadingZeros,
89
- timezone,
90
- value: valueProp === undefined ? undefined : valueProp[0],
91
- defaultValue: defaultValue === undefined ? undefined : defaultValue[0],
92
- onChange: handleStartDateChange,
93
- enableAccessibleFieldDOMStructure,
94
- autoFocus // Do not add on end field.
95
- });
96
- const endFieldProps = _extends({
97
- error: !!validationError[1]
98
- }, endTextFieldProps, selectedSectionsResponse.end, {
99
- format,
100
- formatDensity,
101
- shouldRespectLeadingZeros,
102
- disabled,
103
- readOnly,
104
- timezone,
105
- value: valueProp === undefined ? undefined : valueProp[1],
106
- defaultValue: defaultValue === undefined ? undefined : defaultValue[1],
107
- onChange: handleEndDateChange,
108
- enableAccessibleFieldDOMStructure
109
- });
110
- const startDateResponse = useTimeField(startFieldProps);
111
- const endDateResponse = useTimeField(endFieldProps);
112
-
113
- /* TODO: Undo this change when a clearable behavior for multiple input range fields is implemented */
114
- return {
115
- startDate: excludeProps(startDateResponse, ['clearable', 'onClear']),
116
- endDate: excludeProps(endDateResponse, ['clearable', 'onClear'])
117
- };
118
- };
@@ -1 +0,0 @@
1
- export {};
@@ -1 +0,0 @@
1
- export {};
@@ -1 +0,0 @@
1
- export {};
@@ -1,5 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
@@ -1,16 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.excludeProps = void 0;
7
- /* TODO: remove this when a clearable behavior for multiple input range fields is implemented */
8
- const excludeProps = (props, excludedProps) => {
9
- return Object.keys(props).reduce((acc, key) => {
10
- if (!excludedProps.includes(key)) {
11
- acc[key] = props[key];
12
- }
13
- return acc;
14
- }, {});
15
- };
16
- exports.excludeProps = excludeProps;
@@ -1,126 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.useMultiInputDateRangeField = void 0;
8
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
- var _useEventCallback = _interopRequireDefault(require("@mui/utils/useEventCallback"));
10
- var _DateField = require("@mui/x-date-pickers/DateField");
11
- var _internals = require("@mui/x-date-pickers/internals");
12
- var _validation = require("@mui/x-date-pickers/validation");
13
- var _validation2 = require("../../../validation");
14
- var _valueManagers = require("../../utils/valueManagers");
15
- var _shared = require("./shared");
16
- var _useMultiInputFieldSelectedSections = require("../useMultiInputFieldSelectedSections");
17
- var _managers = require("../../../managers");
18
- const useMultiInputDateRangeField = ({
19
- sharedProps,
20
- startTextFieldProps,
21
- unstableStartFieldRef,
22
- endTextFieldProps,
23
- unstableEndFieldRef
24
- }) => {
25
- const manager = (0, _managers.useDateRangeManager)(sharedProps);
26
- const sharedPropsWithDefaults = (0, _internals.useFieldInternalPropsWithDefaults)({
27
- manager,
28
- internalProps: sharedProps
29
- });
30
- const {
31
- value: valueProp,
32
- defaultValue,
33
- referenceDate,
34
- format,
35
- formatDensity,
36
- shouldRespectLeadingZeros,
37
- onChange,
38
- disabled,
39
- readOnly,
40
- selectedSections,
41
- onSelectedSectionsChange,
42
- timezone: timezoneProp,
43
- enableAccessibleFieldDOMStructure,
44
- autoFocus
45
- } = sharedPropsWithDefaults;
46
- const {
47
- value,
48
- handleValueChange,
49
- timezone
50
- } = (0, _internals.useControlledValueWithTimezone)({
51
- name: 'useMultiInputDateRangeField',
52
- timezone: timezoneProp,
53
- value: valueProp,
54
- defaultValue,
55
- referenceDate,
56
- onChange,
57
- valueManager: _valueManagers.rangeValueManager
58
- });
59
- const {
60
- validationError,
61
- getValidationErrorForNewValue
62
- } = (0, _validation.useValidation)({
63
- props: sharedPropsWithDefaults,
64
- value,
65
- timezone,
66
- validator: _validation2.validateDateRange,
67
- onError: sharedPropsWithDefaults.onError
68
- });
69
-
70
- // TODO: Maybe export utility from `useField` instead of copy/pasting the logic
71
- const buildChangeHandler = index => {
72
- return (newDate, rawContext) => {
73
- const newDateRange = index === 0 ? [newDate, value[1]] : [value[0], newDate];
74
- const context = (0, _extends2.default)({}, rawContext, {
75
- validationError: getValidationErrorForNewValue(newDateRange)
76
- });
77
- handleValueChange(newDateRange, context);
78
- };
79
- };
80
- const handleStartDateChange = (0, _useEventCallback.default)(buildChangeHandler(0));
81
- const handleEndDateChange = (0, _useEventCallback.default)(buildChangeHandler(1));
82
- const selectedSectionsResponse = (0, _useMultiInputFieldSelectedSections.useMultiInputFieldSelectedSections)({
83
- selectedSections,
84
- onSelectedSectionsChange,
85
- unstableStartFieldRef,
86
- unstableEndFieldRef
87
- });
88
- const startFieldProps = (0, _extends2.default)({
89
- error: !!validationError[0]
90
- }, startTextFieldProps, selectedSectionsResponse.start, {
91
- disabled,
92
- readOnly,
93
- format,
94
- formatDensity,
95
- shouldRespectLeadingZeros,
96
- timezone,
97
- value: valueProp === undefined ? undefined : valueProp[0],
98
- defaultValue: defaultValue === undefined ? undefined : defaultValue[0],
99
- onChange: handleStartDateChange,
100
- enableAccessibleFieldDOMStructure,
101
- autoFocus // Do not add on end field.
102
- });
103
- const endFieldProps = (0, _extends2.default)({
104
- error: !!validationError[1]
105
- }, endTextFieldProps, selectedSectionsResponse.end, {
106
- format,
107
- formatDensity,
108
- shouldRespectLeadingZeros,
109
- disabled,
110
- readOnly,
111
- timezone,
112
- value: valueProp === undefined ? undefined : valueProp[1],
113
- defaultValue: defaultValue === undefined ? undefined : defaultValue[1],
114
- onChange: handleEndDateChange,
115
- enableAccessibleFieldDOMStructure
116
- });
117
- const startDateResponse = (0, _DateField.unstable_useDateField)(startFieldProps);
118
- const endDateResponse = (0, _DateField.unstable_useDateField)(endFieldProps);
119
-
120
- /* TODO: Undo this change when a clearable behavior for multiple input range fields is implemented */
121
- return {
122
- startDate: (0, _shared.excludeProps)(startDateResponse, ['clearable', 'onClear']),
123
- endDate: (0, _shared.excludeProps)(endDateResponse, ['clearable', 'onClear'])
124
- };
125
- };
126
- exports.useMultiInputDateRangeField = useMultiInputDateRangeField;
@@ -1,126 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.useMultiInputDateTimeRangeField = void 0;
8
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
- var _useEventCallback = _interopRequireDefault(require("@mui/utils/useEventCallback"));
10
- var _DateTimeField = require("@mui/x-date-pickers/DateTimeField");
11
- var _internals = require("@mui/x-date-pickers/internals");
12
- var _validation = require("@mui/x-date-pickers/validation");
13
- var _validation2 = require("../../../validation");
14
- var _valueManagers = require("../../utils/valueManagers");
15
- var _shared = require("./shared");
16
- var _useMultiInputFieldSelectedSections = require("../useMultiInputFieldSelectedSections");
17
- var _managers = require("../../../managers");
18
- const useMultiInputDateTimeRangeField = ({
19
- sharedProps,
20
- startTextFieldProps,
21
- unstableStartFieldRef,
22
- endTextFieldProps,
23
- unstableEndFieldRef
24
- }) => {
25
- const manager = (0, _managers.useDateTimeRangeManager)(sharedProps);
26
- const sharedPropsWithDefaults = (0, _internals.useFieldInternalPropsWithDefaults)({
27
- manager,
28
- internalProps: sharedProps
29
- });
30
- const {
31
- value: valueProp,
32
- defaultValue,
33
- referenceDate,
34
- format,
35
- formatDensity,
36
- shouldRespectLeadingZeros,
37
- onChange,
38
- disabled,
39
- readOnly,
40
- selectedSections,
41
- onSelectedSectionsChange,
42
- timezone: timezoneProp,
43
- enableAccessibleFieldDOMStructure,
44
- autoFocus
45
- } = sharedPropsWithDefaults;
46
- const {
47
- value,
48
- handleValueChange,
49
- timezone
50
- } = (0, _internals.useControlledValueWithTimezone)({
51
- name: 'useMultiInputDateTimeRangeField',
52
- timezone: timezoneProp,
53
- value: valueProp,
54
- defaultValue,
55
- referenceDate,
56
- onChange,
57
- valueManager: _valueManagers.rangeValueManager
58
- });
59
- const {
60
- validationError,
61
- getValidationErrorForNewValue
62
- } = (0, _validation.useValidation)({
63
- props: sharedPropsWithDefaults,
64
- value,
65
- timezone,
66
- validator: _validation2.validateDateTimeRange,
67
- onError: sharedPropsWithDefaults.onError
68
- });
69
-
70
- // TODO: Maybe export utility from `useField` instead of copy/pasting the logic
71
- const buildChangeHandler = index => {
72
- return (newDate, rawContext) => {
73
- const newDateRange = index === 0 ? [newDate, value[1]] : [value[0], newDate];
74
- const context = (0, _extends2.default)({}, rawContext, {
75
- validationError: getValidationErrorForNewValue(newDateRange)
76
- });
77
- handleValueChange(newDateRange, context);
78
- };
79
- };
80
- const handleStartDateChange = (0, _useEventCallback.default)(buildChangeHandler(0));
81
- const handleEndDateChange = (0, _useEventCallback.default)(buildChangeHandler(1));
82
- const selectedSectionsResponse = (0, _useMultiInputFieldSelectedSections.useMultiInputFieldSelectedSections)({
83
- selectedSections,
84
- onSelectedSectionsChange,
85
- unstableStartFieldRef,
86
- unstableEndFieldRef
87
- });
88
- const startFieldProps = (0, _extends2.default)({
89
- error: !!validationError[0]
90
- }, startTextFieldProps, selectedSectionsResponse.start, {
91
- disabled,
92
- readOnly,
93
- format,
94
- formatDensity,
95
- shouldRespectLeadingZeros,
96
- timezone,
97
- value: valueProp === undefined ? undefined : valueProp[0],
98
- defaultValue: defaultValue === undefined ? undefined : defaultValue[0],
99
- onChange: handleStartDateChange,
100
- enableAccessibleFieldDOMStructure,
101
- autoFocus // Do not add on end field.
102
- });
103
- const endFieldProps = (0, _extends2.default)({
104
- error: !!validationError[1]
105
- }, endTextFieldProps, selectedSectionsResponse.end, {
106
- format,
107
- formatDensity,
108
- shouldRespectLeadingZeros,
109
- disabled,
110
- readOnly,
111
- timezone,
112
- value: valueProp === undefined ? undefined : valueProp[1],
113
- defaultValue: defaultValue === undefined ? undefined : defaultValue[1],
114
- onChange: handleEndDateChange,
115
- enableAccessibleFieldDOMStructure
116
- });
117
- const startDateResponse = (0, _DateTimeField.unstable_useDateTimeField)(startFieldProps);
118
- const endDateResponse = (0, _DateTimeField.unstable_useDateTimeField)(endFieldProps);
119
-
120
- /* TODO: Undo this change when a clearable behavior for multiple input range fields is implemented */
121
- return {
122
- startDate: (0, _shared.excludeProps)(startDateResponse, ['clearable', 'onClear']),
123
- endDate: (0, _shared.excludeProps)(endDateResponse, ['clearable', 'onClear'])
124
- };
125
- };
126
- exports.useMultiInputDateTimeRangeField = useMultiInputDateTimeRangeField;
@@ -1,5 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });