@mui/x-date-pickers 6.16.2 → 6.16.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (178) hide show
  1. package/CHANGELOG.md +65 -0
  2. package/DateField/DateField.js +1 -1
  3. package/DatePicker/DatePicker.d.ts +10 -0
  4. package/DatePicker/DatePicker.js +10 -0
  5. package/DatePicker/DatePickerToolbar.d.ts +10 -0
  6. package/DatePicker/DatePickerToolbar.js +10 -0
  7. package/DateTimeField/DateTimeField.js +1 -1
  8. package/DateTimePicker/DateTimePickerTabs.d.ts +10 -0
  9. package/DateTimePicker/DateTimePickerTabs.js +11 -0
  10. package/DateTimePicker/DateTimePickerToolbar.d.ts +10 -0
  11. package/DateTimePicker/DateTimePickerToolbar.js +11 -0
  12. package/DayCalendarSkeleton/DayCalendarSkeleton.d.ts +1 -2
  13. package/DayCalendarSkeleton/DayCalendarSkeleton.js +1 -2
  14. package/DesktopDatePicker/DesktopDatePicker.d.ts +10 -0
  15. package/DesktopDatePicker/DesktopDatePicker.js +10 -0
  16. package/DigitalClock/DigitalClock.d.ts +10 -0
  17. package/DigitalClock/DigitalClock.js +10 -0
  18. package/LocalizationProvider/LocalizationProvider.d.ts +12 -0
  19. package/LocalizationProvider/LocalizationProvider.js +12 -0
  20. package/MobileDatePicker/MobileDatePicker.d.ts +10 -0
  21. package/MobileDatePicker/MobileDatePicker.js +10 -0
  22. package/MultiSectionDigitalClock/MultiSectionDigitalClock.d.ts +10 -0
  23. package/MultiSectionDigitalClock/MultiSectionDigitalClock.js +10 -0
  24. package/PickersActionBar/PickersActionBar.d.ts +10 -0
  25. package/PickersActionBar/PickersActionBar.js +10 -0
  26. package/PickersCalendarHeader/PickersCalendarHeader.d.ts +11 -0
  27. package/PickersCalendarHeader/PickersCalendarHeader.js +11 -0
  28. package/PickersDay/PickersDay.d.ts +1 -3
  29. package/PickersDay/PickersDay.js +1 -3
  30. package/PickersLayout/PickersLayout.d.ts +9 -0
  31. package/PickersLayout/PickersLayout.js +10 -0
  32. package/PickersShortcuts/PickersShortcuts.d.ts +9 -0
  33. package/PickersShortcuts/PickersShortcuts.js +9 -0
  34. package/StaticDatePicker/StaticDatePicker.d.ts +10 -0
  35. package/StaticDatePicker/StaticDatePicker.js +10 -0
  36. package/TimeClock/TimeClock.d.ts +4 -0
  37. package/TimeClock/TimeClock.js +4 -0
  38. package/TimeField/TimeField.js +1 -1
  39. package/TimePicker/TimePickerToolbar.d.ts +10 -0
  40. package/TimePicker/TimePickerToolbar.js +11 -0
  41. package/index.js +1 -1
  42. package/internals/components/FakeTextField/FakeTextField.d.ts +6 -3
  43. package/internals/components/FakeTextField/FakeTextField.js +17 -9
  44. package/internals/hooks/useField/useField.js +14 -4
  45. package/internals/hooks/useField/useField.utils.js +1 -1
  46. package/internals/hooks/useField/useFieldState.js +5 -8
  47. package/legacy/DateField/DateField.js +1 -1
  48. package/legacy/DatePicker/DatePicker.js +10 -0
  49. package/legacy/DatePicker/DatePickerToolbar.js +10 -0
  50. package/legacy/DateTimeField/DateTimeField.js +1 -1
  51. package/legacy/DateTimePicker/DateTimePickerTabs.js +11 -0
  52. package/legacy/DateTimePicker/DateTimePickerToolbar.js +11 -0
  53. package/legacy/DayCalendarSkeleton/DayCalendarSkeleton.js +1 -2
  54. package/legacy/DesktopDatePicker/DesktopDatePicker.js +10 -0
  55. package/legacy/DigitalClock/DigitalClock.js +10 -0
  56. package/legacy/LocalizationProvider/LocalizationProvider.js +12 -0
  57. package/legacy/MobileDatePicker/MobileDatePicker.js +10 -0
  58. package/legacy/MultiSectionDigitalClock/MultiSectionDigitalClock.js +10 -0
  59. package/legacy/PickersActionBar/PickersActionBar.js +10 -0
  60. package/legacy/PickersCalendarHeader/PickersCalendarHeader.js +11 -0
  61. package/legacy/PickersDay/PickersDay.js +1 -3
  62. package/legacy/PickersLayout/PickersLayout.js +10 -0
  63. package/legacy/PickersShortcuts/PickersShortcuts.js +9 -0
  64. package/legacy/StaticDatePicker/StaticDatePicker.js +10 -0
  65. package/legacy/TimeClock/TimeClock.js +4 -0
  66. package/legacy/TimeField/TimeField.js +1 -1
  67. package/legacy/TimePicker/TimePickerToolbar.js +11 -0
  68. package/legacy/index.js +1 -1
  69. package/legacy/internals/components/FakeTextField/FakeTextField.js +13 -9
  70. package/legacy/internals/hooks/useField/useField.js +14 -4
  71. package/legacy/internals/hooks/useField/useField.utils.js +1 -1
  72. package/legacy/internals/hooks/useField/useFieldState.js +5 -8
  73. package/modern/DateField/DateField.js +1 -1
  74. package/modern/DatePicker/DatePicker.js +10 -0
  75. package/modern/DatePicker/DatePickerToolbar.js +10 -0
  76. package/modern/DateTimeField/DateTimeField.js +1 -1
  77. package/modern/DateTimePicker/DateTimePickerTabs.js +11 -0
  78. package/modern/DateTimePicker/DateTimePickerToolbar.js +11 -0
  79. package/modern/DayCalendarSkeleton/DayCalendarSkeleton.js +1 -2
  80. package/modern/DesktopDatePicker/DesktopDatePicker.js +10 -0
  81. package/modern/DigitalClock/DigitalClock.js +10 -0
  82. package/modern/LocalizationProvider/LocalizationProvider.js +12 -0
  83. package/modern/MobileDatePicker/MobileDatePicker.js +10 -0
  84. package/modern/MultiSectionDigitalClock/MultiSectionDigitalClock.js +10 -0
  85. package/modern/PickersActionBar/PickersActionBar.js +10 -0
  86. package/modern/PickersCalendarHeader/PickersCalendarHeader.js +11 -0
  87. package/modern/PickersDay/PickersDay.js +1 -3
  88. package/modern/PickersLayout/PickersLayout.js +10 -0
  89. package/modern/PickersShortcuts/PickersShortcuts.js +9 -0
  90. package/modern/StaticDatePicker/StaticDatePicker.js +10 -0
  91. package/modern/TimeClock/TimeClock.js +4 -0
  92. package/modern/TimeField/TimeField.js +1 -1
  93. package/modern/TimePicker/TimePickerToolbar.js +11 -0
  94. package/modern/index.js +1 -1
  95. package/modern/internals/components/FakeTextField/FakeTextField.js +17 -9
  96. package/modern/internals/hooks/useField/useField.js +14 -4
  97. package/modern/internals/hooks/useField/useField.utils.js +1 -1
  98. package/modern/internals/hooks/useField/useFieldState.js +5 -8
  99. package/node/DateCalendar/DateCalendar.js +2 -2
  100. package/node/DateCalendar/DayCalendar.js +2 -2
  101. package/node/DateCalendar/PickersFadeTransitionGroup.js +2 -2
  102. package/node/DateCalendar/PickersSlideTransition.js +2 -2
  103. package/node/DateCalendar/useCalendarState.js +2 -2
  104. package/node/DateCalendar/useIsDateDisabled.js +2 -2
  105. package/node/DateField/DateField.js +3 -3
  106. package/node/DatePicker/DatePicker.js +12 -2
  107. package/node/DatePicker/DatePickerToolbar.js +12 -2
  108. package/node/DatePicker/shared.js +2 -2
  109. package/node/DateTimeField/DateTimeField.js +3 -3
  110. package/node/DateTimePicker/DateTimePicker.js +2 -2
  111. package/node/DateTimePicker/DateTimePickerTabs.js +13 -2
  112. package/node/DateTimePicker/DateTimePickerToolbar.js +13 -2
  113. package/node/DateTimePicker/shared.js +2 -2
  114. package/node/DayCalendarSkeleton/DayCalendarSkeleton.js +3 -4
  115. package/node/DesktopDatePicker/DesktopDatePicker.js +12 -2
  116. package/node/DesktopDateTimePicker/DesktopDateTimePicker.js +2 -2
  117. package/node/DesktopTimePicker/DesktopTimePicker.js +2 -2
  118. package/node/DigitalClock/DigitalClock.js +12 -2
  119. package/node/LocalizationProvider/LocalizationProvider.js +14 -2
  120. package/node/MobileDatePicker/MobileDatePicker.js +12 -2
  121. package/node/MobileDateTimePicker/MobileDateTimePicker.js +2 -2
  122. package/node/MobileTimePicker/MobileTimePicker.js +2 -2
  123. package/node/MonthCalendar/MonthCalendar.js +2 -2
  124. package/node/MonthCalendar/PickersMonth.js +2 -2
  125. package/node/MultiSectionDigitalClock/MultiSectionDigitalClock.js +12 -2
  126. package/node/MultiSectionDigitalClock/MultiSectionDigitalClockSection.js +2 -2
  127. package/node/PickersActionBar/PickersActionBar.js +12 -2
  128. package/node/PickersCalendarHeader/PickersCalendarHeader.js +13 -2
  129. package/node/PickersDay/PickersDay.js +3 -5
  130. package/node/PickersLayout/PickersLayout.js +12 -2
  131. package/node/PickersLayout/usePickerLayout.js +2 -2
  132. package/node/PickersShortcuts/PickersShortcuts.js +11 -2
  133. package/node/StaticDatePicker/StaticDatePicker.js +12 -2
  134. package/node/StaticDateTimePicker/StaticDateTimePicker.js +2 -2
  135. package/node/StaticTimePicker/StaticTimePicker.js +2 -2
  136. package/node/TimeClock/Clock.js +2 -2
  137. package/node/TimeClock/ClockNumber.js +2 -2
  138. package/node/TimeClock/ClockNumbers.js +2 -2
  139. package/node/TimeClock/ClockPointer.js +2 -2
  140. package/node/TimeClock/TimeClock.js +6 -2
  141. package/node/TimeField/TimeField.js +3 -3
  142. package/node/TimePicker/TimePicker.js +2 -2
  143. package/node/TimePicker/TimePickerToolbar.js +13 -2
  144. package/node/TimePicker/shared.js +2 -2
  145. package/node/YearCalendar/PickersYear.js +2 -2
  146. package/node/YearCalendar/YearCalendar.js +2 -2
  147. package/node/dateTimeViewRenderers/dateTimeViewRenderers.js +2 -2
  148. package/node/dateViewRenderers/dateViewRenderers.js +2 -2
  149. package/node/hooks/useClearableField.js +2 -2
  150. package/node/icons/index.js +2 -2
  151. package/node/index.js +1 -1
  152. package/node/internals/components/FakeTextField/FakeTextField.js +20 -12
  153. package/node/internals/components/PickersArrowSwitcher/PickersArrowSwitcher.js +2 -2
  154. package/node/internals/components/PickersModalDialog.js +2 -2
  155. package/node/internals/components/PickersPopper.js +2 -2
  156. package/node/internals/components/PickersToolbar.js +2 -2
  157. package/node/internals/components/PickersToolbarButton.js +2 -2
  158. package/node/internals/components/PickersToolbarText.js +2 -2
  159. package/node/internals/demo/DemoContainer.js +2 -2
  160. package/node/internals/hooks/date-helpers-hooks.js +2 -2
  161. package/node/internals/hooks/useClockReferenceDate.js +2 -2
  162. package/node/internals/hooks/useDesktopPicker/useDesktopPicker.js +2 -2
  163. package/node/internals/hooks/useField/useField.js +16 -6
  164. package/node/internals/hooks/useField/useField.utils.js +1 -1
  165. package/node/internals/hooks/useField/useFieldCharacterEditing.js +2 -2
  166. package/node/internals/hooks/useField/useFieldState.js +7 -10
  167. package/node/internals/hooks/useIsLandscape.js +2 -2
  168. package/node/internals/hooks/useMobilePicker/useMobilePicker.js +2 -2
  169. package/node/internals/hooks/useOpenState.js +2 -2
  170. package/node/internals/hooks/usePicker/usePickerValue.js +2 -2
  171. package/node/internals/hooks/usePicker/usePickerViews.js +2 -2
  172. package/node/internals/hooks/useStaticPicker/useStaticPicker.js +2 -2
  173. package/node/internals/hooks/useUtils.js +2 -2
  174. package/node/internals/hooks/useValidation.js +2 -2
  175. package/node/internals/hooks/useValueWithTimezone.js +2 -2
  176. package/node/internals/hooks/useViews.js +2 -2
  177. package/node/timeViewRenderers/timeViewRenderers.js +2 -2
  178. package/package.json +4 -4
