@mui/x-date-pickers 7.22.2 → 8.0.0-alpha.0

package/node/locales/ptPT.js

@@ -37,7 +37,7 @@ const ptPTPickers = {
   timePickerToolbarTitle: 'Selecione a hora',
   dateRangePickerToolbarTitle: 'Selecione o intervalo de datas',
   // Clock labels
-  clockLabelText: (view, time, utils, formattedTime) => `Selecione ${timeViews[view]}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Hora não selecionada' : `Selecionado a hora ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, formattedTime) => `Selecione ${timeViews[view]}. ${!formattedTime ? 'Hora não selecionada' : `Selecionado a hora ${formattedTime}`}`,
   hoursClockNumberText: hours => `${hours} horas`,
   minutesClockNumberText: minutes => `${minutes} minutos`,
   secondsClockNumberText: seconds => `${seconds} segundos`,
@@ -49,8 +49,8 @@ const ptPTPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `Semana ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `Escolha uma data, a data selecionada é ${formattedDate ?? utils.format(value, 'fullDate')}` : 'Escolha uma data',
-  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `Escolha uma hora, a hora selecionada é ${formattedTime ?? utils.format(value, 'fullTime')}` : 'Escolha uma hora',
+  openDatePickerDialogue: formattedDate => formattedDate ? `Escolha uma data, a data selecionada é ${formattedDate}` : 'Escolha uma data',
+  openTimePickerDialogue: formattedTime => formattedTime ? `Escolha uma hora, a hora selecionada é ${formattedTime}` : 'Escolha uma hora',
   fieldClearLabel: 'Limpar valor',
   // Table labels
   timeTableLabel: 'escolha uma hora',

package/node/locales/roRO.js

@@ -39,7 +39,7 @@ const roROPickers = {
   timePickerToolbarTitle: 'Selectați ora',
   dateRangePickerToolbarTitle: 'Selectați intervalul de date',
   // Clock labels
-  clockLabelText: (view, time, utils, formattedTime) => `Selectați ${timeViews[view] ?? view}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Nicio oră selectată' : `Ora selectată este ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, formattedTime) => `Selectați ${timeViews[view] ?? view}. ${!formattedTime ? 'Nicio oră selectată' : `Ora selectată este ${formattedTime}`}`,
   hoursClockNumberText: hours => `${hours} ${timeViews.hours}`,
   minutesClockNumberText: minutes => `${minutes} ${timeViews.minutes}`,
   secondsClockNumberText: seconds => `${seconds}  ${timeViews.seconds}`,
@@ -51,8 +51,8 @@ const roROPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `Săptămâna ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `Selectați data, data selectată este ${formattedDate ?? utils.format(value, 'fullDate')}` : 'Selectați data',
-  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `Selectați ora, ora selectată este ${formattedTime ?? utils.format(value, 'fullTime')}` : 'Selectați ora',
+  openDatePickerDialogue: formattedDate => formattedDate ? `Selectați data, data selectată este ${formattedDate}` : 'Selectați data',
+  openTimePickerDialogue: formattedTime => formattedTime ? `Selectați ora, ora selectată este ${formattedTime}` : 'Selectați ora',
   fieldClearLabel: 'Golire conținut',
   // Table labels
   timeTableLabel: 'Selectați ora',

package/node/locales/ruRU.js

@@ -38,7 +38,7 @@ const ruRUPickers = {
   timePickerToolbarTitle: 'Выбрать время',
   dateRangePickerToolbarTitle: 'Выбрать период',
   // Clock labels
-  clockLabelText: (view, time, utils, formattedTime) => `Выбрать ${timeViews[view]}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Время не выбрано' : `Выбрано время ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, formattedTime) => `Выбрать ${timeViews[view]}. ${!formattedTime ? 'Время не выбрано' : `Выбрано время ${formattedTime}`}`,
   hoursClockNumberText: hours => `${hours} часов`,
   minutesClockNumberText: minutes => `${minutes} минут`,
   secondsClockNumberText: seconds => `${seconds} секунд`,
@@ -50,8 +50,8 @@ const ruRUPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `Неделя ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `Выберите дату, выбрана дата ${formattedDate ?? utils.format(value, 'fullDate')}` : 'Выберите дату',
-  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `Выберите время, выбрано время ${formattedTime ?? utils.format(value, 'fullTime')}` : 'Выберите время',
+  openDatePickerDialogue: formattedDate => formattedDate ? `Выберите дату, выбрана дата ${formattedDate}` : 'Выберите дату',
+  openTimePickerDialogue: formattedTime => formattedTime ? `Выберите время, выбрано время ${formattedTime}` : 'Выберите время',
   fieldClearLabel: 'Очистить значение',
   // Table labels
   timeTableLabel: 'выбрать время',

package/node/locales/skSK.js

@@ -39,7 +39,7 @@ const skSKPickers = {
   timePickerToolbarTitle: 'Vyberte čas',
   dateRangePickerToolbarTitle: 'Vyberete rozmedzie dátumov',
   // Clock labels
-  clockLabelText: (view, time, utils, formattedTime) => `${timeViews[view] ?? view} vybraný. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Nie je vybraný čas' : `Vybraný čas je ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, formattedTime) => `${timeViews[view] ?? view} vybraný. ${!formattedTime ? 'Nie je vybraný čas' : `Vybraný čas je ${formattedTime}`}`,
   hoursClockNumberText: hours => `${hours} hodín`,
   minutesClockNumberText: minutes => `${minutes} minút`,
   secondsClockNumberText: seconds => `${seconds} sekúnd`,
