@mui/x-date-pickers 7.0.0-alpha.2 → 7.0.0-alpha.4

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 (242) hide show
  1. package/AdapterDateFns/AdapterDateFns.js +10 -14
  2. package/AdapterDateFnsJalali/AdapterDateFnsJalali.js +12 -16
  3. package/AdapterDayjs/AdapterDayjs.js +11 -8
  4. package/AdapterLuxon/AdapterLuxon.d.ts +28 -28
  5. package/AdapterLuxon/AdapterLuxon.js +29 -17
  6. package/AdapterMoment/AdapterMoment.d.ts +1 -1
  7. package/AdapterMoment/AdapterMoment.js +14 -14
  8. package/AdapterMomentHijri/AdapterMomentHijri.d.ts +0 -1
  9. package/AdapterMomentHijri/AdapterMomentHijri.js +1 -24
  10. package/AdapterMomentJalaali/AdapterMomentJalaali.d.ts +0 -2
  11. package/AdapterMomentJalaali/AdapterMomentJalaali.js +0 -26
  12. package/CHANGELOG.md +364 -0
  13. package/DateCalendar/DateCalendar.js +2 -2
  14. package/DateCalendar/DayCalendar.d.ts +3 -3
  15. package/DateCalendar/useCalendarState.js +0 -1
  16. package/DatePicker/DatePicker.js +2 -2
  17. package/DateTimePicker/DateTimePicker.js +2 -2
  18. package/DesktopDatePicker/DesktopDatePicker.js +2 -2
  19. package/DesktopDateTimePicker/DesktopDateTimePicker.js +2 -2
  20. package/MobileDatePicker/MobileDatePicker.js +2 -2
  21. package/MobileDateTimePicker/MobileDateTimePicker.js +2 -2
  22. package/MonthCalendar/MonthCalendar.js +0 -1
  23. package/MultiSectionDigitalClock/MultiSectionDigitalClock.js +2 -0
  24. package/MultiSectionDigitalClock/MultiSectionDigitalClock.utils.d.ts +3 -2
  25. package/MultiSectionDigitalClock/MultiSectionDigitalClock.utils.js +2 -1
  26. package/MultiSectionDigitalClock/MultiSectionDigitalClockSection.js +8 -2
  27. package/MultiSectionDigitalClock/multiSectionDigitalClockSectionClasses.js +2 -2
  28. package/PickersCalendarHeader/PickersCalendarHeader.js +4 -4
  29. package/PickersShortcuts/PickersShortcuts.d.ts +1 -1
  30. package/PickersShortcuts/PickersShortcuts.js +1 -1
  31. package/README.md +0 -1
  32. package/StaticDatePicker/StaticDatePicker.js +2 -2
  33. package/StaticDateTimePicker/StaticDateTimePicker.js +2 -2
  34. package/TimeClock/Clock.js +0 -1
  35. package/TimeClock/ClockPointer.js +0 -1
  36. package/YearCalendar/YearCalendar.js +0 -1
  37. package/index.js +1 -1
  38. package/internals/components/PickersTextField/Outline.d.ts +8 -0
  39. package/internals/components/PickersTextField/Outline.js +97 -0
  40. package/internals/components/PickersTextField/PickersInput.d.ts +3 -0
  41. package/internals/components/PickersTextField/PickersInput.js +269 -0
  42. package/internals/components/PickersTextField/PickersInput.types.d.ts +45 -0
  43. package/internals/components/PickersTextField/PickersInput.types.js +1 -0
  44. package/internals/components/PickersTextField/PickersTextField.d.ts +3 -0
  45. package/internals/components/PickersTextField/PickersTextField.js +129 -0
  46. package/internals/components/PickersTextField/PickersTextField.types.d.ts +21 -0
  47. package/internals/components/PickersTextField/PickersTextField.types.js +1 -0
  48. package/internals/components/PickersTextField/index.d.ts +1 -0
  49. package/internals/components/PickersTextField/index.js +1 -0
  50. package/internals/components/PickersTextField/pickersTextFieldClasses.d.ts +46 -0
  51. package/internals/components/PickersTextField/pickersTextFieldClasses.js +9 -0
  52. package/internals/constants/dimensions.d.ts +1 -1
  53. package/internals/constants/dimensions.js +1 -1
  54. package/internals/demo/DemoContainer.d.ts +4 -0
  55. package/internals/demo/DemoContainer.js +47 -19
  56. package/internals/hooks/useClockReferenceDate.js +0 -1
  57. package/internals/hooks/useField/useField.utils.js +23 -12
  58. package/internals/hooks/usePicker/usePickerValue.js +2 -6
  59. package/internals/hooks/usePicker/usePickerValue.types.d.ts +2 -2
  60. package/internals/hooks/useViews.js +0 -1
  61. package/legacy/AdapterDateFns/AdapterDateFns.js +10 -14
  62. package/legacy/AdapterDateFnsJalali/AdapterDateFnsJalali.js +12 -16
  63. package/legacy/AdapterDayjs/AdapterDayjs.js +11 -8
  64. package/legacy/AdapterLuxon/AdapterLuxon.js +30 -18
  65. package/legacy/AdapterMoment/AdapterMoment.js +326 -320
  66. package/legacy/AdapterMomentHijri/AdapterMomentHijri.js +4 -25
  67. package/legacy/AdapterMomentJalaali/AdapterMomentJalaali.js +0 -30
  68. package/legacy/DateCalendar/DateCalendar.js +2 -2
  69. package/legacy/DateCalendar/useCalendarState.js +0 -1
  70. package/legacy/DatePicker/DatePicker.js +2 -2
  71. package/legacy/DateTimePicker/DateTimePicker.js +2 -2
  72. package/legacy/DesktopDatePicker/DesktopDatePicker.js +2 -2
  73. package/legacy/DesktopDateTimePicker/DesktopDateTimePicker.js +2 -2
  74. package/legacy/MobileDatePicker/MobileDatePicker.js +2 -2
  75. package/legacy/MobileDateTimePicker/MobileDateTimePicker.js +2 -2
  76. package/legacy/MonthCalendar/MonthCalendar.js +0 -1
  77. package/legacy/MultiSectionDigitalClock/MultiSectionDigitalClock.js +2 -0
  78. package/legacy/MultiSectionDigitalClock/MultiSectionDigitalClock.utils.js +2 -1
  79. package/legacy/MultiSectionDigitalClock/MultiSectionDigitalClockSection.js +8 -2
  80. package/legacy/MultiSectionDigitalClock/multiSectionDigitalClockSectionClasses.js +2 -2
  81. package/legacy/PickersCalendarHeader/PickersCalendarHeader.js +4 -4
  82. package/legacy/PickersShortcuts/PickersShortcuts.js +2 -1
  83. package/legacy/StaticDatePicker/StaticDatePicker.js +2 -2
  84. package/legacy/StaticDateTimePicker/StaticDateTimePicker.js +2 -2
  85. package/legacy/TimeClock/Clock.js +0 -1
  86. package/legacy/TimeClock/ClockPointer.js +0 -1
  87. package/legacy/YearCalendar/YearCalendar.js +0 -1
  88. package/legacy/index.js +1 -1
  89. package/legacy/internals/components/PickersTextField/Outline.js +97 -0
  90. package/legacy/internals/components/PickersTextField/PickersInput.js +277 -0
  91. package/legacy/internals/components/PickersTextField/PickersInput.types.js +1 -0
  92. package/legacy/internals/components/PickersTextField/PickersTextField.js +129 -0
  93. package/legacy/internals/components/PickersTextField/PickersTextField.types.js +1 -0
  94. package/legacy/internals/components/PickersTextField/index.js +1 -0
  95. package/legacy/internals/components/PickersTextField/pickersTextFieldClasses.js +9 -0
  96. package/legacy/internals/constants/dimensions.js +1 -1
  97. package/legacy/internals/demo/DemoContainer.js +45 -19
  98. package/legacy/internals/hooks/useClockReferenceDate.js +0 -1
  99. package/legacy/internals/hooks/useField/useField.utils.js +23 -12
  100. package/legacy/internals/hooks/usePicker/usePickerValue.js +2 -6
  101. package/legacy/internals/hooks/useViews.js +0 -1
  102. package/legacy/locales/plPL.js +0 -1
  103. package/legacy/locales/svSE.js +0 -1
  104. package/legacy/locales/urPK.js +0 -1
  105. package/locales/beBY.d.ts +18 -5
  106. package/locales/caES.d.ts +18 -5
  107. package/locales/csCZ.d.ts +18 -5
  108. package/locales/daDK.d.ts +18 -5
  109. package/locales/deDE.d.ts +18 -5
  110. package/locales/elGR.d.ts +18 -5
  111. package/locales/enUS.d.ts +18 -5
  112. package/locales/esES.d.ts +18 -5
  113. package/locales/eu.d.ts +18 -5
  114. package/locales/faIR.d.ts +18 -5
  115. package/locales/fiFI.d.ts +18 -5
  116. package/locales/frFR.d.ts +18 -5
  117. package/locales/heIL.d.ts +18 -5
  118. package/locales/huHU.d.ts +18 -5
  119. package/locales/isIS.d.ts +18 -5
  120. package/locales/itIT.d.ts +18 -5
  121. package/locales/jaJP.d.ts +18 -5
  122. package/locales/koKR.d.ts +18 -5
  123. package/locales/kzKZ.d.ts +18 -5
  124. package/locales/mk.d.ts +18 -5
  125. package/locales/nbNO.d.ts +18 -5
  126. package/locales/nlNL.d.ts +18 -5
  127. package/locales/plPL.d.ts +18 -5
  128. package/locales/plPL.js +0 -1
  129. package/locales/ptBR.d.ts +18 -5
  130. package/locales/roRO.d.ts +18 -5
  131. package/locales/ruRU.d.ts +18 -5
  132. package/locales/skSK.d.ts +18 -5
  133. package/locales/svSE.d.ts +18 -5
  134. package/locales/svSE.js +0 -1
  135. package/locales/trTR.d.ts +18 -5
  136. package/locales/ukUA.d.ts +18 -5
  137. package/locales/urPK.d.ts +18 -5
  138. package/locales/urPK.js +0 -1
  139. package/locales/utils/getPickersLocalization.d.ts +18 -5
  140. package/locales/utils/pickersLocaleTextApi.d.ts +18 -5
  141. package/locales/viVN.d.ts +18 -5
  142. package/locales/zhCN.d.ts +18 -5
  143. package/locales/zhHK.d.ts +18 -5
  144. package/modern/AdapterDateFns/AdapterDateFns.js +10 -14
  145. package/modern/AdapterDateFnsJalali/AdapterDateFnsJalali.js +12 -16
  146. package/modern/AdapterDayjs/AdapterDayjs.js +11 -8
  147. package/modern/AdapterLuxon/AdapterLuxon.js +28 -17
  148. package/modern/AdapterMoment/AdapterMoment.js +14 -14
  149. package/modern/AdapterMomentHijri/AdapterMomentHijri.js +1 -24
  150. package/modern/AdapterMomentJalaali/AdapterMomentJalaali.js +0 -26
  151. package/modern/DateCalendar/DateCalendar.js +2 -2
  152. package/modern/DateCalendar/useCalendarState.js +0 -1
  153. package/modern/DatePicker/DatePicker.js +2 -2
  154. package/modern/DateTimePicker/DateTimePicker.js +2 -2
  155. package/modern/DesktopDatePicker/DesktopDatePicker.js +2 -2
  156. package/modern/DesktopDateTimePicker/DesktopDateTimePicker.js +2 -2
  157. package/modern/MobileDatePicker/MobileDatePicker.js +2 -2
  158. package/modern/MobileDateTimePicker/MobileDateTimePicker.js +2 -2
  159. package/modern/MonthCalendar/MonthCalendar.js +0 -1
  160. package/modern/MultiSectionDigitalClock/MultiSectionDigitalClock.js +2 -0
  161. package/modern/MultiSectionDigitalClock/MultiSectionDigitalClock.utils.js +2 -1
  162. package/modern/MultiSectionDigitalClock/MultiSectionDigitalClockSection.js +8 -2
  163. package/modern/MultiSectionDigitalClock/multiSectionDigitalClockSectionClasses.js +2 -2
  164. package/modern/PickersCalendarHeader/PickersCalendarHeader.js +4 -4
  165. package/modern/PickersShortcuts/PickersShortcuts.js +1 -1
  166. package/modern/StaticDatePicker/StaticDatePicker.js +2 -2
  167. package/modern/StaticDateTimePicker/StaticDateTimePicker.js +2 -2
  168. package/modern/TimeClock/Clock.js +0 -1
  169. package/modern/TimeClock/ClockPointer.js +0 -1
  170. package/modern/YearCalendar/YearCalendar.js +0 -1
  171. package/modern/index.js +1 -1
  172. package/modern/internals/components/PickersTextField/Outline.js +97 -0
  173. package/modern/internals/components/PickersTextField/PickersInput.js +268 -0
  174. package/modern/internals/components/PickersTextField/PickersInput.types.js +1 -0
  175. package/modern/internals/components/PickersTextField/PickersTextField.js +129 -0
  176. package/modern/internals/components/PickersTextField/PickersTextField.types.js +1 -0
  177. package/modern/internals/components/PickersTextField/index.js +1 -0
  178. package/modern/internals/components/PickersTextField/pickersTextFieldClasses.js +9 -0
  179. package/modern/internals/constants/dimensions.js +1 -1
  180. package/modern/internals/demo/DemoContainer.js +47 -19
  181. package/modern/internals/hooks/useClockReferenceDate.js +0 -1
  182. package/modern/internals/hooks/useField/useField.utils.js +23 -12
  183. package/modern/internals/hooks/usePicker/usePickerValue.js +2 -6
  184. package/modern/internals/hooks/useViews.js +0 -1
  185. package/modern/locales/plPL.js +0 -1
  186. package/modern/locales/svSE.js +0 -1
  187. package/modern/locales/urPK.js +0 -1
  188. package/node/AdapterDateFns/AdapterDateFns.js +10 -14
  189. package/node/AdapterDateFnsJalali/AdapterDateFnsJalali.js +12 -16
  190. package/node/AdapterDayjs/AdapterDayjs.js +10 -7
  191. package/node/AdapterLuxon/AdapterLuxon.js +28 -17
  192. package/node/AdapterMoment/AdapterMoment.js +14 -14
  193. package/node/AdapterMomentHijri/AdapterMomentHijri.js +1 -24
  194. package/node/AdapterMomentJalaali/AdapterMomentJalaali.js +0 -26
  195. package/node/DateCalendar/DateCalendar.js +2 -2
  196. package/node/DateCalendar/useCalendarState.js +0 -1
  197. package/node/DatePicker/DatePicker.js +2 -2
  198. package/node/DateTimePicker/DateTimePicker.js +2 -2
  199. package/node/DesktopDatePicker/DesktopDatePicker.js +2 -2
  200. package/node/DesktopDateTimePicker/DesktopDateTimePicker.js +2 -2
  201. package/node/MobileDatePicker/MobileDatePicker.js +2 -2
  202. package/node/MobileDateTimePicker/MobileDateTimePicker.js +2 -2
  203. package/node/MonthCalendar/MonthCalendar.js +0 -1
  204. package/node/MultiSectionDigitalClock/MultiSectionDigitalClock.js +2 -0
  205. package/node/MultiSectionDigitalClock/MultiSectionDigitalClock.utils.js +2 -1
  206. package/node/MultiSectionDigitalClock/MultiSectionDigitalClockSection.js +8 -2
  207. package/node/MultiSectionDigitalClock/multiSectionDigitalClockSectionClasses.js +2 -2
  208. package/node/PickersCalendarHeader/PickersCalendarHeader.js +4 -4
  209. package/node/PickersShortcuts/PickersShortcuts.js +1 -1
  210. package/node/StaticDatePicker/StaticDatePicker.js +2 -2
  211. package/node/StaticDateTimePicker/StaticDateTimePicker.js +2 -2
  212. package/node/TimeClock/Clock.js +0 -1
  213. package/node/TimeClock/ClockPointer.js +0 -1
  214. package/node/YearCalendar/YearCalendar.js +0 -1
  215. package/node/index.js +1 -1
  216. package/node/internals/components/PickersTextField/Outline.js +106 -0
  217. package/node/internals/components/PickersTextField/PickersInput.js +276 -0
  218. package/node/internals/components/PickersTextField/PickersInput.types.js +5 -0
  219. package/node/internals/components/PickersTextField/PickersTextField.js +137 -0
  220. package/node/internals/components/PickersTextField/PickersTextField.types.js +5 -0
  221. package/node/internals/components/PickersTextField/index.js +12 -0
  222. package/node/internals/components/PickersTextField/pickersTextFieldClasses.js +17 -0
  223. package/node/internals/constants/dimensions.js +1 -1
  224. package/node/internals/demo/DemoContainer.js +47 -19
  225. package/node/internals/hooks/useClockReferenceDate.js +0 -1
  226. package/node/internals/hooks/useField/useField.utils.js +23 -12
  227. package/node/internals/hooks/usePicker/usePickerValue.js +2 -6
  228. package/node/internals/hooks/useViews.js +0 -1
  229. package/node/locales/plPL.js +0 -1
  230. package/node/locales/svSE.js +0 -1
  231. package/node/locales/urPK.js +0 -1
  232. package/package.json +5 -5
  233. package/internals/components/FakeTextField/FakeTextField.d.ts +0 -22
  234. package/internals/components/FakeTextField/FakeTextField.js +0 -44
  235. package/internals/components/FakeTextField/index.d.ts +0 -1
  236. package/internals/components/FakeTextField/index.js +0 -1
  237. package/legacy/internals/components/FakeTextField/FakeTextField.js +0 -49
  238. package/legacy/internals/components/FakeTextField/index.js +0 -1
  239. package/modern/internals/components/FakeTextField/FakeTextField.js +0 -44
  240. package/modern/internals/components/FakeTextField/index.js +0 -1
  241. package/node/internals/components/FakeTextField/FakeTextField.js +0 -52
  242. package/node/internals/components/FakeTextField/index.js +0 -12