@@ -4,6 +4,10 @@ type TimeClockComponent = (<TDate>(props: TimeClockProps<TDate> & React.RefAttri
4
4
  propTypes?: any;
5
5
  };
6
6
  /**
7
+ * Demos:
8
+ *
9
+ * - [TimePicker](https://mui.com/x/react-date-pickers/time-picker/)
10
+ * - [TimeClock](https://mui.com/x/react-date-pickers/time-clock/)
7
11
  *
8
12
  * API:
9
13
  *
@@ -52,6 +52,10 @@ const TimeClockArrowSwitcher = styled(PickersArrowSwitcher, {
52
52
  const TIME_CLOCK_DEFAULT_VIEWS = ['hours', 'minutes'];
53
53
 
54
54
  /**
55
+ * Demos:
56
+ *
57
+ * - [TimePicker](https://mui.com/x/react-date-pickers/time-picker/)
58
+ * - [TimeClock](https://mui.com/x/react-date-pickers/time-clock/)
55
59
  *
56
60
  * API:
57
61
  *
@@ -118,7 +118,7 @@ process.env.NODE_ENV !== "production" ? TimeField.propTypes = {
118
118
  /**
119
119
  * The color of the component.
120
120
  * It supports both default and custom theme colors, which can be added as shown in the
121
- * [palette customization guide](https://mui.com/material-ui/customization/palette/#adding-new-colors).
121
+ * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
122
122
  * @default 'primary'
123
123
  */
124
124
  color: PropTypes.oneOf(['error', 'info', 'primary', 'secondary', 'success', 'warning']),
@@ -11,6 +11,16 @@ export interface ExportedTimePickerToolbarProps extends ExportedBaseToolbarProps
11
11
  ampm?: boolean;
12
12
  ampmInClock?: boolean;
13
13
  }