@@ -51,8 +51,8 @@ const skSKPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `${weekNumber} týždeň v roku`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `Vyberte dátum, vybraný dátum je ${formattedDate ?? utils.format(value, 'fullDate')}` : 'Vyberte dátum',
-  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `Vyberte čas, vybraný čas je ${formattedTime ?? utils.format(value, 'fullTime')}` : 'Vyberte čas',
+  openDatePickerDialogue: formattedDate => formattedDate ? `Vyberte dátum, vybraný dátum je ${formattedDate}` : 'Vyberte dátum',
+  openTimePickerDialogue: formattedTime => formattedTime ? `Vyberte čas, vybraný čas je ${formattedTime}` : 'Vyberte čas',
   // fieldClearLabel: 'Clear',
 
   // Table labels

package/node/locales/svSE.js

@@ -37,7 +37,7 @@ const svSEPickers = {
   timePickerToolbarTitle: 'Välj tid',
   dateRangePickerToolbarTitle: 'Välj datumintervall',
   // Clock labels
-  clockLabelText: (view, time, utils, formattedTime) => `Välj ${timeViews[view]}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Ingen tid vald' : `Vald tid är ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, formattedTime) => `Välj ${timeViews[view]}. ${!formattedTime ? 'Ingen tid vald' : `Vald tid är ${formattedTime}`}`,
   hoursClockNumberText: hours => `${hours} timmar`,
   minutesClockNumberText: minutes => `${minutes} minuter`,
   secondsClockNumberText: seconds => `${seconds} sekunder`,
@@ -49,8 +49,8 @@ const svSEPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `Vecka ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `Välj datum, valt datum är ${formattedDate ?? utils.format(value, 'fullDate')}` : 'Välj datum',
-  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `Välj tid, vald tid är ${formattedTime ?? utils.format(value, 'fullTime')}` : 'Välj tid',
+  openDatePickerDialogue: formattedDate => formattedDate ? `Välj datum, valt datum är ${formattedDate}` : 'Välj datum',
+  openTimePickerDialogue: formattedTime => formattedTime ? `Välj tid, vald tid är ${formattedTime}` : 'Välj tid',
   fieldClearLabel: 'Rensa värde',
   // Table labels
   timeTableLabel: 'välj tid',

package/node/locales/trTR.js

@@ -38,7 +38,7 @@ const trTRPickers = {
   timePickerToolbarTitle: 'Saat seç',
   dateRangePickerToolbarTitle: 'Tarih aralığı seçin',
   // Clock labels
-  clockLabelText: (view, time, utils, formattedTime) => `${timeViews[view]} seç.  ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Zaman seçilmedi' : `Seçilen zaman: ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, formattedTime) => `${timeViews[view]} seç.  ${!formattedTime ? 'Zaman seçilmedi' : `Seçilen zaman: ${formattedTime}`}`,
   hoursClockNumberText: hours => `${hours} saat`,
   minutesClockNumberText: minutes => `${minutes} dakika`,
   secondsClockNumberText: seconds => `${seconds} saniye`,
@@ -50,8 +50,8 @@ const trTRPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `Hafta ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `Tarih seçin, seçilen tarih: ${formattedDate ?? utils.format(value, 'fullDate')}` : 'Tarih seç',
-  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `Saat seçin, seçilen saat: ${formattedTime ?? utils.format(value, 'fullTime')}` : 'Saat seç',
+  openDatePickerDialogue: formattedDate => formattedDate ? `Tarih seçin, seçilen tarih: ${formattedDate}` : 'Tarih seç',
+  openTimePickerDialogue: formattedTime => formattedTime ? `Saat seçin, seçilen saat: ${formattedTime}` : 'Saat seç',
   // fieldClearLabel: 'Clear',
 
   // Table labels

package/node/locales/ukUA.js

@@ -37,7 +37,7 @@ const ukUAPickers = {
   timePickerToolbarTitle: 'Вибрати час',
   dateRangePickerToolbarTitle: 'Вибрати календарний період',
   // Clock labels
-  clockLabelText: (view, time, utils, formattedTime) => `Вибрати ${timeViews[view]}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Час не вибраний' : `Вибрано час ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, formattedTime) => `Вибрати ${timeViews[view]}. ${!formattedTime ? 'Час не вибраний' : `Вибрано час ${formattedTime}`}`,
   hoursClockNumberText: hours => `${hours} годин`,
   minutesClockNumberText: minutes => `${minutes} хвилин`,
   secondsClockNumberText: seconds => `${seconds} секунд`,