@@ -0,0 +1,9 @@
1
+ import { unstable_generateUtilityClass as generateUtilityClass, unstable_generateUtilityClasses as generateUtilityClasses } from '@mui/utils';
2
+ export function getPickersTextFieldUtilityClass(slot) {
3
+ return generateUtilityClass('MuiPickersTextField', slot);
4
+ }
5
+ export const pickersTextFieldClasses = generateUtilityClasses('MuiPickersTextField', ['root', 'focused', 'disabled', 'error', 'required']);
6
+ export function getPickersInputUtilityClass(slot) {
7
+ return generateUtilityClass('MuiPickersInput', slot);
8
+ }
9
+ export const pickersInputClasses = generateUtilityClasses('MuiPickersInput', ['root', 'focused', 'disabled', 'error', 'notchedOutline', 'adornedStart', 'adornedEnd', 'input', 'sectionsContainer', 'sectionContent', 'sectionBefore', 'sectionAfter']);
@@ -2,6 +2,6 @@ export const DAY_SIZE = 36;
2
2
  export const DAY_MARGIN = 2;
3
3
  export const DIALOG_WIDTH = 320;
4
4
  export const MAX_CALENDAR_HEIGHT = 280;
5
- export const VIEW_HEIGHT = 334;
5
+ export const VIEW_HEIGHT = 336;
6
6
  export const DIGITAL_CLOCK_VIEW_HEIGHT = 232;