14
+ /**
15
+ * Demos:
16
+ *
17
+ * - [TimePicker](https://mui.com/x/react-date-pickers/time-picker/)
18
+ * - [Custom components](https://mui.com/x/react-date-pickers/custom-components/)
19
+ *
20
+ * API:
21
+ *
22
+ * - [TimePickerToolbar API](https://mui.com/x/api/date-pickers/time-picker-toolbar/)
23
+ */
14
24
  declare function TimePickerToolbar<TDate extends unknown>(inProps: TimePickerToolbarProps<TDate>): React.JSX.Element;
15
25
  declare namespace TimePickerToolbar {
16
26
  var propTypes: any;
@@ -106,6 +106,17 @@ TimePickerToolbarAmPmSelection.propTypes = {
106
106
  ownerState: PropTypes.object.isRequired,
107
107
  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
108
108
  };
109
+
110
+ /**
111
+ * Demos:
112
+ *
113
+ * - [TimePicker](https://mui.com/x/react-date-pickers/time-picker/)
114
+ * - [Custom components](https://mui.com/x/react-date-pickers/custom-components/)
115
+ *
116
+ * API:
117
+ *
118
+ * - [TimePickerToolbar API](https://mui.com/x/api/date-pickers/time-picker-toolbar/)
119
+ */
109
120
  function TimePickerToolbar(inProps) {
110
121
  const props = useThemeProps({
111
122
  props: inProps,
package/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @mui/x-date-pickers v6.16.2
2
+ * @mui/x-date-pickers v6.16.3
3
3
  *
4
4
  * @license MIT
5
5
  * This source code is licensed under the MIT license found in the
@@ -1,7 +1,10 @@
1
1
  import * as React from 'react';
2
- import { FieldSection } from '../../../models';
2
+ export interface FakeTextFieldElement extends React.HTMLAttributes<HTMLDivElement> {
3
+ before: string;
4
+ after: string;
5
+ }
3
6
  interface FakeTextFieldProps {
4
- sections: FieldSection[];
7
+ elements: FakeTextFieldElement[];
5
8
  }
6
- export declare function FakeTextField(props: FakeTextFieldProps): React.JSX.Element;
9
+ export declare const FakeTextField: React.ForwardRefExoticComponent<FakeTextFieldProps & React.RefAttributes<HTMLDivElement>>;
7
10
  export {};
@@ -1,19 +1,27 @@
1
+ import _extends from "@babel/runtime/helpers/esm/extends";
2
+ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
3
+ const _excluded = ["before", "after"];
1
4
  import * as React from 'react';
2
5
  import Stack from '@mui/material/Stack';
3
6
  import { jsx as _jsx } from "react/jsx-runtime";
4
7
  import { jsxs as _jsxs } from "react/jsx-runtime";
5
- export function FakeTextField(props) {
8
+ export const FakeTextField = /*#__PURE__*/React.forwardRef(function FakeTextField(props, ref) {
6
9
  const {
7
- sections
10
+ elements
8
11
  } = props;
9
12
  return /*#__PURE__*/_jsx(Stack, {
10
13
  direction: "row",
11
14
  spacing: 1,
12
- children: sections.map(section => /*#__PURE__*/_jsxs(React.Fragment, {
13
- children: [section.startSeparator, /*#__PURE__*/_jsx("input", {
14
- value: section.value,
15
- onChange: () => {}
16
- }), section.endSeparator]
17
- }))
15
+ ref: ref,
16
+ children: elements.map((_ref, elementIndex) => {
17
+ let {
18
+ before,
19
+ after
20
+ } = _ref,
21
+ otherElementProps = _objectWithoutPropertiesLoose(_ref, _excluded);
22
+ return /*#__PURE__*/_jsxs(React.Fragment, {
23
+ children: [before, /*#__PURE__*/_jsx("input", _extends({}, otherElementProps)), after]
24
+ }, elementIndex);
25
+ })
18
26
  });
19
- }
27
+ });
@@ -162,6 +162,11 @@ export const useField = params => {
162
162
  return;
163
163
  }
164
164
  const targetValue = event.target.value;
165
+ if (targetValue === '') {
166
+ resetCharacterQuery();
167
+ clearValue();
168
+ return;
169
+ }
165
170
  const eventData = event.nativeEvent.data;
166
171
  // Calling `.fill(04/11/2022)` in playwright will trigger a change event with the requested content to insert in `event.nativeEvent.data`
167
172
  // usual changes have only the currently typed character in the `event.nativeEvent.data`
@@ -201,8 +206,13 @@ export const useField = params => {
201
206
  const activeSectionEndRelativeToNewValue = cleanValueStr.length - prevValueStr.length + activeSection.end - cleanString(activeSection.endSeparator || '').length;
202
207
  keyPressed = cleanValueStr.slice(activeSection.start + cleanString(activeSection.startSeparator || '').length, activeSectionEndRelativeToNewValue);
203
208
  }
204
- if (isAndroid() && keyPressed.length === 0) {
205
- setTempAndroidValueStr(valueStr);
209
+ if (keyPressed.length === 0) {
210
+ if (isAndroid()) {
211
+ setTempAndroidValueStr(valueStr);
212
+ } else {
213
+ resetCharacterQuery();
214
+ clearActiveSection();
215
+ }
206
216
  return;
207
217
  }
208
218
  applyCharacterEditing({
@@ -260,7 +270,7 @@ export const useField = params => {
260
270
  }
261
271
 
262
272
  // Reset the value of the selected section
263
- case ['Backspace', 'Delete'].includes(event.key):
273
+ case event.key === 'Delete':
264
274
  {
265
275
  event.preventDefault();
266
276
  if (readOnly) {
@@ -321,7 +331,7 @@ export const useField = params => {
321
331
  // Fix scroll jumping on iOS browser: https://github.com/mui/mui-x/issues/8321
322
332
  const currentScrollTop = inputRef.current.scrollTop;
323
333
  // On multi input range pickers we want to update selection range only for the active input
324
- // This helps avoiding the focus jumping on Safari https://github.com/mui/mui-x/issues/9003
334
+ // This helps to avoid the focus jumping on Safari https://github.com/mui/mui-x/issues/9003
325
335
  // because WebKit implements the `setSelectionRange` based on the spec: https://bugs.webkit.org/show_bug.cgi?id=224425
326
336
  if (inputRef.current === getActiveElement(document)) {
327
337
  inputRef.current.setSelectionRange(selectionStart, selectionEnd);
@@ -300,7 +300,7 @@ export const doesSectionFormatHaveLeadingZeros = (utils, timezone, contentType,
300
300
  }
301
301
  case 'seconds':
302
302
  {
303
- return utils.formatByString(utils.setMinutes(now, 1), format).length > 1;
303
+ return utils.formatByString(utils.setSeconds(now, 1), format).length > 1;
304
304
  }
305
305
  default:
306
306
  {
@@ -117,6 +117,9 @@ export const useFieldState = params => {
117
117
  referenceValue,
118
118
  tempValueStrAndroid: null
119
119
  }));
120
+ if (valueManager.areValuesEqual(utils, state.value, value)) {
121
+ return;
122
+ }
120
123
  const context = {
121
124
  validationError: validator({
122
125
  adapter,
@@ -138,9 +141,6 @@ export const useFieldState = params => {
138
141
  return addPositionPropertiesToSections(newSections, isRTL);
139
142
  };
140
143
  const clearValue = () => {
141
- if (valueManager.areValuesEqual(utils, state.value, valueManager.emptyValue)) {
142
- return;
143
- }
144
144
  publishValue({
145
145
  value: valueManager.emptyValue,
146
146
  referenceValue: state.referenceValue,
@@ -152,14 +152,11 @@ export const useFieldState = params => {
152
152
  return;
153
153
  }
154
154
  const activeSection = state.sections[selectedSectionIndexes.startIndex];
155
- if (activeSection.value === '') {
156
- return;
157
- }
158
155
  const activeDateManager = fieldValueManager.getActiveDateManager(utils, state, activeSection);
159
156
  const nonEmptySectionCountBefore = activeDateManager.getSections(state.sections).filter(section => section.value !== '').length;
160
- const isTheOnlyNonEmptySection = nonEmptySectionCountBefore === 1;
157
+ const hasNoOtherNonEmptySections = nonEmptySectionCountBefore === (activeSection.value === '' ? 0 : 1);
161
158
  const newSections = setSectionValue(selectedSectionIndexes.startIndex, '');
162
- const newActiveDate = isTheOnlyNonEmptySection ? null : utils.date(new Date(''));
159
+ const newActiveDate = hasNoOtherNonEmptySections ? null : utils.date(new Date(''));
163
160
  const newValues = activeDateManager.getNewValuesFromNewActiveDate(newActiveDate);
164
161
  if ((newActiveDate != null && !utils.isValid(newActiveDate)) !== (activeDateManager.date != null && !utils.isValid(activeDateManager.date))) {
165
162
  publishValue(_extends({}, newValues, {
@@ -106,7 +106,7 @@ process.env.NODE_ENV !== "production" ? DateField.propTypes = {
106
106
  /**
107
107
  * The color of the component.
108
108
  * It supports both default and custom theme colors, which can be added as shown in the
109
- * [palette customization guide](https://mui.com/material-ui/customization/palette/#adding-new-colors).
109
+ * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
110
110
  * @default 'primary'
111
111
  */
112
112
  color: PropTypes.oneOf(['error', 'info', 'primary', 'secondary', 'success', 'warning']),
@@ -10,6 +10,16 @@ import { DesktopDatePicker } from '../DesktopDatePicker';
10
10
  import { MobileDatePicker } from '../MobileDatePicker';
11
11
  import { DEFAULT_DESKTOP_MODE_MEDIA_QUERY } from '../internals/utils/utils';
12
12
  import { jsx as _jsx } from "react/jsx-runtime";
13
+ /**
14
+ * Demos:
15
+ *
16
+ * - [DatePicker](https://mui.com/x/react-date-pickers/date-picker/)
17
+ * - [Validation](https://mui.com/x/react-date-pickers/validation/)
18
+ *
19
+ * API:
20
+ *
21
+ * - [DatePicker API](https://mui.com/x/api/date-pickers/date-picker/)
22
+ */
13
23
  var DatePicker = /*#__PURE__*/React.forwardRef(function DatePicker(inProps, ref) {
14
24
  var props = useThemeProps({
15
25
  props: inProps,
@@ -42,6 +42,16 @@ var DatePickerToolbarTitle = styled(Typography, {
42
42
  margin: 'auto 16px auto auto'
43
43
  });
44
44
  });
45
+ /**
46
+ * Demos:
47
+ *
48
+ * - [DatePicker](https://mui.com/x/react-date-pickers/date-picker/)
49
+ * - [Custom components](https://mui.com/x/react-date-pickers/custom-components/)
50
+ *
51
+ * API:
52
+ *
53
+ * - [DatePickerToolbar API](https://mui.com/x/api/date-pickers/date-picker-toolbar/)
54
+ */
45
55
  var DatePickerToolbar = /*#__PURE__*/React.forwardRef(function DatePickerToolbar(inProps, ref) {
46
56
  var props = useThemeProps({
47
57
  props: inProps,
@@ -111,7 +111,7 @@ process.env.NODE_ENV !== "production" ? DateTimeField.propTypes = {
111
111
  /**
112
112
  * The color of the component.
113
113
  * It supports both default and custom theme colors, which can be added as shown in the
114
- * [palette customization guide](https://mui.com/material-ui/customization/palette/#adding-new-colors).
114
+ * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
115
115
  * @default 'primary'
116
116
  */
117
117
  color: PropTypes.oneOf(['error', 'info', 'primary', 'secondary', 'success', 'warning']),
@@ -48,6 +48,17 @@ var DateTimePickerTabsRoot = styled(Tabs, {
48
48
  })
49
49
  };
50
50
  });
51
+
52
+ /**
53
+ * Demos:
54
+ *
55
+ * - [DateTimePicker](https://mui.com/x/react-date-pickers/date-time-picker/)
56
+ * - [Custom slots and subcomponents](https://mui.com/x/react-date-pickers/custom-components/)
57
+ *
58
+ * API:
59
+ *
60
+ * - [DateTimePickerTabs API](https://mui.com/x/api/date-pickers/date-time-picker-tabs/)
61
+ */
51
62
  var DateTimePickerTabs = function DateTimePickerTabs(inProps) {
52
63
  var props = useThemeProps({
53
64
  props: inProps,
@@ -161,6 +161,17 @@ var DateTimePickerToolbarAmPmSelection = styled('div', {
161
161
  fontSize: 17
162
162
  }));
163
163
  });
164
+
165
+ /**
166
+ * Demos:
167
+ *
168
+ * - [DateTimePicker](https://mui.com/x/react-date-pickers/date-time-picker/)
169
+ * - [Custom components](https://mui.com/x/react-date-pickers/custom-components/)
170
+ *
171
+ * API:
172
+ *
173
+ * - [DateTimePickerToolbar API](https://mui.com/x/api/date-pickers/date-time-picker-toolbar/)
174
+ */
164
175
  function DateTimePickerToolbar(inProps) {
165
176
  var props = useThemeProps({
166
177
  props: inProps,
@@ -65,10 +65,9 @@ DayCalendarSkeletonDay.propTypes = {
65
65
  var monthMap = [[0, 1, 1, 1, 1, 1, 1], [1, 1, 1, 1, 1, 1, 1], [1, 1, 1, 1, 1, 1, 1], [1, 1, 1, 1, 1, 1, 1], [1, 1, 1, 1, 0, 0, 0]];
66
66
 
67
67
  /**
68
- *
69
68
  * Demos:
70
69
  *
71
- * - [Date Picker](https://mui.com/x/react-date-pickers/date-picker/)
70
+ * - [DateCalendar](https://mui.com/x/react-date-pickers/date-calendar/)
72
71
  *
73
72
  * API:
74
73
  *
@@ -12,6 +12,16 @@ import { DateField } from '../DateField';
12
12
  import { extractValidationProps } from '../internals/utils/validation/extractValidationProps';
13
13
  import { renderDateViewCalendar } from '../dateViewRenderers';
14
14
  import { resolveDateFormat } from '../internals/utils/date-utils';
15
+ /**
16
+ * Demos:
17
+ *
18
+ * - [DatePicker](https://mui.com/x/react-date-pickers/date-picker/)
19
+ * - [Validation](https://mui.com/x/react-date-pickers/validation/)
20
+ *
21
+ * API:
22
+ *
23
+ * - [DesktopDatePicker API](https://mui.com/x/api/date-pickers/desktop-date-picker/)
24
+ */
15
25
  var DesktopDatePicker = /*#__PURE__*/React.forwardRef(function DesktopDatePicker(inProps, ref) {
16
26
  var _defaultizedProps$yea, _defaultizedProps$slo2, _props$localeText$ope, _props$localeText;
17
27
  var localeText = useLocaleText();
@@ -86,6 +86,16 @@ var DigitalClockItem = styled(MenuItem, {
86
86
  }
87
87
  };
88
88
  });
89
+ /**
90
+ * Demos:
91
+ *
92
+ * - [TimePicker](https://mui.com/x/react-date-pickers/time-picker/)
93
+ * - [DigitalClock](https://mui.com/x/react-date-pickers/digital-clock/)
94
+ *
95
+ * API:
96
+ *
97
+ * - [DigitalClock API](https://mui.com/x/api/date-pickers/digital-clock/)
98
+ */
89
99
  export var DigitalClock = /*#__PURE__*/React.forwardRef(function DigitalClock(inProps, ref) {
90
100
  var _ref3, _slots$digitalClockIt, _slotProps$digitalClo;
91
101
  var utils = useUtils();
@@ -9,6 +9,18 @@ export var MuiPickersAdapterContext = /*#__PURE__*/React.createContext(null);
9
9
  if (process.env.NODE_ENV !== 'production') {
10
10
  MuiPickersAdapterContext.displayName = 'MuiPickersAdapterContext';
11
11
  }
12
+ /**
13
+ * Demos:
14
+ *
15
+ * - [Date format and localization](https://mui.com/x/react-date-pickers/adapters-locale/)
16
+ * - [Calendar systems](https://mui.com/x/react-date-pickers/calendar-systems/)
17
+ * - [Translated components](https://mui.com/x/react-date-pickers/localization/)
18
+ * - [UTC and timezones](https://mui.com/x/react-date-pickers/timezone/)
19
+ *
20
+ * API:
21
+ *
22
+ * - [LocalizationProvider API](https://mui.com/x/api/date-pickers/localization-provider/)
23
+ */
12
24
  export var LocalizationProvider = function LocalizationProvider(inProps) {
13
25
  var _React$useContext;
14
26
  var inLocaleText = inProps.localeText,
@@ -11,6 +11,16 @@ import { extractValidationProps } from '../internals/utils/validation/extractVal
11
11
  import { singleItemValueManager } from '../internals/utils/valueManagers';
12
12
  import { renderDateViewCalendar } from '../dateViewRenderers';
13
13
  import { resolveDateFormat } from '../internals/utils/date-utils';
14
+ /**
15
+ * Demos:
16
+ *
17
+ * - [DatePicker](https://mui.com/x/react-date-pickers/date-picker/)
18
+ * - [Validation](https://mui.com/x/react-date-pickers/validation/)
19
+ *
20
+ * API:
21
+ *
22
+ * - [MobileDatePicker API](https://mui.com/x/api/date-pickers/mobile-date-picker/)
23
+ */
14
24
  var MobileDatePicker = /*#__PURE__*/React.forwardRef(function MobileDatePicker(inProps, ref) {
15
25
  var _defaultizedProps$slo2, _props$localeText$ope, _props$localeText;
16
26
  var localeText = useLocaleText();
@@ -45,6 +45,16 @@ var MultiSectionDigitalClockRoot = styled(PickerViewRoot, {
45
45
  borderBottom: "1px solid ".concat((theme.vars || theme).palette.divider)
46
46
  };
47
47
  });
48
+ /**
49
+ * Demos:
50
+ *
51
+ * - [TimePicker](https://mui.com/x/react-date-pickers/time-picker/)
52
+ * - [DigitalClock](https://mui.com/x/react-date-pickers/digital-clock/)
53
+ *
54
+ * API:
55
+ *
56
+ * - [MultiSectionDigitalClock API](https://mui.com/x/api/date-pickers/multi-section-digital-clock/)
57
+ */
48
58
  export var MultiSectionDigitalClock = /*#__PURE__*/React.forwardRef(function MultiSectionDigitalClock(inProps, ref) {
49
59
  var utils = useUtils();
50
60
  var props = useThemeProps({
@@ -7,6 +7,16 @@ import Button from '@mui/material/Button';
7
7
  import DialogActions from '@mui/material/DialogActions';
8
8
  import { useLocaleText } from '../internals/hooks/useUtils';
9
9
  import { jsx as _jsx } from "react/jsx-runtime";
10
+ /**
11
+ * Demos:
12
+ *
13
+ * - [Custom slots and subcomponents](https://mui.com/x/react-date-pickers/custom-components/)
14
+ * - [Custom layout](https://mui.com/x/react-date-pickers/custom-layout/)
15
+ *
16
+ * API:
17
+ *
18
+ * - [PickersActionBar API](https://mui.com/x/api/date-pickers/pickers-action-bar/)
19
+ */
10
20
  function PickersActionBar(props) {
11
21
  var onAccept = props.onAccept,
12
22
  onClear = props.onClear,
@@ -104,6 +104,17 @@ var PickersCalendarHeaderSwitchViewIcon = styled(ArrowDropDownIcon, {
104
104
  transform: 'rotate(0deg)'
105
105
  };
106
106
  });
107
+ /**
108
+ * Demos:
109
+ *
110
+ * - [DateCalendar](https://mui.com/x/react-date-pickers/date-calendar/)
111
+ * - [DateRangeCalendar](https://mui.com/x/react-date-pickers/date-range-calendar/)
112
+ * - [Custom slots and subcomponents](https://mui.com/x/react-date-pickers/custom-components/)
113
+ *
114
+ * API:
115
+ *
116
+ * - [PickersCalendarHeader API](https://mui.com/x/api/date-pickers/pickers-calendar-header/)
117
+ */
107
118
  var PickersCalendarHeader = /*#__PURE__*/React.forwardRef(function PickersCalendarHeader(inProps, ref) {
108
119
  var _slots$switchViewButt, _slots$switchViewIcon;
109
120
  var localeText = useLocaleText();
@@ -358,11 +358,9 @@ process.env.NODE_ENV !== "production" ? PickersDayRaw.propTypes = {
358
358
  } : void 0;
359
359
 
360
360
  /**
361
- *
362
361
  * Demos:
363
362
  *
364
- * - [Date Picker](https://mui.com/x/react-date-pickers/date-picker/)
365
- *
363
+ * - [DateCalendar](https://mui.com/x/react-date-pickers/date-calendar/)
366
364
  * API:
367
365
  *
368
366
  * - [PickersDay API](https://mui.com/x/api/date-pickers/pickers-day/)
@@ -72,6 +72,16 @@ export var PickersLayoutContentWrapper = styled('div', {
72
72
  display: 'flex',
73
73
  flexDirection: 'column'
74
74
  });
75
+
76
+ /**
77
+ * Demos:
78
+ *
79
+ * - [Custom layout](https://mui.com/x/react-date-pickers/custom-layout/)
80
+ *
81
+ * API:
82
+ *
83
+ * - [PickersLayout API](https://mui.com/x/api/date-pickers/pickers-layout/)
84
+ */
75
85
  var PickersLayout = function PickersLayout(inProps) {
76
86
  var props = useThemeProps({
77
87
  props: inProps,
@@ -10,6 +10,15 @@ import ListItem from '@mui/material/ListItem';
10
10
  import Chip from '@mui/material/Chip';
11
11
  import { VIEW_HEIGHT } from '../internals/constants/dimensions';
12
12
  import { jsx as _jsx } from "react/jsx-runtime";
13
+ /**
14
+ * Demos:
15
+ *
16
+ * - [Shortcuts](https://mui.com/x/react-date-pickers/shortcuts/)
17
+ *
18
+ * API:
19
+ *
20
+ * - [PickersShortcuts API](https://mui.com/x/api/date-pickers/pickers-shortcuts/)
21
+ */
13
22
  function PickersShortcuts(props) {
14
23
  var items = props.items,
15
24
  changeImportance = props.changeImportance,
@@ -6,6 +6,16 @@ import { renderDateViewCalendar } from '../dateViewRenderers';
6
6
  import { useStaticPicker } from '../internals/hooks/useStaticPicker';
7
7
  import { validateDate } from '../internals';
8
8
  import { singleItemValueManager } from '../internals/utils/valueManagers';
9
+ /**
10
+ * Demos:
11
+ *
12
+ * - [DatePicker](https://mui.com/x/react-date-pickers/date-picker/)
13
+ * - [Validation](https://mui.com/x/react-date-pickers/validation/)
14
+ *
15
+ * API:
16
+ *
17
+ * - [StaticDatePicker API](https://mui.com/x/api/date-pickers/static-date-picker/)
18
+ */
9
19
  var StaticDatePicker = /*#__PURE__*/React.forwardRef(function StaticDatePicker(inProps, ref) {
10
20
  var _defaultizedProps$dis, _defaultizedProps$yea, _defaultizedProps$slo;
11
21
  var defaultizedProps = useDatePickerDefaultizedProps(inProps, 'MuiStaticDatePicker');
@@ -54,6 +54,10 @@ var TimeClockArrowSwitcher = styled(PickersArrowSwitcher, {
54
54
  var TIME_CLOCK_DEFAULT_VIEWS = ['hours', 'minutes'];
55
55
 
56
56
  /**
57
+ * Demos:
58
+ *
59
+ * - [TimePicker](https://mui.com/x/react-date-pickers/time-picker/)
60
+ * - [TimeClock](https://mui.com/x/react-date-pickers/time-clock/)
57
61
  *
58
62
  * API:
59
63
  *
@@ -111,7 +111,7 @@ process.env.NODE_ENV !== "production" ? TimeField.propTypes = {
111
111
  /**
112
112
  * The color of the component.
113
113
  * It supports both default and custom theme colors, which can be added as shown in the
114
- * [palette customization guide](https://mui.com/material-ui/customization/palette/#adding-new-colors).
114
+ * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
115
115
  * @default 'primary'
116
116
  */
117
117
  color: PropTypes.oneOf(['error', 'info', 'primary', 'secondary', 'success', 'warning']),
@@ -107,6 +107,17 @@ TimePickerToolbarAmPmSelection.propTypes = {
107
107
  ownerState: PropTypes.object.isRequired,
108
108
  sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])
109
109
  };
110
+
111
+ /**
112
+ * Demos:
113
+ *
114
+ * - [TimePicker](https://mui.com/x/react-date-pickers/time-picker/)
115
+ * - [Custom components](https://mui.com/x/react-date-pickers/custom-components/)
116
+ *
117
+ * API:
118
+ *
119
+ * - [TimePickerToolbar API](https://mui.com/x/api/date-pickers/time-picker-toolbar/)
120
+ */
110
121
  function TimePickerToolbar(inProps) {
111
122
  var props = useThemeProps({
112
123
  props: inProps,
package/legacy/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /**
2
- * @mui/x-date-pickers v6.16.2
2
+ * @mui/x-date-pickers v6.16.3
3
3
  *
4
4
  * @license MIT
5
5
  * This source code is licensed under the MIT license found in the
@@ -1,19 +1,23 @@
1
+ import _extends from "@babel/runtime/helpers/esm/extends";
2
+ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
3
+ var _excluded = ["before", "after"];
1
4
  import * as React from 'react';
2
5
  import Stack from '@mui/material/Stack';
3
6
  import { jsx as _jsx } from "react/jsx-runtime";
4
7
  import { jsxs as _jsxs } from "react/jsx-runtime";
5
- export function FakeTextField(props) {
6
- var sections = props.sections;
8
+ export var FakeTextField = /*#__PURE__*/React.forwardRef(function FakeTextField(props, ref) {
9
+ var elements = props.elements;
7
10
  return /*#__PURE__*/_jsx(Stack, {
8
11
  direction: "row",
9
12
  spacing: 1,
10
- children: sections.map(function (section) {
13
+ ref: ref,
14
+ children: elements.map(function (_ref, elementIndex) {
15
+ var before = _ref.before,
16
+ after = _ref.after,
17
+ otherElementProps = _objectWithoutProperties(_ref, _excluded);
11
18
  return /*#__PURE__*/_jsxs(React.Fragment, {
12
- children: [section.startSeparator, /*#__PURE__*/_jsx("input", {
13
- value: section.value,
14
- onChange: function onChange() {}
15
- }), section.endSeparator]
16
- });
19
+ children: [before, /*#__PURE__*/_jsx("input", _extends({}, otherElementProps)), after]
20
+ }, elementIndex);
17
21
  })
18
22
  });
19
- }
23
+ });