@@ -49,8 +49,8 @@ const ukUAPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `Тиждень ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `Оберіть дату, обрана дата  ${formattedDate ?? utils.format(value, 'fullDate')}` : 'Оберіть дату',
-  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `Оберіть час, обраний час  ${formattedTime ?? utils.format(value, 'fullTime')}` : 'Оберіть час',
+  openDatePickerDialogue: formattedDate => formattedDate ? `Оберіть дату, обрана дата  ${formattedDate}` : 'Оберіть дату',
+  openTimePickerDialogue: formattedTime => formattedTime ? `Оберіть час, обраний час  ${formattedTime}` : 'Оберіть час',
   fieldClearLabel: 'Очистити дані',
   // Table labels
   timeTableLabel: 'оберіть час',

package/node/locales/urPK.js

@@ -38,7 +38,7 @@ const urPKPickers = {
   timePickerToolbarTitle: 'وقت منتخب کریں',
   dateRangePickerToolbarTitle: 'تاریخوں کی رینج منتخب کریں',
   // Clock labels
-  clockLabelText: (view, time, utils, formattedTime) => `${timeViews[view]} منتخب کریں ${!formattedTime && (time === null || !utils.isValid(time)) ? 'کوئی وقت منتخب نہیں' : `منتخب وقت ہے ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, formattedTime) => `${timeViews[view]} منتخب کریں ${!formattedTime ? 'کوئی وقت منتخب نہیں' : `منتخب وقت ہے ${formattedTime}`}`,
   hoursClockNumberText: hours => `${hours} گھنٹے`,
   minutesClockNumberText: minutes => `${minutes} منٹ`,
   secondsClockNumberText: seconds => `${seconds} سیکنڈ`,
@@ -50,8 +50,8 @@ const urPKPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `ہفتہ ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `تاریخ منتخب کریں، منتخب شدہ تاریخ ہے ${formattedDate ?? utils.format(value, 'fullDate')}` : 'تاریخ منتخب کریں',
-  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `وقت منتخب کریں، منتخب شدہ وقت ہے ${formattedTime ?? utils.format(value, 'fullTime')}` : 'وقت منتخب کریں',
+  openDatePickerDialogue: formattedDate => formattedDate ? `تاریخ منتخب کریں، منتخب شدہ تاریخ ہے ${formattedDate}` : 'تاریخ منتخب کریں',
+  openTimePickerDialogue: formattedTime => formattedTime ? `وقت منتخب کریں، منتخب شدہ وقت ہے ${formattedTime}` : 'وقت منتخب کریں',
   // fieldClearLabel: 'Clear',
 
   // Table labels

package/node/locales/utils/getPickersLocalization.js

@@ -28,7 +28,7 @@ const buildGetOpenDialogAriaText = params => {
   return value => {
     const formattedValue = value !== null && utils.isValid(value) ? utils.format(value, formatKey) : null;
     const translation = propsTranslation ?? contextTranslation;
-    return translation(value, utils, formattedValue);
+    return translation(formattedValue);
   };
 };
 exports.buildGetOpenDialogAriaText = buildGetOpenDialogAriaText;

package/node/locales/viVN.js

@@ -37,7 +37,7 @@ const viVNPickers = {
   timePickerToolbarTitle: 'Chọn giờ',
   dateRangePickerToolbarTitle: 'Chọn khoảng ngày',
   // Clock labels
-  clockLabelText: (view, time, utils, formattedTime) => `Chọn ${views[view]}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Không có giờ được chọn' : `Giờ được chọn là ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, formattedTime) => `Chọn ${views[view]}. ${!formattedTime ? 'Không có giờ được chọn' : `Giờ được chọn là ${formattedTime}`}`,
   hoursClockNumberText: hours => `${hours} giờ`,
   minutesClockNumberText: minutes => `${minutes} phút`,
   secondsClockNumberText: seconds => `${seconds} giây`,
@@ -49,8 +49,8 @@ const viVNPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `Tuần ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `Chọn ngày, ngày đã chọn là ${formattedDate ?? utils.format(value, 'fullDate')}` : 'Chọn ngày',
-  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `Chọn giờ, giờ đã chọn là ${formattedTime ?? utils.format(value, 'fullTime')}` : 'Chọn giờ',
+  openDatePickerDialogue: formattedDate => formattedDate ? `Chọn ngày, ngày đã chọn là ${formattedDate}` : 'Chọn ngày',
+  openTimePickerDialogue: formattedTime => formattedTime ? `Chọn giờ, giờ đã chọn là ${formattedTime}` : 'Chọn giờ',
   fieldClearLabel: 'Xóa giá trị',
   // Table labels
   timeTableLabel: 'chọn giờ',

package/node/locales/zhCN.js

@@ -37,7 +37,7 @@ const zhCNPickers = {
   timePickerToolbarTitle: '选择时间',
   dateRangePickerToolbarTitle: '选择时间范围',
   // Clock labels
-  clockLabelText: (view, time, utils, formattedTime) => `选择 ${views[view]}. ${!formattedTime && (time === null || !utils.isValid(time)) ? '未选择时间' : `已选择${formattedTime ?? utils.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, formattedTime) => `选择 ${views[view]}. ${!formattedTime ? '未选择时间' : `已选择${formattedTime}`}`,
   hoursClockNumberText: hours => `${hours}小时`,
   minutesClockNumberText: minutes => `${minutes}分钟`,
   secondsClockNumberText: seconds => `${seconds}秒`,
@@ -49,8 +49,8 @@ const zhCNPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `第${weekNumber}周`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `选择日期，已选择${formattedDate ?? utils.format(value, 'fullDate')}` : '选择日期',
-  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `选择时间，已选择${formattedTime ?? utils.format(value, 'fullTime')}` : '选择时间',
+  openDatePickerDialogue: formattedDate => formattedDate ? `选择日期，已选择${formattedDate}` : '选择日期',
+  openTimePickerDialogue: formattedTime => formattedTime ? `选择时间，已选择${formattedTime}` : '选择时间',
   fieldClearLabel: '清除',
   // Table labels
   timeTableLabel: '选择时间',

package/node/locales/zhHK.js

@@ -37,7 +37,7 @@ const zhHKPickers = {
   timePickerToolbarTitle: '選擇時間',
   dateRangePickerToolbarTitle: '選擇時間範圍',
   // Clock labels
-  clockLabelText: (view, time, utils, formattedTime) => `選擇 ${views[view]}. ${!formattedTime && (time === null || !utils.isValid(time)) ? '未選擇時間' : `已選擇${formattedTime ?? utils.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, formattedTime) => `選擇 ${views[view]}. ${!formattedTime ? '未選擇時間' : `已選擇${formattedTime}`}`,
   hoursClockNumberText: hours => `${hours}小時`,
   minutesClockNumberText: minutes => `${minutes}分鐘`,
   secondsClockNumberText: seconds => `${seconds}秒`,
@@ -49,8 +49,8 @@ const zhHKPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `第${weekNumber}週`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `選擇日期，已選擇${formattedDate ?? utils.format(value, 'fullDate')}` : '選擇日期',
-  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `選擇時間，已選擇${formattedTime ?? utils.format(value, 'fullTime')}` : '選擇時間',
+  openDatePickerDialogue: formattedDate => formattedDate ? `選擇日期，已選擇${formattedDate}` : '選擇日期',
+  openTimePickerDialogue: formattedTime => formattedTime ? `選擇時間，已選擇${formattedTime}` : '選擇時間',
   fieldClearLabel: '清除',
   // Table labels
   timeTableLabel: '選擇時間',

package/node/validation/useValidation.js

@@ -12,13 +12,12 @@ var _useEventCallback = _interopRequireDefault(require("@mui/utils/useEventCallb
 var _useUtils = require("../internals/hooks/useUtils");
 /**
  * Utility hook to check if a given value is valid based on the provided validation props.
- * @template TDate
  * @template TValue The value type. It will be either the same type as `value` or `null`. It can be in `[start, end]` format in case of range value.
  * @template TError The validation error type. It will be either `string` or a `null`. It can be in `[start, end]` format in case of range value.
- * @param {UseValidationOptions<TValue, TDate, TError, TValidationProps>} options The options to configure the hook.
+ * @param {UseValidationOptions<TValue, TError, TValidationProps>} options The options to configure the hook.
  * @param {TValue} options.value The value to validate.
  * @param {PickersTimezone} options.timezone The timezone to use for the validation.
- * @param {Validator<TValue, TDate, TError, TValidationProps>} options.validator The validator function to use.
+ * @param {Validator<TValue, TError, TValidationProps>} options.validator The validator function to use.
  * @param {TValidationProps} options.props The validation props, they differ depending on the component.
  * @param {(error: TError, value: TValue) => void} options.onError Callback fired when the error associated with the current value changes.
  */

package/node/validation/validateDate.js

@@ -6,6 +6,10 @@ Object.defineProperty(exports, "__esModule", {
 exports.validateDate = void 0;
 var _dateUtils = require("../internals/utils/date-utils");
 var _valueManagers = require("../internals/utils/valueManagers");
+/**
+ * Validation props used by the Date Picker, Date Field and Date Calendar components.
+ */
+
 const validateDate = ({
   props,
   value,

package/node/validation/validateDateTime.js

@@ -7,6 +7,10 @@ exports.validateDateTime = void 0;
 var _validateDate = require("./validateDate");
 var _validateTime = require("./validateTime");
 var _valueManagers = require("../internals/utils/valueManagers");
+/**
+ * Validation props used by the Date Time Picker and Date Time Field components.
+ */
+
 const validateDateTime = ({
   adapter,
   value,

package/node/validation/validateTime.js

@@ -6,6 +6,10 @@ Object.defineProperty(exports, "__esModule", {
 exports.validateTime = void 0;
 var _timeUtils = require("../internals/utils/time-utils");
 var _valueManagers = require("../internals/utils/valueManagers");
+/**
+ * Validation props used by the Time Picker, Time Field and Clock components.
+ */
+
 const validateTime = ({
   adapter,
   value,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-date-pickers",
-  "version": "7.22.2",
+  "version": "8.0.0-alpha.0",
   "description": "The community edition of the Date and Time Picker components (MUI X).",
   "author": "MUI Team",
   "main": "./node/index.js",
@@ -35,13 +35,13 @@
     "directory": "packages/x-date-pickers"
   },
   "dependencies": {
-    "@babel/runtime": "^7.25.7",
+    "@babel/runtime": "^7.26.0",
     "@mui/utils": "^5.16.6 || ^6.0.0",
     "@types/react-transition-group": "^4.4.11",
     "clsx": "^2.1.1",
     "prop-types": "^15.8.1",
     "react-transition-group": "^4.4.5",
-    "@mui/x-internals": "7.21.0"
+    "@mui/x-internals": "8.0.0-alpha.0"
   },
   "peerDependencies": {
     "@emotion/react": "^11.9.0",

package/themeAugmentation/props.d.ts

@@ -17,7 +17,7 @@ import { PickerPopperProps } from '../internals/components/PickersPopper';
 import { PickersToolbarProps } from '../internals/components/PickersToolbar';
 import { PickersToolbarButtonProps } from '../internals/components/PickersToolbarButton';
 import { ExportedPickersToolbarTextProps } from '../internals/components/PickersToolbarText';
-import { DateOrTimeView, PickerValidDate } from '../models';
+import { DateOrTimeView } from '../models';
 
 import { DatePickerProps } from '../DatePicker';
 import { ExportedDatePickerToolbarProps } from '../DatePicker/DatePickerToolbar';
@@ -54,25 +54,25 @@ import {
 import { PickersSectionListProps } from '../PickersSectionList';
 
 export interface PickersComponentsPropsList {
-  MuiClock: ClockProps<PickerValidDate>;
+  MuiClock: ClockProps;
   MuiClockNumber: ClockNumberProps;
   MuiClockPointer: ClockPointerProps;
-  MuiDateCalendar: DateCalendarProps<PickerValidDate>;
-  MuiDateField: DateFieldProps<PickerValidDate, any>;
+  MuiDateCalendar: DateCalendarProps;
+  MuiDateField: DateFieldProps<any>;
   MuiDatePickerToolbar: ExportedDatePickerToolbarProps;
-  MuiDateTimeField: DateTimeFieldProps<PickerValidDate, any>;
+  MuiDateTimeField: DateTimeFieldProps<any>;
   MuiDateTimePickerTabs: DateTimePickerTabsProps;
   MuiDateTimePickerToolbar: ExportedDateTimePickerToolbarProps;
-  MuiDayCalendar: DayCalendarProps<PickerValidDate>;
+  MuiDayCalendar: DayCalendarProps;
   MuiDayCalendarSkeleton: DayCalendarSkeletonProps;
-  MuiDigitalClock: ExportedDigitalClockProps<PickerValidDate>;
-  MuiLocalizationProvider: LocalizationProviderProps<PickerValidDate, unknown>;
-  MuiMonthCalendar: MonthCalendarProps<PickerValidDate>;
-  MuiMultiSectionDigitalClock: MultiSectionDigitalClockProps<PickerValidDate>;
+  MuiDigitalClock: ExportedDigitalClockProps;
+  MuiLocalizationProvider: LocalizationProviderProps<unknown>;
+  MuiMonthCalendar: MonthCalendarProps;
+  MuiMultiSectionDigitalClock: MultiSectionDigitalClockProps;
   MuiMultiSectionDigitalClockSection: ExportedMultiSectionDigitalClockSectionProps;
   MuiPickersArrowSwitcher: ExportedPickersArrowSwitcherProps;
-  MuiPickersCalendarHeader: ExportedPickersCalendarHeaderProps<PickerValidDate>;
-  MuiPickersDay: PickersDayProps<PickerValidDate>;
+  MuiPickersCalendarHeader: ExportedPickersCalendarHeaderProps;
+  MuiPickersDay: PickersDayProps;
   MuiPickersFadeTransitionGroup: PickersFadeTransitionGroupProps;
   MuiPickersMonth: ExportedPickersMonthProps;
   MuiPickersPopper: PickerPopperProps;
@@ -80,30 +80,30 @@ export interface PickersComponentsPropsList {
   MuiPickersToolbar: PickersToolbarProps<unknown, DateOrTimeView>;
   MuiPickersToolbarButton: PickersToolbarButtonProps;
   MuiPickersToolbarText: ExportedPickersToolbarTextProps;
-  MuiPickersLayout: PickersLayoutProps<unknown, PickerValidDate, DateOrTimeView>;
+  MuiPickersLayout: PickersLayoutProps<unknown, DateOrTimeView>;
   MuiPickersYear: ExportedPickersYearProps;
-  MuiTimeClock: TimeClockProps<PickerValidDate>;
-  MuiTimeField: TimeFieldProps<PickerValidDate, any>;
+  MuiTimeClock: TimeClockProps;
+  MuiTimeField: TimeFieldProps<any>;
   MuiTimePickerToolbar: ExportedTimePickerToolbarProps;
-  MuiYearCalendar: YearCalendarProps<PickerValidDate>;
+  MuiYearCalendar: YearCalendarProps;
 
   // Date Pickers
-  MuiDatePicker: DatePickerProps<PickerValidDate>;
-  MuiDesktopDatePicker: DesktopDatePickerProps<PickerValidDate>;
-  MuiMobileDatePicker: MobileDatePickerProps<PickerValidDate>;
-  MuiStaticDatePicker: StaticDatePickerProps<PickerValidDate>;
+  MuiDatePicker: DatePickerProps;
+  MuiDesktopDatePicker: DesktopDatePickerProps;
+  MuiMobileDatePicker: MobileDatePickerProps;
+  MuiStaticDatePicker: StaticDatePickerProps;
 
   // Time Pickers
-  MuiTimePicker: TimePickerProps<PickerValidDate>;
-  MuiDesktopTimePicker: DesktopTimePickerProps<PickerValidDate>;
-  MuiMobileTimePicker: MobileTimePickerProps<PickerValidDate>;
-  MuiStaticTimePicker: StaticTimePickerProps<PickerValidDate>;
+  MuiTimePicker: TimePickerProps;
+  MuiDesktopTimePicker: DesktopTimePickerProps;
+  MuiMobileTimePicker: MobileTimePickerProps;
+  MuiStaticTimePicker: StaticTimePickerProps;
 
   // Date Time Pickers
-  MuiDateTimePicker: DateTimePickerProps<PickerValidDate>;
-  MuiDesktopDateTimePicker: DesktopDateTimePickerProps<PickerValidDate>;
-  MuiMobileDateTimePicker: MobileDateTimePickerProps<PickerValidDate>;
-  MuiStaticDateTimePicker: StaticDateTimePickerProps<PickerValidDate>;
+  MuiDateTimePicker: DateTimePickerProps;
+  MuiDesktopDateTimePicker: DesktopDateTimePickerProps;
+  MuiMobileDateTimePicker: MobileDateTimePickerProps;
+  MuiStaticDateTimePicker: StaticDateTimePickerProps;
 
   // V7 Picker's TextField
   MuiPickersTextField: PickersTextFieldProps;

package/timeViewRenderers/timeViewRenderers.d.ts

@@ -1,16 +1,16 @@
 import * as React from 'react';
 import { TimeClockProps } from '../TimeClock';
-import { PickerValidDate, TimeView } from '../models';
+import { TimeView } from '../models';
 import { DigitalClockProps } from '../DigitalClock';
-import { BaseClockProps } from '../internals/models/props/clock';
+import { BaseClockProps } from '../internals/models/props/time';
 import { MultiSectionDigitalClockProps } from '../MultiSectionDigitalClock';
 import { TimeViewWithMeridiem } from '../internals/models';
 import type { TimePickerProps } from '../TimePicker/TimePicker.types';
-export type TimeViewRendererProps<TView extends TimeViewWithMeridiem, TComponentProps extends BaseClockProps<any, TView>> = Omit<TComponentProps, 'views' | 'openTo' | 'view' | 'onViewChange'> & {
+export type TimeViewRendererProps<TView extends TimeViewWithMeridiem, TComponentProps extends BaseClockProps<TView>> = Omit<TComponentProps, 'views' | 'openTo' | 'view' | 'onViewChange'> & {
     view: TView;
     onViewChange?: (view: TView) => void;
     views: readonly TView[];
 };
-export declare const renderTimeViewClock: <TDate extends PickerValidDate>({ view, onViewChange, focusedView, onFocusedViewChange, views, value, defaultValue, referenceDate, onChange, className, classes, disableFuture, disablePast, minTime, maxTime, shouldDisableTime, minutesStep, ampm, ampmInClock, slots, slotProps, readOnly, disabled, sx, autoFocus, showViewSwitcher, disableIgnoringDatePartForTimeValidation, timezone, }: TimeViewRendererProps<TimeView, TimeClockProps<TDate, TimeView>>) => React.JSX.Element;
-export declare const renderDigitalClockTimeView: <TDate extends PickerValidDate>({ view, onViewChange, focusedView, onFocusedViewChange, views, value, defaultValue, referenceDate, onChange, className, classes, disableFuture, disablePast, minTime, maxTime, shouldDisableTime, minutesStep, ampm, slots, slotProps, readOnly, disabled, sx, autoFocus, disableIgnoringDatePartForTimeValidation, timeSteps, skipDisabled, timezone, }: TimeViewRendererProps<Extract<TimeView, "hours">, Omit<DigitalClockProps<TDate>, "timeStep"> & Pick<TimePickerProps<TDate>, "timeSteps">>) => React.JSX.Element;
-export declare const renderMultiSectionDigitalClockTimeView: <TDate extends PickerValidDate>({ view, onViewChange, focusedView, onFocusedViewChange, views, value, defaultValue, referenceDate, onChange, className, classes, disableFuture, disablePast, minTime, maxTime, shouldDisableTime, minutesStep, ampm, slots, slotProps, readOnly, disabled, sx, autoFocus, disableIgnoringDatePartForTimeValidation, timeSteps, skipDisabled, timezone, }: TimeViewRendererProps<TimeViewWithMeridiem, MultiSectionDigitalClockProps<TDate>>) => React.JSX.Element;
+export declare const renderTimeViewClock: ({ view, onViewChange, focusedView, onFocusedViewChange, views, value, defaultValue, referenceDate, onChange, className, classes, disableFuture, disablePast, minTime, maxTime, shouldDisableTime, minutesStep, ampm, ampmInClock, slots, slotProps, readOnly, disabled, sx, autoFocus, showViewSwitcher, disableIgnoringDatePartForTimeValidation, timezone, }: TimeViewRendererProps<TimeView, TimeClockProps<TimeView>>) => React.JSX.Element;
+export declare const renderDigitalClockTimeView: ({ view, onViewChange, focusedView, onFocusedViewChange, views, value, defaultValue, referenceDate, onChange, className, classes, disableFuture, disablePast, minTime, maxTime, shouldDisableTime, minutesStep, ampm, slots, slotProps, readOnly, disabled, sx, autoFocus, disableIgnoringDatePartForTimeValidation, timeSteps, skipDisabled, timezone, }: TimeViewRendererProps<Extract<TimeView, "hours">, Omit<DigitalClockProps, "timeStep"> & Pick<TimePickerProps, "timeSteps">>) => React.JSX.Element;
+export declare const renderMultiSectionDigitalClockTimeView: ({ view, onViewChange, focusedView, onFocusedViewChange, views, value, defaultValue, referenceDate, onChange, className, classes, disableFuture, disablePast, minTime, maxTime, shouldDisableTime, minutesStep, ampm, slots, slotProps, readOnly, disabled, sx, autoFocus, disableIgnoringDatePartForTimeValidation, timeSteps, skipDisabled, timezone, }: TimeViewRendererProps<TimeViewWithMeridiem, MultiSectionDigitalClockProps>) => React.JSX.Element;

package/validation/extractValidationProps.d.ts

@@ -1,11 +1,11 @@
 import { BaseDateValidationProps, BaseTimeValidationProps, DateTimeValidationProps, DayValidationProps, MonthValidationProps, TimeValidationProps, YearValidationProps } from '../internals/models/validation';
-export declare const DATE_VALIDATION_PROP_NAMES: (keyof BaseDateValidationProps<any> | keyof YearValidationProps<any> | keyof MonthValidationProps<any> | keyof DayValidationProps<any>)[];
-export declare const TIME_VALIDATION_PROP_NAMES: (keyof BaseTimeValidationProps | keyof TimeValidationProps<any> | 'ampm')[];
-export declare const DATE_TIME_VALIDATION_PROP_NAMES: (keyof DateTimeValidationProps<any>)[];
+export declare const DATE_VALIDATION_PROP_NAMES: (keyof BaseDateValidationProps | keyof YearValidationProps | keyof MonthValidationProps | keyof DayValidationProps)[];
+export declare const TIME_VALIDATION_PROP_NAMES: (keyof BaseTimeValidationProps | keyof TimeValidationProps | 'ampm')[];
+export declare const DATE_TIME_VALIDATION_PROP_NAMES: (keyof DateTimeValidationProps)[];
 /**
  * Extract the validation props for the props received by a component.
  * Limit the risk of forgetting some of them and reduce the bundle size.
  */
 export declare const extractValidationProps: <Props extends {
     [key: string]: any;
-}>(props: Props) => Pick<Props, "minDate" | "maxDate" | "ampm" | "disableFuture" | "disablePast" | "minutesStep" | "shouldDisableDate" | "shouldDisableMonth" | "shouldDisableYear" | "minTime" | "maxTime" | "shouldDisableTime" | "disableIgnoringDatePartForTimeValidation" | "minDateTime" | "maxDateTime">;
+}>(props: Props) => Pick<Props, "ampm" | "disableFuture" | "disablePast" | "maxDate" | "minDate" | "minutesStep" | "shouldDisableDate" | "shouldDisableMonth" | "shouldDisableYear" | "minTime" | "maxTime" | "shouldDisableTime" | "disableIgnoringDatePartForTimeValidation" | "minDateTime" | "maxDateTime">;

package/validation/useValidation.d.ts

@@ -1,16 +1,16 @@
 import { MuiPickersAdapterContextValue } from '../LocalizationProvider/LocalizationProvider';
-import { OnErrorProps, PickersTimezone, PickerValidDate } from '../models';
+import { OnErrorProps, PickersTimezone } from '../models';
 import type { PickerValueManager } from '../internals/hooks/usePicker';
-export type Validator<TValue, TDate extends PickerValidDate, TError, TValidationProps> = {
+export type Validator<TValue, TError, TValidationProps> = {
     (params: {
-        adapter: MuiPickersAdapterContextValue<TDate>;
+        adapter: MuiPickersAdapterContextValue;
         value: TValue;
         timezone: PickersTimezone;
         props: TValidationProps;
     }): TError;
-    valueManager: PickerValueManager<TValue, TDate, any>;
+    valueManager: PickerValueManager<TValue, any>;
 };
-interface UseValidationOptions<TValue, TDate extends PickerValidDate, TError, TValidationProps extends {}> extends OnErrorProps<TValue, TError> {
+interface UseValidationOptions<TValue, TError, TValidationProps extends {}> extends OnErrorProps<TValue, TError> {
     /**
      * The value to validate.
      */
@@ -25,7 +25,7 @@ interface UseValidationOptions<TValue, TDate extends PickerValidDate, TError, TV
      * It is recommended to only use the validator exported by the MUI X packages,
      * otherwise you may have inconsistent behaviors between the field and the views.
      */
-    validator: Validator<TValue, TDate, TError, TValidationProps>;
+    validator: Validator<TValue, TError, TValidationProps>;
     /**
      * The validation props, they differ depending on the component.
      * For example, the `validateTime` function supports `minTime`, `maxTime`, etc.
@@ -54,15 +54,14 @@ interface UseValidationReturnValue<TValue, TError> {
 }
 /**
  * Utility hook to check if a given value is valid based on the provided validation props.
- * @template TDate
  * @template TValue The value type. It will be either the same type as `value` or `null`. It can be in `[start, end]` format in case of range value.
  * @template TError The validation error type. It will be either `string` or a `null`. It can be in `[start, end]` format in case of range value.
- * @param {UseValidationOptions<TValue, TDate, TError, TValidationProps>} options The options to configure the hook.
+ * @param {UseValidationOptions<TValue, TError, TValidationProps>} options The options to configure the hook.
  * @param {TValue} options.value The value to validate.
  * @param {PickersTimezone} options.timezone The timezone to use for the validation.
- * @param {Validator<TValue, TDate, TError, TValidationProps>} options.validator The validator function to use.
+ * @param {Validator<TValue, TError, TValidationProps>} options.validator The validator function to use.
  * @param {TValidationProps} options.props The validation props, they differ depending on the component.
  * @param {(error: TError, value: TValue) => void} options.onError Callback fired when the error associated with the current value changes.
  */
-export declare function useValidation<TValue, TDate extends PickerValidDate, TError, TValidationProps extends {}>(options: UseValidationOptions<TValue, TDate, TError, TValidationProps>): UseValidationReturnValue<TValue, TError>;
+export declare function useValidation<TValue, TError, TValidationProps extends {}>(options: UseValidationOptions<TValue, TError, TValidationProps>): UseValidationReturnValue<TValue, TError>;
 export {};

package/validation/useValidation.js

@@ -5,13 +5,12 @@ import useEventCallback from '@mui/utils/useEventCallback';
 import { useLocalizationContext } from "../internals/hooks/useUtils.js";
 /**
  * Utility hook to check if a given value is valid based on the provided validation props.
- * @template TDate
  * @template TValue The value type. It will be either the same type as `value` or `null`. It can be in `[start, end]` format in case of range value.
  * @template TError The validation error type. It will be either `string` or a `null`. It can be in `[start, end]` format in case of range value.
- * @param {UseValidationOptions<TValue, TDate, TError, TValidationProps>} options The options to configure the hook.
+ * @param {UseValidationOptions<TValue, TError, TValidationProps>} options The options to configure the hook.
  * @param {TValue} options.value The value to validate.
  * @param {PickersTimezone} options.timezone The timezone to use for the validation.
- * @param {Validator<TValue, TDate, TError, TValidationProps>} options.validator The validator function to use.
+ * @param {Validator<TValue, TError, TValidationProps>} options.validator The validator function to use.
  * @param {TValidationProps} options.props The validation props, they differ depending on the component.
  * @param {(error: TError, value: TValue) => void} options.onError Callback fired when the error associated with the current value changes.
  */

package/validation/validateDate.d.ts

@@ -1,6 +1,11 @@
 import { Validator } from './useValidation';
 import { BaseDateValidationProps, DayValidationProps, MonthValidationProps, YearValidationProps } from '../internals/models/validation';
 import { DateValidationError, PickerValidDate } from '../models';
-export interface ValidateDateProps<TDate extends PickerValidDate> extends DayValidationProps<TDate>, MonthValidationProps<TDate>, YearValidationProps<TDate>, Required<BaseDateValidationProps<TDate>> {
+/**
+ * Validation props used by the Date Picker, Date Field and Date Calendar components.
+ */
+export interface ExportedValidateDateProps extends DayValidationProps, MonthValidationProps, YearValidationProps, BaseDateValidationProps {
 }
-export declare const validateDate: Validator<any | null, any, DateValidationError, ValidateDateProps<any>>;
+export interface ValidateDateProps extends DayValidationProps, MonthValidationProps, YearValidationProps, Required<BaseDateValidationProps> {
+}
+export declare const validateDate: Validator<PickerValidDate | null, DateValidationError, ValidateDateProps>;

package/validation/validateDate.js

@@ -1,5 +1,10 @@
 import { applyDefaultDate } from "../internals/utils/date-utils.js";
 import { singleItemValueManager } from "../internals/utils/valueManagers.js";
+
+/**
+ * Validation props used by the Date Picker, Date Field and Date Calendar components.
+ */
+
 export const validateDate = ({
   props,
   value,

package/validation/validateDateTime.d.ts

@@ -1,7 +1,13 @@
 import { Validator } from './useValidation';
-import { ValidateDateProps } from './validateDate';
-import { ValidateTimeProps } from './validateTime';
+import { ExportedValidateDateProps, ValidateDateProps } from './validateDate';
+import { ExportedValidateTimeProps, ValidateTimeProps } from './validateTime';
 import { DateTimeValidationError, PickerValidDate } from '../models';
-export interface ValidateDateTimeProps<TDate extends PickerValidDate> extends ValidateDateProps<TDate>, ValidateTimeProps<TDate> {
+import { DateTimeValidationProps } from '../internals/models/validation';
+/**
+ * Validation props used by the Date Time Picker and Date Time Field components.
+ */
+export interface ExportedValidateDateTimeProps extends ExportedValidateDateProps, ExportedValidateTimeProps, DateTimeValidationProps {
 }
-export declare const validateDateTime: Validator<any | null, any, DateTimeValidationError, ValidateDateTimeProps<any>>;
+export interface ValidateDateTimeProps extends ValidateDateProps, ValidateTimeProps {
+}
+export declare const validateDateTime: Validator<PickerValidDate | null, DateTimeValidationError, ValidateDateTimeProps>;

package/validation/validateDateTime.js

@@ -1,6 +1,11 @@
 import { validateDate } from "./validateDate.js";
 import { validateTime } from "./validateTime.js";
 import { singleItemValueManager } from "../internals/utils/valueManagers.js";
+
+/**
+ * Validation props used by the Date Time Picker and Date Time Field components.
+ */
+
 export const validateDateTime = ({
   adapter,
   value,