7
7
  export const MULTI_SECTION_CLOCK_SECTION_WIDTH = 48;
@@ -1,6 +1,6 @@
1
1
  import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import * as React from 'react';
3
- import Stack from '@mui/material/Stack';
3
+ import Stack, { stackClasses } from '@mui/material/Stack';
4
4
  import Typography from '@mui/material/Typography';
5
5
  import { textFieldClasses } from '@mui/material/TextField';
6
6
  import { jsx as _jsx } from "react/jsx-runtime";
@@ -40,20 +40,20 @@ export function DemoItem(props) {
40
40
  const {
41
41
  label,
42
42
  children,
43
- component
43
+ component,
44
+ sx: sxProp
44
45
  } = props;
45
46
  let spacing;
46
- let sx;
47
+ let sx = sxProp;
47
48
  if (component && getChildTypeFromChildName(component) === 'multi-input-range-field') {
48
49
  spacing = 1.5;
49
- sx = {
50
+ sx = _extends({}, sx, {
50
51
  [`& .${textFieldClasses.root}`]: {
51
52
  flexGrow: 1
52
53
  }
53
- };
54
+ });
54
55
  } else {
55
56
  spacing = 1;
56
- sx = undefined;
57
57
  }
58
58
  return /*#__PURE__*/_jsxs(Stack, {
59
59
  direction: "column",
@@ -66,7 +66,14 @@ export function DemoItem(props) {
66
66
  }), children]
67
67
  });
