diff --git a/docs/pages/x/api/date-pickers/date-field.json b/docs/pages/x/api/date-pickers/date-field.json
index 025b85ba32288..25a00b7668ec0 100644
--- a/docs/pages/x/api/date-pickers/date-field.json
+++ b/docs/pages/x/api/date-pickers/date-field.json
@@ -80,7 +80,7 @@
"selectedSections": {
"type": {
"name": "union",
- "description": "'all'
| 'day'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
+ "description": "'all'
| 'day'
| 'empty'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
}
},
"shouldDisableDate": {
diff --git a/docs/pages/x/api/date-pickers/date-picker.json b/docs/pages/x/api/date-pickers/date-picker.json
index 016311a54a025..f2ff66ca01e42 100644
--- a/docs/pages/x/api/date-pickers/date-picker.json
+++ b/docs/pages/x/api/date-pickers/date-picker.json
@@ -124,7 +124,7 @@
"selectedSections": {
"type": {
"name": "union",
- "description": "'all'
| 'day'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
+ "description": "'all'
| 'day'
| 'empty'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
}
},
"shouldDisableDate": {
diff --git a/docs/pages/x/api/date-pickers/date-range-picker.json b/docs/pages/x/api/date-pickers/date-range-picker.json
index 47c4d65f21d40..edca567ee000c 100644
--- a/docs/pages/x/api/date-pickers/date-range-picker.json
+++ b/docs/pages/x/api/date-pickers/date-range-picker.json
@@ -125,7 +125,7 @@
"selectedSections": {
"type": {
"name": "union",
- "description": "'all'
| 'day'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
+ "description": "'all'
| 'day'
| 'empty'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
}
},
"shouldDisableDate": {
diff --git a/docs/pages/x/api/date-pickers/date-time-field.json b/docs/pages/x/api/date-pickers/date-time-field.json
index c55e471885ffe..e8ebd389da532 100644
--- a/docs/pages/x/api/date-pickers/date-time-field.json
+++ b/docs/pages/x/api/date-pickers/date-time-field.json
@@ -87,7 +87,7 @@
"selectedSections": {
"type": {
"name": "union",
- "description": "'all'
| 'day'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
+ "description": "'all'
| 'day'
| 'empty'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
}
},
"shouldDisableClock": {
diff --git a/docs/pages/x/api/date-pickers/date-time-picker.json b/docs/pages/x/api/date-pickers/date-time-picker.json
index 2bbfd1c0d116a..6b6fb3005f71f 100644
--- a/docs/pages/x/api/date-pickers/date-time-picker.json
+++ b/docs/pages/x/api/date-pickers/date-time-picker.json
@@ -132,7 +132,7 @@
"selectedSections": {
"type": {
"name": "union",
- "description": "'all'
| 'day'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
+ "description": "'all'
| 'day'
| 'empty'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
}
},
"shouldDisableClock": {
diff --git a/docs/pages/x/api/date-pickers/desktop-date-picker.json b/docs/pages/x/api/date-pickers/desktop-date-picker.json
index f21a0411be63d..dcacce8c2c199 100644
--- a/docs/pages/x/api/date-pickers/desktop-date-picker.json
+++ b/docs/pages/x/api/date-pickers/desktop-date-picker.json
@@ -120,7 +120,7 @@
"selectedSections": {
"type": {
"name": "union",
- "description": "'all'
| 'day'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
+ "description": "'all'
| 'day'
| 'empty'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
}
},
"shouldDisableDate": {
diff --git a/docs/pages/x/api/date-pickers/desktop-date-range-picker.json b/docs/pages/x/api/date-pickers/desktop-date-range-picker.json
index a52f3fbe53193..ba3b8360c01cd 100644
--- a/docs/pages/x/api/date-pickers/desktop-date-range-picker.json
+++ b/docs/pages/x/api/date-pickers/desktop-date-range-picker.json
@@ -121,7 +121,7 @@
"selectedSections": {
"type": {
"name": "union",
- "description": "'all'
| 'day'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
+ "description": "'all'
| 'day'
| 'empty'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
}
},
"shouldDisableDate": {
diff --git a/docs/pages/x/api/date-pickers/desktop-date-time-picker.json b/docs/pages/x/api/date-pickers/desktop-date-time-picker.json
index b0340ec71d619..231034270a368 100644
--- a/docs/pages/x/api/date-pickers/desktop-date-time-picker.json
+++ b/docs/pages/x/api/date-pickers/desktop-date-time-picker.json
@@ -128,7 +128,7 @@
"selectedSections": {
"type": {
"name": "union",
- "description": "'all'
| 'day'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
+ "description": "'all'
| 'day'
| 'empty'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
}
},
"shouldDisableClock": {
diff --git a/docs/pages/x/api/date-pickers/desktop-time-picker.json b/docs/pages/x/api/date-pickers/desktop-time-picker.json
index 467f7eb93f699..f15c180fa553a 100644
--- a/docs/pages/x/api/date-pickers/desktop-time-picker.json
+++ b/docs/pages/x/api/date-pickers/desktop-time-picker.json
@@ -89,7 +89,7 @@
"selectedSections": {
"type": {
"name": "union",
- "description": "'all'
| 'day'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
+ "description": "'all'
| 'day'
| 'empty'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
}
},
"shouldDisableClock": {
diff --git a/docs/pages/x/api/date-pickers/mobile-date-picker.json b/docs/pages/x/api/date-pickers/mobile-date-picker.json
index 66a8e94d9345e..0f4bef141554b 100644
--- a/docs/pages/x/api/date-pickers/mobile-date-picker.json
+++ b/docs/pages/x/api/date-pickers/mobile-date-picker.json
@@ -120,7 +120,7 @@
"selectedSections": {
"type": {
"name": "union",
- "description": "'all'
| 'day'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
+ "description": "'all'
| 'day'
| 'empty'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
}
},
"shouldDisableDate": {
diff --git a/docs/pages/x/api/date-pickers/mobile-date-range-picker.json b/docs/pages/x/api/date-pickers/mobile-date-range-picker.json
index 8ec8b2244e16b..6c1d3e36212d3 100644
--- a/docs/pages/x/api/date-pickers/mobile-date-range-picker.json
+++ b/docs/pages/x/api/date-pickers/mobile-date-range-picker.json
@@ -121,7 +121,7 @@
"selectedSections": {
"type": {
"name": "union",
- "description": "'all'
| 'day'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
+ "description": "'all'
| 'day'
| 'empty'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
}
},
"shouldDisableDate": {
diff --git a/docs/pages/x/api/date-pickers/mobile-date-time-picker.json b/docs/pages/x/api/date-pickers/mobile-date-time-picker.json
index 20abb775e3a0a..25bbdc0cb53d2 100644
--- a/docs/pages/x/api/date-pickers/mobile-date-time-picker.json
+++ b/docs/pages/x/api/date-pickers/mobile-date-time-picker.json
@@ -128,7 +128,7 @@
"selectedSections": {
"type": {
"name": "union",
- "description": "'all'
| 'day'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
+ "description": "'all'
| 'day'
| 'empty'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
}
},
"shouldDisableClock": {
diff --git a/docs/pages/x/api/date-pickers/mobile-time-picker.json b/docs/pages/x/api/date-pickers/mobile-time-picker.json
index f26c11c653c56..e055b4e6ac0ea 100644
--- a/docs/pages/x/api/date-pickers/mobile-time-picker.json
+++ b/docs/pages/x/api/date-pickers/mobile-time-picker.json
@@ -89,7 +89,7 @@
"selectedSections": {
"type": {
"name": "union",
- "description": "'all'
| 'day'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
+ "description": "'all'
| 'day'
| 'empty'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
}
},
"shouldDisableClock": {
diff --git a/docs/pages/x/api/date-pickers/multi-input-date-range-field.json b/docs/pages/x/api/date-pickers/multi-input-date-range-field.json
index 4ba22449cc412..8aecc2c24a1f7 100644
--- a/docs/pages/x/api/date-pickers/multi-input-date-range-field.json
+++ b/docs/pages/x/api/date-pickers/multi-input-date-range-field.json
@@ -61,7 +61,7 @@
"selectedSections": {
"type": {
"name": "union",
- "description": "'all'
| 'day'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
+ "description": "'all'
| 'day'
| 'empty'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
}
},
"shouldDisableDate": {
diff --git a/docs/pages/x/api/date-pickers/multi-input-date-time-range-field.json b/docs/pages/x/api/date-pickers/multi-input-date-time-range-field.json
index e9436cdda5a37..f6515e88bc6e3 100644
--- a/docs/pages/x/api/date-pickers/multi-input-date-time-range-field.json
+++ b/docs/pages/x/api/date-pickers/multi-input-date-time-range-field.json
@@ -68,7 +68,7 @@
"selectedSections": {
"type": {
"name": "union",
- "description": "'all'
| 'day'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
+ "description": "'all'
| 'day'
| 'empty'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
}
},
"shouldDisableClock": {
diff --git a/docs/pages/x/api/date-pickers/multi-input-time-range-field.json b/docs/pages/x/api/date-pickers/multi-input-time-range-field.json
index 9a7f179c98c15..597b96985abf7 100644
--- a/docs/pages/x/api/date-pickers/multi-input-time-range-field.json
+++ b/docs/pages/x/api/date-pickers/multi-input-time-range-field.json
@@ -64,7 +64,7 @@
"selectedSections": {
"type": {
"name": "union",
- "description": "'all'
| 'day'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
+ "description": "'all'
| 'day'
| 'empty'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
}
},
"shouldDisableClock": {
diff --git a/docs/pages/x/api/date-pickers/single-input-date-range-field.json b/docs/pages/x/api/date-pickers/single-input-date-range-field.json
index 62af0111efde4..f9686594a21b2 100644
--- a/docs/pages/x/api/date-pickers/single-input-date-range-field.json
+++ b/docs/pages/x/api/date-pickers/single-input-date-range-field.json
@@ -80,7 +80,7 @@
"selectedSections": {
"type": {
"name": "union",
- "description": "'all'
| 'day'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
+ "description": "'all'
| 'day'
| 'empty'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
}
},
"shouldDisableDate": {
diff --git a/docs/pages/x/api/date-pickers/single-input-date-time-range-field.json b/docs/pages/x/api/date-pickers/single-input-date-time-range-field.json
index 9a75c2d1b0936..3875cdd171f60 100644
--- a/docs/pages/x/api/date-pickers/single-input-date-time-range-field.json
+++ b/docs/pages/x/api/date-pickers/single-input-date-time-range-field.json
@@ -87,7 +87,7 @@
"selectedSections": {
"type": {
"name": "union",
- "description": "'all'
| 'day'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
+ "description": "'all'
| 'day'
| 'empty'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
}
},
"shouldDisableClock": {
diff --git a/docs/pages/x/api/date-pickers/single-input-time-range-field.json b/docs/pages/x/api/date-pickers/single-input-time-range-field.json
index eedc5351fa374..bfadfaef526a9 100644
--- a/docs/pages/x/api/date-pickers/single-input-time-range-field.json
+++ b/docs/pages/x/api/date-pickers/single-input-time-range-field.json
@@ -83,7 +83,7 @@
"selectedSections": {
"type": {
"name": "union",
- "description": "'all'
| 'day'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
+ "description": "'all'
| 'day'
| 'empty'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
}
},
"shouldDisableClock": {
diff --git a/docs/pages/x/api/date-pickers/time-field.json b/docs/pages/x/api/date-pickers/time-field.json
index 32cbf7721f4c1..51e8128222ea3 100644
--- a/docs/pages/x/api/date-pickers/time-field.json
+++ b/docs/pages/x/api/date-pickers/time-field.json
@@ -83,7 +83,7 @@
"selectedSections": {
"type": {
"name": "union",
- "description": "'all'
| 'day'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
+ "description": "'all'
| 'day'
| 'empty'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
}
},
"shouldDisableClock": {
diff --git a/docs/pages/x/api/date-pickers/time-picker.json b/docs/pages/x/api/date-pickers/time-picker.json
index 655c7febb360c..99d3531a06608 100644
--- a/docs/pages/x/api/date-pickers/time-picker.json
+++ b/docs/pages/x/api/date-pickers/time-picker.json
@@ -93,7 +93,7 @@
"selectedSections": {
"type": {
"name": "union",
- "description": "'all'
| 'day'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
+ "description": "'all'
| 'day'
| 'empty'
| 'hours'
| 'meridiem'
| 'minutes'
| 'month'
| 'seconds'
| 'weekDay'
| 'year'
| number
| { endIndex: number, startIndex: number }"
}
},
"shouldDisableClock": {
diff --git a/packages/x-date-pickers-pro/src/DateRangePicker/DateRangePicker.tsx b/packages/x-date-pickers-pro/src/DateRangePicker/DateRangePicker.tsx
index 66665551f39ff..3dd1908e3e49f 100644
--- a/packages/x-date-pickers-pro/src/DateRangePicker/DateRangePicker.tsx
+++ b/packages/x-date-pickers-pro/src/DateRangePicker/DateRangePicker.tsx
@@ -275,6 +275,7 @@ DateRangePicker.propTypes = {
PropTypes.oneOf([
'all',
'day',
+ 'empty',
'hours',
'meridiem',
'minutes',
diff --git a/packages/x-date-pickers-pro/src/DesktopDateRangePicker/DesktopDateRangePicker.tsx b/packages/x-date-pickers-pro/src/DesktopDateRangePicker/DesktopDateRangePicker.tsx
index a079f1edb8ec6..45cbc119156f3 100644
--- a/packages/x-date-pickers-pro/src/DesktopDateRangePicker/DesktopDateRangePicker.tsx
+++ b/packages/x-date-pickers-pro/src/DesktopDateRangePicker/DesktopDateRangePicker.tsx
@@ -305,6 +305,7 @@ DesktopDateRangePicker.propTypes = {
PropTypes.oneOf([
'all',
'day',
+ 'empty',
'hours',
'meridiem',
'minutes',
diff --git a/packages/x-date-pickers-pro/src/MobileDateRangePicker/MobileDateRangePicker.tsx b/packages/x-date-pickers-pro/src/MobileDateRangePicker/MobileDateRangePicker.tsx
index aa9c7698ed50b..d4f1e52537417 100644
--- a/packages/x-date-pickers-pro/src/MobileDateRangePicker/MobileDateRangePicker.tsx
+++ b/packages/x-date-pickers-pro/src/MobileDateRangePicker/MobileDateRangePicker.tsx
@@ -305,6 +305,7 @@ MobileDateRangePicker.propTypes = {
PropTypes.oneOf([
'all',
'day',
+ 'empty',
'hours',
'meridiem',
'minutes',
diff --git a/packages/x-date-pickers-pro/src/MultiInputDateRangeField/MultiInputDateRangeField.tsx b/packages/x-date-pickers-pro/src/MultiInputDateRangeField/MultiInputDateRangeField.tsx
index 2f7cea805d30a..29b7f8c2e40a3 100644
--- a/packages/x-date-pickers-pro/src/MultiInputDateRangeField/MultiInputDateRangeField.tsx
+++ b/packages/x-date-pickers-pro/src/MultiInputDateRangeField/MultiInputDateRangeField.tsx
@@ -312,6 +312,7 @@ MultiInputDateRangeField.propTypes = {
PropTypes.oneOf([
'all',
'day',
+ 'empty',
'hours',
'meridiem',
'minutes',
diff --git a/packages/x-date-pickers-pro/src/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.tsx b/packages/x-date-pickers-pro/src/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.tsx
index a270d81260412..5c7482c365b70 100644
--- a/packages/x-date-pickers-pro/src/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.tsx
+++ b/packages/x-date-pickers-pro/src/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.tsx
@@ -343,6 +343,7 @@ MultiInputDateTimeRangeField.propTypes = {
PropTypes.oneOf([
'all',
'day',
+ 'empty',
'hours',
'meridiem',
'minutes',
diff --git a/packages/x-date-pickers-pro/src/MultiInputTimeRangeField/MultiInputTimeRangeField.tsx b/packages/x-date-pickers-pro/src/MultiInputTimeRangeField/MultiInputTimeRangeField.tsx
index 350be349f524d..2edcfbda0a448 100644
--- a/packages/x-date-pickers-pro/src/MultiInputTimeRangeField/MultiInputTimeRangeField.tsx
+++ b/packages/x-date-pickers-pro/src/MultiInputTimeRangeField/MultiInputTimeRangeField.tsx
@@ -330,6 +330,7 @@ MultiInputTimeRangeField.propTypes = {
PropTypes.oneOf([
'all',
'day',
+ 'empty',
'hours',
'meridiem',
'minutes',
diff --git a/packages/x-date-pickers-pro/src/SingleInputDateRangeField/SingleInputDateRangeField.tsx b/packages/x-date-pickers-pro/src/SingleInputDateRangeField/SingleInputDateRangeField.tsx
index fea8b89623953..3c45cd1c62b66 100644
--- a/packages/x-date-pickers-pro/src/SingleInputDateRangeField/SingleInputDateRangeField.tsx
+++ b/packages/x-date-pickers-pro/src/SingleInputDateRangeField/SingleInputDateRangeField.tsx
@@ -245,6 +245,7 @@ SingleInputDateRangeField.propTypes = {
PropTypes.oneOf([
'all',
'day',
+ 'empty',
'hours',
'meridiem',
'minutes',
diff --git a/packages/x-date-pickers-pro/src/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.tsx b/packages/x-date-pickers-pro/src/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.tsx
index bf7ef82c2b1b9..eaf1f41f21908 100644
--- a/packages/x-date-pickers-pro/src/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.tsx
+++ b/packages/x-date-pickers-pro/src/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.tsx
@@ -279,6 +279,7 @@ SingleInputDateTimeRangeField.propTypes = {
PropTypes.oneOf([
'all',
'day',
+ 'empty',
'hours',
'meridiem',
'minutes',
diff --git a/packages/x-date-pickers-pro/src/SingleInputTimeRangeField/SingleInputTimeRangeField.tsx b/packages/x-date-pickers-pro/src/SingleInputTimeRangeField/SingleInputTimeRangeField.tsx
index d4d28798cc9dd..761c05a48462c 100644
--- a/packages/x-date-pickers-pro/src/SingleInputTimeRangeField/SingleInputTimeRangeField.tsx
+++ b/packages/x-date-pickers-pro/src/SingleInputTimeRangeField/SingleInputTimeRangeField.tsx
@@ -262,6 +262,7 @@ SingleInputTimeRangeField.propTypes = {
PropTypes.oneOf([
'all',
'day',
+ 'empty',
'hours',
'meridiem',
'minutes',
diff --git a/packages/x-date-pickers/src/DateField/DateField.tsx b/packages/x-date-pickers/src/DateField/DateField.tsx
index 9ca2e103dc45f..c8969118c32f8 100644
--- a/packages/x-date-pickers/src/DateField/DateField.tsx
+++ b/packages/x-date-pickers/src/DateField/DateField.tsx
@@ -242,6 +242,7 @@ DateField.propTypes = {
PropTypes.oneOf([
'all',
'day',
+ 'empty',
'hours',
'meridiem',
'minutes',
diff --git a/packages/x-date-pickers/src/DatePicker/DatePicker.tsx b/packages/x-date-pickers/src/DatePicker/DatePicker.tsx
index e7093838003fc..35e1f002652df 100644
--- a/packages/x-date-pickers/src/DatePicker/DatePicker.tsx
+++ b/packages/x-date-pickers/src/DatePicker/DatePicker.tsx
@@ -265,6 +265,7 @@ DatePicker.propTypes = {
PropTypes.oneOf([
'all',
'day',
+ 'empty',
'hours',
'meridiem',
'minutes',
diff --git a/packages/x-date-pickers/src/DateTimeField/DateTimeField.tsx b/packages/x-date-pickers/src/DateTimeField/DateTimeField.tsx
index c36fd6ce82dc6..30676e2804c9e 100644
--- a/packages/x-date-pickers/src/DateTimeField/DateTimeField.tsx
+++ b/packages/x-date-pickers/src/DateTimeField/DateTimeField.tsx
@@ -277,6 +277,7 @@ DateTimeField.propTypes = {
PropTypes.oneOf([
'all',
'day',
+ 'empty',
'hours',
'meridiem',
'minutes',
diff --git a/packages/x-date-pickers/src/DateTimePicker/DateTimePicker.tsx b/packages/x-date-pickers/src/DateTimePicker/DateTimePicker.tsx
index b00519225beb1..b15d9df4d000c 100644
--- a/packages/x-date-pickers/src/DateTimePicker/DateTimePicker.tsx
+++ b/packages/x-date-pickers/src/DateTimePicker/DateTimePicker.tsx
@@ -303,6 +303,7 @@ DateTimePicker.propTypes = {
PropTypes.oneOf([
'all',
'day',
+ 'empty',
'hours',
'meridiem',
'minutes',
diff --git a/packages/x-date-pickers/src/DesktopDatePicker/DesktopDatePicker.tsx b/packages/x-date-pickers/src/DesktopDatePicker/DesktopDatePicker.tsx
index e2513fd0f8967..a4c61e9b38845 100644
--- a/packages/x-date-pickers/src/DesktopDatePicker/DesktopDatePicker.tsx
+++ b/packages/x-date-pickers/src/DesktopDatePicker/DesktopDatePicker.tsx
@@ -305,6 +305,7 @@ DesktopDatePicker.propTypes = {
PropTypes.oneOf([
'all',
'day',
+ 'empty',
'hours',
'meridiem',
'minutes',
diff --git a/packages/x-date-pickers/src/DesktopDateTimePicker/DesktopDateTimePicker.tsx b/packages/x-date-pickers/src/DesktopDateTimePicker/DesktopDateTimePicker.tsx
index 03dbd89ff05c9..c854a8ea1f93c 100644
--- a/packages/x-date-pickers/src/DesktopDateTimePicker/DesktopDateTimePicker.tsx
+++ b/packages/x-date-pickers/src/DesktopDateTimePicker/DesktopDateTimePicker.tsx
@@ -385,6 +385,7 @@ DesktopDateTimePicker.propTypes = {
PropTypes.oneOf([
'all',
'day',
+ 'empty',
'hours',
'meridiem',
'minutes',
diff --git a/packages/x-date-pickers/src/DesktopTimePicker/DesktopTimePicker.tsx b/packages/x-date-pickers/src/DesktopTimePicker/DesktopTimePicker.tsx
index 5857c3f2242d8..39011be50d3f2 100644
--- a/packages/x-date-pickers/src/DesktopTimePicker/DesktopTimePicker.tsx
+++ b/packages/x-date-pickers/src/DesktopTimePicker/DesktopTimePicker.tsx
@@ -310,6 +310,7 @@ DesktopTimePicker.propTypes = {
PropTypes.oneOf([
'all',
'day',
+ 'empty',
'hours',
'meridiem',
'minutes',
diff --git a/packages/x-date-pickers/src/MobileDatePicker/MobileDatePicker.tsx b/packages/x-date-pickers/src/MobileDatePicker/MobileDatePicker.tsx
index ab414d3d2371b..d7f373fec4e67 100644
--- a/packages/x-date-pickers/src/MobileDatePicker/MobileDatePicker.tsx
+++ b/packages/x-date-pickers/src/MobileDatePicker/MobileDatePicker.tsx
@@ -301,6 +301,7 @@ MobileDatePicker.propTypes = {
PropTypes.oneOf([
'all',
'day',
+ 'empty',
'hours',
'meridiem',
'minutes',
diff --git a/packages/x-date-pickers/src/MobileDateTimePicker/MobileDateTimePicker.tsx b/packages/x-date-pickers/src/MobileDateTimePicker/MobileDateTimePicker.tsx
index 9311762827604..585c836d481e6 100644
--- a/packages/x-date-pickers/src/MobileDateTimePicker/MobileDateTimePicker.tsx
+++ b/packages/x-date-pickers/src/MobileDateTimePicker/MobileDateTimePicker.tsx
@@ -353,6 +353,7 @@ MobileDateTimePicker.propTypes = {
PropTypes.oneOf([
'all',
'day',
+ 'empty',
'hours',
'meridiem',
'minutes',
diff --git a/packages/x-date-pickers/src/MobileTimePicker/MobileTimePicker.tsx b/packages/x-date-pickers/src/MobileTimePicker/MobileTimePicker.tsx
index 2310f8dc69698..8ad6d9b49d334 100644
--- a/packages/x-date-pickers/src/MobileTimePicker/MobileTimePicker.tsx
+++ b/packages/x-date-pickers/src/MobileTimePicker/MobileTimePicker.tsx
@@ -274,6 +274,7 @@ MobileTimePicker.propTypes = {
PropTypes.oneOf([
'all',
'day',
+ 'empty',
'hours',
'meridiem',
'minutes',
diff --git a/packages/x-date-pickers/src/TimeField/TimeField.tsx b/packages/x-date-pickers/src/TimeField/TimeField.tsx
index 0c0b602fe1287..3c4d454d1f89d 100644
--- a/packages/x-date-pickers/src/TimeField/TimeField.tsx
+++ b/packages/x-date-pickers/src/TimeField/TimeField.tsx
@@ -259,6 +259,7 @@ TimeField.propTypes = {
PropTypes.oneOf([
'all',
'day',
+ 'empty',
'hours',
'meridiem',
'minutes',
diff --git a/packages/x-date-pickers/src/TimePicker/TimePicker.tsx b/packages/x-date-pickers/src/TimePicker/TimePicker.tsx
index fe1203855a44b..fe2ed7e64019b 100644
--- a/packages/x-date-pickers/src/TimePicker/TimePicker.tsx
+++ b/packages/x-date-pickers/src/TimePicker/TimePicker.tsx
@@ -232,6 +232,7 @@ TimePicker.propTypes = {
PropTypes.oneOf([
'all',
'day',
+ 'empty',
'hours',
'meridiem',
'minutes',
diff --git a/packages/x-date-pickers/src/internals/hooks/useField/useField.ts b/packages/x-date-pickers/src/internals/hooks/useField/useField.ts
index f94b18ce9f970..61fad22ff5ed8 100644
--- a/packages/x-date-pickers/src/internals/hooks/useField/useField.ts
+++ b/packages/x-date-pickers/src/internals/hooks/useField/useField.ts
@@ -404,7 +404,7 @@ export const useField = <
// Fix scroll jumping on iOS browser: https://github.com/mui/mui-x/issues/8321
const currentScrollTop = inputRef.current.scrollTop;
// On multi input range pickers we want to update selection range only for the active input
- // This helps avoiding the focus jumping on Safari https://github.com/mui/mui-x/issues/9003
+ // This helps to avoid the focus jumping on Safari https://github.com/mui/mui-x/issues/9003
// because WebKit implements the `setSelectionRange` based on the spec: https://bugs.webkit.org/show_bug.cgi?id=224425
if (inputRef.current === getActiveElement(document)) {
inputRef.current.setSelectionRange(selectionStart, selectionEnd);
diff --git a/packages/x-date-pickers/src/internals/hooks/useField/useField.types.ts b/packages/x-date-pickers/src/internals/hooks/useField/useField.types.ts
index c8eb121a0c51b..6e1cefb704f12 100644
--- a/packages/x-date-pickers/src/internals/hooks/useField/useField.types.ts
+++ b/packages/x-date-pickers/src/internals/hooks/useField/useField.types.ts
@@ -224,9 +224,8 @@ export type FieldSelectedSectionsIndexes = {
endIndex: number;
/**
* If `true`, the selectors at the very beginning and very end of the input will be selected.
- * @default false
*/
- shouldSelectBoundarySelectors?: boolean;
+ shouldSelectBoundarySelectors: boolean;
};
export interface FieldValueManager {
diff --git a/packages/x-date-pickers/src/internals/hooks/useField/useField.utils.ts b/packages/x-date-pickers/src/internals/hooks/useField/useField.utils.ts
index bba43ca24f4a0..e738c8a28f9ae 100644
--- a/packages/x-date-pickers/src/internals/hooks/useField/useField.utils.ts
+++ b/packages/x-date-pickers/src/internals/hooks/useField/useField.utils.ts
@@ -333,7 +333,9 @@ export const addPositionPropertiesToSections = (
// The ...InInput values consider the unicode characters but do include them in their indexes
const cleanedValue = cleanString(renderedValue);
const startInInput =
- positionInInput + renderedValue.indexOf(cleanedValue[0]) + section.startSeparator.length;
+ positionInInput +
+ (cleanedValue === '' ? 0 : renderedValue.indexOf(cleanedValue[0])) +
+ section.startSeparator.length;
const endInInput = startInInput + cleanedValue.length;
newSections.push({
@@ -625,6 +627,23 @@ export const splitFormatIntoSections = (
commitToken(currentTokenValue);
+ if (sections.length === 0 && startSeparator.length > 0) {
+ sections.push({
+ type: 'empty',
+ contentType: 'letter',
+ maxLength: null,
+ format: '',
+ value: '',
+ placeholder: '',
+ hasLeadingZeros: false,
+ hasLeadingZerosInFormat: false,
+ hasLeadingZerosInInput: false,
+ startSeparator,
+ endSeparator: '',
+ modified: false,
+ });
+ }
+
return sections.map((section) => {
const cleanSeparator = (separator: string) => {
let cleanedSeparator = separator;
@@ -782,6 +801,10 @@ export const getSectionsBoundaries = (
minimum: 0,
maximum: 0,
}),
+ empty: () => ({
+ minimum: 0,
+ maximum: 0,
+ }),
};
};
@@ -886,6 +909,7 @@ const reliableSectionModificationOrder: Record = {
minutes: 6,
seconds: 7,
meridiem: 8,
+ empty: 9,
};
export const mergeDateIntoReferenceDate = (
diff --git a/packages/x-date-pickers/src/internals/hooks/useField/useFieldState.ts b/packages/x-date-pickers/src/internals/hooks/useField/useFieldState.ts
index 660ead62ac7dc..ce8e2313ee738 100644
--- a/packages/x-date-pickers/src/internals/hooks/useField/useFieldState.ts
+++ b/packages/x-date-pickers/src/internals/hooks/useField/useFieldState.ts
@@ -186,7 +186,11 @@ export const useFieldState = <
}
if (typeof selectedSections === 'number') {
- return { startIndex: selectedSections, endIndex: selectedSections };
+ return {
+ startIndex: selectedSections,
+ endIndex: selectedSections,
+ shouldSelectBoundarySelectors: state.sections[selectedSections].type === 'empty',
+ };
}
if (typeof selectedSections === 'string') {
@@ -194,10 +198,19 @@ export const useFieldState = <
(section) => section.type === selectedSections,
);
- return { startIndex: selectedSectionIndex, endIndex: selectedSectionIndex };
+ return {
+ startIndex: selectedSectionIndex,
+ endIndex: selectedSectionIndex,
+ shouldSelectBoundarySelectors: state.sections[selectedSectionIndex].type === 'empty',
+ };
}
- return selectedSections;
+ return {
+ ...selectedSections,
+ shouldSelectBoundarySelectors:
+ selectedSections.startIndex === selectedSections.endIndex &&
+ state.sections[selectedSections.startIndex].type === 'empty',
+ };
}, [selectedSections, state.sections]);
const publishValue = ({
diff --git a/packages/x-date-pickers/src/models/fields.ts b/packages/x-date-pickers/src/models/fields.ts
index 06b589a3a9d30..0469a9f7d9569 100644
--- a/packages/x-date-pickers/src/models/fields.ts
+++ b/packages/x-date-pickers/src/models/fields.ts
@@ -9,7 +9,8 @@ export type FieldSectionType =
| 'hours'
| 'minutes'
| 'seconds'
- | 'meridiem';
+ | 'meridiem'
+ | 'empty';
export type FieldSectionContentType = 'digit' | 'digit-with-letter' | 'letter';