68
68
  }
69
-
69
+ DemoItem.displayName = 'DemoItem';
70
+ const isDemoItem = child => {
71
+ if ( /*#__PURE__*/React.isValidElement(child) && typeof child.type !== 'string') {
72
+ // @ts-ignore
73
+ return child.type.displayName === 'DemoItem';
74
+ }
75
+ return false;
76
+ };
70
77
  /**
71
78
  * WARNING: This is an internal component used in documentation to achieve a desired layout.
72
79
  * Please do not use it in your application.
@@ -91,7 +98,9 @@ export function DemoContainer(props) {
91
98
  };
92
99
  let direction;
93
100
  let spacing;
94
- let sx = _extends({
101
+ let extraSx = {};
102
+ let demoItemSx = {};
103
+ const sx = _extends({
95
104
  overflow: 'auto',
96
105
  // Add padding as overflow can hide the outline text field label.
97
106
  pt: 1
@@ -113,38 +122,57 @@ export function DemoContainer(props) {
113
122
  // noop
114
123
  } else if (childrenTypes.has('single-input-range-field')) {
115
124
  if (!childrenSupportedSections.has('date-time')) {
116
- sx = _extends({}, sx, {
125
+ extraSx = {
117
126
  [`& > .${textFieldClasses.root}`]: {
118
127
  minWidth: 300
119
128
  }
120
- });
129
+ };
121
130
  } else {
122
- sx = _extends({}, sx, {
131
+ extraSx = {
123
132
  [`& > .${textFieldClasses.root}`]: {
124
133
  minWidth: {
125
134
  xs: 300,
126
- md: 400
135
+ // If demo also contains MultiInputDateTimeRangeField, increase width to avoid cutting off the value.
136
+ md: childrenTypes.has('multi-input-range-field') ? 460 : 400
127
137
  }
128
138
  }
129
- });
139
+ };
130
140
  }
131
141
  } else if (childrenSupportedSections.has('date-time')) {
132
- sx = _extends({}, sx, {
142
+ extraSx = {
133
143
  [`& > .${textFieldClasses.root}`]: {
134
144
  minWidth: 270
135
145
  }
136
- });
146
+ };
147
+ if (childrenTypes.has('multi-input-range-field')) {
148
+ // increase width for the multi input date time range fields
149
+ demoItemSx = {
150
+ [`& > .${stackClasses.root} > .${textFieldClasses.root}`]: {
151
+ minWidth: 210
152
+ }
153
+ };
154
+ }
137
155
  } else {
138
- sx = _extends({}, sx, {
156
+ extraSx = {
139
157
  [`& > .${textFieldClasses.root}`]: {
140
158
  minWidth: 200
141
159
  }
142
- });
160
+ };
143
161
  }
162
+ const finalSx = _extends({}, sx, extraSx);
144
163
  return /*#__PURE__*/_jsx(Stack, {
145
164
  direction: direction,
146
165
  spacing: spacing,
147
- sx: sx,
148
- children: children
166
+ sx: finalSx,
167
+ children: React.Children.map(children, child => {
168
+ if ( /*#__PURE__*/React.isValidElement(child) && isDemoItem(child)) {
169
+ // Inject sx styles to the `DemoItem` if it is a direct child of `DemoContainer`.
170
+ // @ts-ignore
171
+ return /*#__PURE__*/React.cloneElement(child, {
172
+ sx: _extends({}, extraSx, demoItemSx)
173
+ });
174
+ }
175
+ return child;
176
+ })
149
177
  });
150
178
  }
@@ -21,6 +21,5 @@ export const useClockReferenceDate = ({
21
21
  // We only want to compute the reference date on mount.
22
22
  [] // eslint-disable-line react-hooks/exhaustive-deps
23
23
  );
24
-
25
24
  return value ?? referenceDate;
26
25
  };
@@ -125,7 +125,6 @@ export const adjustSectionValue = (utils, timezone, section, keyCode, sectionsVa
125
125
  if (delta < 0 || isStart) {
126
126
  newSectionValueNumber += step - (step + newSectionValueNumber) % step; // for JS -3 % 5 = -3 (should be 2)
127
127
  }
128
-
129
128
  if (delta > 0 || isEnd) {
130
129
  newSectionValueNumber -= newSectionValueNumber % step;
131
130
  }
@@ -207,49 +206,62 @@ export const addPositionPropertiesToSections = (sections, isRTL) => {
207
206
  }
208
207
  return newSections;
209
208
  };
210
- const getSectionPlaceholder = (utils, timezone, localeText, sectionConfig, currentTokenValue) => {
209
+ const getSectionPlaceholder = (utils, timezone, localeText, sectionConfig, sectionFormat) => {
211
210
  switch (sectionConfig.type) {
212
211
  case 'year':
213
212
  {
214
213
  return localeText.fieldYearPlaceholder({
215
- digitAmount: utils.formatByString(utils.date(undefined, timezone), currentTokenValue).length
214
+ digitAmount: utils.formatByString(utils.date(undefined, timezone), sectionFormat).length,
215
+ format: sectionFormat
216
216
  });
217
217
  }
218
218
  case 'month':
219
219
  {
220
220
  return localeText.fieldMonthPlaceholder({
221
- contentType: sectionConfig.contentType
221
+ contentType: sectionConfig.contentType,
222
+ format: sectionFormat
222
223
  });
223
224
  }
224
225
  case 'day':
225
226
  {
226
- return localeText.fieldDayPlaceholder();
227
+ return localeText.fieldDayPlaceholder({
228
+ format: sectionFormat
229
+ });
227
230
  }
228
231
  case 'weekDay':
229
232
  {
230
233
  return localeText.fieldWeekDayPlaceholder({
231
- contentType: sectionConfig.contentType
234
+ contentType: sectionConfig.contentType,
235
+ format: sectionFormat
232
236
  });
233
237
  }
234
238
  case 'hours':
235
239
  {
236
- return localeText.fieldHoursPlaceholder();
240
+ return localeText.fieldHoursPlaceholder({
241
+ format: sectionFormat
242
+ });
237
243
  }
238
244
  case 'minutes':
239
245
  {
240
- return localeText.fieldMinutesPlaceholder();
246
+ return localeText.fieldMinutesPlaceholder({
247
+ format: sectionFormat
248
+ });
241
249
  }
242
250
  case 'seconds':
243
251
  {
244
- return localeText.fieldSecondsPlaceholder();
252
+ return localeText.fieldSecondsPlaceholder({
253
+ format: sectionFormat
254
+ });
245
255
  }
246
256
  case 'meridiem':
247
257
  {
248
- return localeText.fieldMeridiemPlaceholder();
258
+ return localeText.fieldMeridiemPlaceholder({
259
+ format: sectionFormat
260
+ });
249
261
  }
250
262
  default:
251
263
  {
252
- return currentTokenValue;
264
+ return sectionFormat;
253
265
  }
254
266
  }
255
267
  };
@@ -387,7 +399,6 @@ export const splitFormatIntoSections = (utils, timezone, localeText, format, dat
387
399
  const isTokenStartRegExp = new RegExp(`^(${Object.keys(utils.formatTokenMap).sort((a, b) => b.length - a.length) // Sort to put longest word first
388
400
  .join('|')})`, 'g') // used to get access to lastIndex state
389
401
  ;
390
-
391
402
  let currentTokenValue = '';
392
403
  for (let i = 0; i < expandedFormat.length; i += 1) {
393
404
  const escapedPartOfCurrentChar = escapedParts.find(escapeIndex => escapeIndex.start <= i && escapeIndex.end >= i);
@@ -221,9 +221,7 @@ export const usePickerValue = ({
221
221
  const context = {
222
222
  validationError
223
223
  };
224
-
225
- // TODO v7: Remove 2nd condition
226
- if (action.name === 'setValueFromShortcut' && action.shortcut != null) {
224
+ if (action.name === 'setValueFromShortcut') {
227
225
  context.shortcut = action.shortcut;
228
226
  }
229
227
  handleValueChange(action.value, context);
@@ -288,12 +286,10 @@ export const usePickerValue = ({
288
286
  value: newValue,
289
287
  selectionState
290
288
  }));
291
-
292
- // TODO v7: Make changeImportance and label mandatory.
293
289
  const handleSelectShortcut = useEventCallback((newValue, changeImportance, shortcut) => updateDate({
294
290
  name: 'setValueFromShortcut',
295
291
  value: newValue,
296
- changeImportance: changeImportance ?? 'accept',
292
+ changeImportance,
297
293
  shortcut
298
294
  }));
299
295
  const handleChangeFromField = useEventCallback((newValue, context) => updateDate({
@@ -60,7 +60,6 @@ export function useViews({
60
60
  setFocusedView(prevFocusedView => viewToFocus === prevFocusedView ? null : prevFocusedView // If false the blur is due to view switching
61
61
  );
62
62
  }
63
-
64
63
  onFocusedViewChange?.(viewToFocus, hasFocus);
65
64
  });
66
65
  const handleChangeView = useEventCallback(newView => {
@@ -57,5 +57,4 @@ const plPLPickers = {
57
57
  // fieldSecondsPlaceholder: () => 'ss',
58
58
  // fieldMeridiemPlaceholder: () => 'aa',
59
59
  };
60
-
61
60
  export const plPL = getPickersLocalization(plPLPickers);
@@ -57,5 +57,4 @@ const svSEPickers = {
57
57
  // fieldSecondsPlaceholder: () => 'ss',
58
58
  // fieldMeridiemPlaceholder: () => 'aa',
59
59
  };
60
-
61
60
  export const svSE = getPickersLocalization(svSEPickers);
@@ -57,5 +57,4 @@ const urPKPickers = {
57
57
  // fieldSecondsPlaceholder: () => 'ss',
58
58
  // fieldMeridiemPlaceholder: () => 'aa',
59
59
  };
60
-
61
60
  export const urPK = getPickersLocalization(urPKPickers);
@@ -389,10 +389,10 @@ class AdapterDateFns {
389
389
  return (0, _isBefore.default)(value, comparing);
390
390
  };
391
391
  this.isBeforeYear = (value, comparing) => {
392
- return (0, _isBefore.default)(value, (0, _startOfYear.default)(comparing));
392
+ return (0, _isBefore.default)(value, this.startOfYear(comparing));
393
393
  };
394
394
  this.isBeforeDay = (value, comparing) => {
395
- return (0, _isBefore.default)(value, (0, _startOfDay.default)(comparing));
395
+ return (0, _isBefore.default)(value, this.startOfDay(comparing));
396
396
  };
397
397
  this.isWithinRange = (value, [start, end]) => {
398
398
  return (0, _isWithinInterval.default)(value, {
@@ -495,20 +495,16 @@ class AdapterDateFns {
495
495
  return (0, _getDaysInMonth.default)(value);
496
496
  };
497
497
  this.getWeekArray = value => {
498
- const start = (0, _startOfWeek.default)((0, _startOfMonth.default)(value), {
499
- locale: this.locale
500
- });
501
- const end = (0, _endOfWeek.default)((0, _endOfMonth.default)(value), {
502
- locale: this.locale
503
- });
498
+ const start = this.startOfWeek(this.startOfMonth(value));
499
+ const end = this.endOfWeek(this.endOfMonth(value));
504
500
  let count = 0;
505
501
  let current = start;
506
502
  const nestedWeeks = [];
507
- while ((0, _isBefore.default)(current, end)) {
503
+ while (this.isBefore(current, end)) {
508
504
  const weekNumber = Math.floor(count / 7);
509
505
  nestedWeeks[weekNumber] = nestedWeeks[weekNumber] || [];
510
506
  nestedWeeks[weekNumber].push(current);
511
- current = (0, _addDays.default)(current, 1);
507
+ current = this.addDays(current, 1);
512
508
  count += 1;
513
509
  }
514
510
  return nestedWeeks;
@@ -519,13 +515,13 @@ class AdapterDateFns {
519
515
  });
520
516
  };
521
517
  this.getYearRange = ([start, end]) => {
522
- const startDate = (0, _startOfYear.default)(start);
523
- const endDate = (0, _endOfYear.default)(end);
518
+ const startDate = this.startOfYear(start);
519
+ const endDate = this.endOfYear(end);
524
520
  const years = [];
525
521
  let current = startDate;
526
- while ((0, _isBefore.default)(current, endDate)) {
522
+ while (this.isBefore(current, endDate)) {
527
523
  years.push(current);
528
- current = (0, _addYears.default)(current, 1);
524
+ current = this.addYears(current, 1);
529
525
  }
530
526
  return years;
531
527
  };
@@ -391,19 +391,19 @@ class AdapterDateFnsJalali {
391
391
  return (0, _isAfter.default)(value, comparing);
392
392
  };
393
393
  this.isAfterYear = (value, comparing) => {
394
- return (0, _isAfter.default)(value, (0, _endOfYear.default)(comparing));
394
+ return (0, _isAfter.default)(value, this.endOfYear(comparing));
395
395
  };
396
396
  this.isAfterDay = (value, comparing) => {
397
- return (0, _isAfter.default)(value, (0, _endOfDay.default)(comparing));
397
+ return (0, _isAfter.default)(value, this.endOfDay(comparing));
398
398
  };
399
399
  this.isBefore = (value, comparing) => {
400
400
  return (0, _isBefore.default)(value, comparing);
401
401
  };
402
402
  this.isBeforeYear = (value, comparing) => {
403
- return (0, _isBefore.default)(value, (0, _startOfYear.default)(comparing));
403
+ return (0, _isBefore.default)(value, this.startOfYear(comparing));
404
404
  };
405
405
  this.isBeforeDay = (value, comparing) => {
406
- return (0, _isBefore.default)(value, (0, _startOfDay.default)(comparing));
406
+ return (0, _isBefore.default)(value, this.startOfDay(comparing));
407
407
  };
408
408
  this.isWithinRange = (value, [start, end]) => {
409
409
  return (0, _isWithinInterval.default)(value, {
@@ -506,20 +506,16 @@ class AdapterDateFnsJalali {
506
506
  return (0, _getDaysInMonth.default)(value);
507
507
  };
508
508
  this.getWeekArray = value => {
509
- const start = (0, _startOfWeek.default)((0, _startOfMonth.default)(value), {
510
- locale: this.locale
511
- });
512
- const end = (0, _endOfWeek.default)((0, _endOfMonth.default)(value), {
513
- locale: this.locale
514
- });
509
+ const start = this.startOfWeek(this.startOfMonth(value));
510
+ const end = this.endOfWeek(this.endOfMonth(value));
515
511
  let count = 0;
516
512
  let current = start;
517
513
  const nestedWeeks = [];
518
- while ((0, _isBefore.default)(current, end)) {
514
+ while (this.isBefore(current, end)) {
519
515
  const weekNumber = Math.floor(count / 7);
520
516
  nestedWeeks[weekNumber] = nestedWeeks[weekNumber] || [];
521
517
  nestedWeeks[weekNumber].push(current);
522
- current = (0, _addDays.default)(current, 1);
518
+ current = this.addDays(current, 1);
523
519
  count += 1;
524
520
  }
525
521
  return nestedWeeks;
@@ -530,13 +526,13 @@ class AdapterDateFnsJalali {
530
526
  });
531
527
  };
532
528
  this.getYearRange = ([start, end]) => {
533
- const startDate = (0, _startOfYear.default)(start);
534
- const endDate = (0, _endOfYear.default)(end);
529
+ const startDate = this.startOfYear(start);
530
+ const endDate = this.endOfYear(end);
535
531
  const years = [];
536
532
  let current = startDate;
537
- while ((0, _isBefore.default)(current, endDate)) {
533
+ while (this.isBefore(current, endDate)) {
538
534
  years.push(current);
539
- current = (0, _addYears.default)(current, 1);
535
+ current = this.addYears(current, 1);
540
536
  }
541
537
  return years;
542
538
  };
@@ -14,8 +14,8 @@ var _isBetween = _interopRequireDefault(require("dayjs/plugin/isBetween"));
14
14
  var _warning = require("../internals/utils/warning");
15
15
  /* eslint-disable class-methods-use-this */
16
16
 
17
- _dayjs.default.extend(_customParseFormat.default);
18
17
  _dayjs.default.extend(_localizedFormat.default);
18
+ _dayjs.default.extend(_weekOfYear.default);
19
19
  _dayjs.default.extend(_isBetween.default);
20
20
  const localeNotFoundWarning = (0, _warning.buildWarning)(['Your locale has not been found.', 'Either the locale key is not a supported one. Locales supported by dayjs are available here: https://github.com/iamkun/dayjs/tree/dev/src/locale', "Or you forget to import the locale from 'dayjs/locale/{localeUsed}'", 'fallback on English locale']);
21
21
  const formatTokenMap = {
@@ -512,8 +512,8 @@ class AdapterDayjs {
512
512
  };
513
513
  this.getWeekArray = value => {
514
514
  const cleanValue = this.setLocaleToValue(value);
515
- const start = cleanValue.startOf('month').startOf('week');
516
- const end = cleanValue.endOf('month').endOf('week');
515
+ const start = this.startOfWeek(this.startOfMonth(cleanValue));
516
+ const end = this.endOfWeek(this.endOfMonth(cleanValue));
517
517
  let count = 0;
518
518
  let current = start;
519
519
  const nestedWeeks = [];
@@ -530,11 +530,11 @@ class AdapterDayjs {
530
530
  return value.week();
531
531
  };
532
532
  this.getYearRange = ([start, end]) => {
533
- const startDate = start.startOf('year');
534
- const endDate = end.endOf('year');
533
+ const startDate = this.startOfYear(start);
534
+ const endDate = this.endOfYear(end);
535
535
  const years = [];
536
536
  let current = startDate;
537
- while (current < endDate) {
537
+ while (this.isBefore(current, endDate)) {
538
538
  years.push(current);
539
539
  current = this.addYears(current, 1);
540
540
  }
@@ -543,7 +543,10 @@ class AdapterDayjs {
543
543
  this.dayjs = withLocale(_dayjs.default, _locale);
544
544
  this.locale = _locale;
545
545
  this.formats = (0, _extends2.default)({}, defaultFormats, formats);
546
- _dayjs.default.extend(_weekOfYear.default);
546
+
547
+ // Moved plugins to the constructor to allow for users to use options on the library
548
+ // for reference: https://github.com/mui/mui-x/pull/11151
549
+ _dayjs.default.extend(_customParseFormat.default);
547
550
  }
548
551
  }
549
552
  exports.AdapterDayjs = AdapterDayjs;
@@ -238,7 +238,6 @@ class AdapterLuxon {
238
238
  if (typeof Intl === 'undefined' || typeof Intl.DateTimeFormat === 'undefined') {
239
239
  return true; // Luxon defaults to en-US if Intl not found
240
240
  }
241
-
242
241
  return Boolean(new Intl.DateTimeFormat(this.locale, {
243
242
  hour: 'numeric'
244
243
  })?.resolvedOptions()?.hour12);
@@ -315,12 +314,12 @@ class AdapterLuxon {
315
314
  };
316
315
  this.isAfterYear = (value, comparing) => {
317
316
  const comparingInValueTimezone = this.setTimezone(comparing, this.getTimezone(value));
318
- const diff = value.diff(comparingInValueTimezone.endOf('year'), 'years').toObject();
317
+ const diff = value.diff(this.endOfYear(comparingInValueTimezone), 'years').toObject();
319
318
  return diff.years > 0;
320
319
  };
321
320
  this.isAfterDay = (value, comparing) => {
322
321
  const comparingInValueTimezone = this.setTimezone(comparing, this.getTimezone(value));
323
- const diff = value.diff(comparingInValueTimezone.endOf('day'), 'days').toObject();
322
+ const diff = value.diff(this.endOfDay(comparingInValueTimezone), 'days').toObject();
324
323
  return diff.days > 0;
325
324
  };
326
325
  this.isBefore = (value, comparing) => {
@@ -328,12 +327,12 @@ class AdapterLuxon {
328
327
  };
329
328
  this.isBeforeYear = (value, comparing) => {
330
329
  const comparingInValueTimezone = this.setTimezone(comparing, this.getTimezone(value));
331
- const diff = value.diff(comparingInValueTimezone.startOf('year'), 'years').toObject();
330
+ const diff = value.diff(this.startOfYear(comparingInValueTimezone), 'years').toObject();
332
331
  return diff.years < 0;
333
332
  };
334
333
  this.isBeforeDay = (value, comparing) => {
335
334
  const comparingInValueTimezone = this.setTimezone(comparing, this.getTimezone(value));
336
- const diff = value.diff(comparingInValueTimezone.startOf('day'), 'days').toObject();
335
+ const diff = value.diff(this.startOfDay(comparingInValueTimezone), 'days').toObject();
337
336
  return diff.days < 0;
338
337
  };
339
338
  this.isWithinRange = (value, [start, end]) => {
@@ -346,7 +345,12 @@ class AdapterLuxon {
346
345
  return value.startOf('month');
347
346
  };
348
347
  this.startOfWeek = value => {
349
- return value.startOf('week');
348
+ return value.startOf('week',
349
+ // TODO: remove when `@types/luxon` add support for the parameter.
350
+ // @ts-ignore
351
+ {
352
+ useLocaleWeeks: true
353
+ });
350
354
  };
351
355
  this.startOfDay = value => {
352
356
  return value.startOf('day');
@@ -358,7 +362,12 @@ class AdapterLuxon {
358
362
  return value.endOf('month');
359
363
  };
360
364
  this.endOfWeek = value => {
361
- return value.endOf('week');
365
+ return value.endOf('week',
366
+ // TODO: remove when `@types/luxon` add support for the parameter.
367
+ // @ts-ignore
368
+ {
369
+ useLocaleWeeks: true
370
+ });
362
371
  };
363
372
  this.endOfDay = value => {
364
373
  return value.endOf('day');
@@ -460,11 +469,13 @@ class AdapterLuxon {
460
469
  };
461
470
  this.getWeekArray = value => {
462
471
  const cleanValue = this.setLocaleToValue(value);
472
+ const firstDay = this.startOfWeek(this.startOfMonth(cleanValue));
473
+ const lastDay = this.endOfWeek(this.endOfMonth(cleanValue));
463
474
  const {
464
475
  days
465
- } = cleanValue.endOf('month').endOf('week').diff(cleanValue.startOf('month').startOf('week'), 'days').toObject();
476
+ } = lastDay.diff(firstDay, 'days').toObject();
466
477
  const weeks = [];
467
- new Array(Math.round(days)).fill(0).map((_, i) => i).map(day => cleanValue.startOf('month').startOf('week').plus({
478
+ new Array(Math.round(days)).fill(0).map((_, i) => i).map(day => firstDay.plus({
468
479
  days: day
469
480
  })).forEach((v, i) => {
470
481
  if (i === 0 || i % 7 === 0 && i > 6) {
@@ -476,18 +487,18 @@ class AdapterLuxon {
476
487
  return weeks;
477
488
  };
478
489
  this.getWeekNumber = value => {
479
- return value.weekNumber;
490
+ // TODO: remove when `@types/luxon` add support for the parameter.
491
+ // @ts-ignore
492
+ return value.localeWeekNumber ?? value.weekNumber;
480
493
  };
481
494
  this.getYearRange = ([start, end]) => {
482
- const startDate = start.startOf('year');
483
- const endDate = end.endOf('year');
484
- let current = startDate;
495
+ const startDate = this.startOfYear(start);
496
+ const endDate = this.endOfYear(end);
485
497
  const years = [];
486
- while (current < endDate) {
498
+ let current = startDate;
499
+ while (this.isBefore(current, endDate)) {
487
500
  years.push(current);
488
- current = current.plus({
489
- year: 1
490
- });
501
+ current = this.addYears(current, 1);
491
502
  }
492
503
  return years;
493
504
  };
@@ -434,8 +434,8 @@ class AdapterMoment {
434
434
  };
435
435
  this.getWeekArray = value => {
436
436
  const cleanValue = this.setLocaleToValue(value);
437
- const start = cleanValue.clone().startOf('month').startOf('week');
438
- const end = cleanValue.clone().endOf('month').endOf('week');
437
+ const start = this.startOfWeek(this.startOfMonth(cleanValue));
438
+ const end = this.endOfWeek(this.endOfMonth(cleanValue));
439
439
  let count = 0;
440
440
  let current = start;
441
441
  const nestedWeeks = [];
@@ -443,7 +443,7 @@ class AdapterMoment {
443
443
  const weekNumber = Math.floor(count / 7);
444
444
  nestedWeeks[weekNumber] = nestedWeeks[weekNumber] || [];
445
445
  nestedWeeks[weekNumber].push(current);
446
- current = current.clone().add(1, 'day');
446
+ current = this.addDays(current, 1);
447
447
  count += 1;
448
448
  }
449
449
  return nestedWeeks;
@@ -451,20 +451,20 @@ class AdapterMoment {
451
451
  this.getWeekNumber = value => {
452
452
  return value.week();
453
453
  };
454
- this.getYearRange = ([start, end]) => {
455
- const startDate = this.moment(start).startOf('year');
456
- const endDate = this.moment(end).endOf('year');
457
- const years = [];
458
- let current = startDate;
459
- while (current.isBefore(endDate)) {
460
- years.push(current);
461
- current = current.clone().add(1, 'year');
462
- }
463
- return years;
464
- };
465
454
  this.moment = instance || _moment.default;
466
455
  this.locale = locale;
467
456
  this.formats = (0, _extends2.default)({}, defaultFormats, formats);
468
457
  }
458
+ getYearRange([start, end]) {
459
+ const startDate = this.startOfYear(start);
460
+ const endDate = this.endOfYear(end);
461
+ const years = [];
462
+ let current = startDate;
463
+ while (this.isBefore(current, endDate)) {
464
+ years.push(current);
465
+ current = this.addYears(current, 1);
466
+ }
467
+ return years;
468
+ }
469
469
  }
470
470
  exports.AdapterMoment = AdapterMoment;