@mui/x-date-pickers 7.15.0 → 7.17.0

package/modern/internals/utils/date-utils.js

@@ -1,4 +1,4 @@
-import { areViewsEqual } from './views';
+import { areViewsEqual } from "./views.js";
 export const mergeDateAndTime = (utils, dateParam, timeParam) => {
   let mergedDate = dateParam;
   mergedDate = utils.setHours(mergedDate, utils.getHours(timeParam));

package/modern/internals/utils/getDefaultReferenceDate.js

@@ -1,5 +1,5 @@
-import { createIsAfterIgnoreDatePart } from './time-utils';
-import { mergeDateAndTime, getTodayDate } from './date-utils';
+import { createIsAfterIgnoreDatePart } from "./time-utils.js";
+import { mergeDateAndTime, getTodayDate } from "./date-utils.js";
 export const SECTION_TYPE_GRANULARITY = {
   year: 1,
   month: 2,

package/modern/internals/utils/time-utils.js

@@ -1,4 +1,4 @@
-import { areViewsEqual } from './views';
+import { areViewsEqual } from "./views.js";
 const timeViews = ['hours', 'minutes', 'seconds'];
 export const isTimeView = view => timeViews.includes(view);
 export const isInternalTimeView = view => timeViews.includes(view) || view === 'meridiem';

package/modern/internals/utils/valueManagers.js

@@ -1,8 +1,8 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 const _excluded = ["value", "referenceDate"];
-import { areDatesEqual, getTodayDate, replaceInvalidDateByNull } from './date-utils';
-import { getDefaultReferenceDate } from './getDefaultReferenceDate';
-import { createDateStrForV7HiddenInputFromSections, createDateStrForV6InputFromSections } from '../hooks/useField/useField.utils';
+import { areDatesEqual, getTodayDate, replaceInvalidDateByNull } from "./date-utils.js";
+import { getDefaultReferenceDate } from "./getDefaultReferenceDate.js";
+import { createDateStrForV7HiddenInputFromSections, createDateStrForV6InputFromSections } from "../hooks/useField/useField.utils.js";
 export const singleItemValueManager = {
   emptyValue: null,
   getTodayValue: getTodayDate,

package/modern/locales/beBY.js

@@ -1,4 +1,4 @@
-import { getPickersLocalization } from './utils/getPickersLocalization';
+import { getPickersLocalization } from "./utils/getPickersLocalization.js";
 const views = {
   // maps TimeView to its translation
   hours: 'гадзіны',
@@ -33,7 +33,7 @@ const beBYPickers = {
   timePickerToolbarTitle: 'Абраць час',
   dateRangePickerToolbarTitle: 'Абраць каляндарны перыяд',
   // Clock labels
-  clockLabelText: (view, time, adapter) => `Абярыце ${views[view]}. ${time === null ? 'Час не абраны' : `Абраны час ${adapter.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, time, utils, formattedTime) => `Абярыце ${views[view]}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Час не абраны' : `Абраны час ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
   hoursClockNumberText: hours => `${hours} гадзін`,
   minutesClockNumberText: minutes => `${minutes} хвілін`,
   secondsClockNumberText: seconds => `${seconds} секунд`,
@@ -45,9 +45,9 @@ const beBYPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `Тыдзень ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Абраць дату, абрана дата  ${utils.format(value, 'fullDate')}` : 'Абраць дату',
-  openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Абраць час, абрыны час  ${utils.format(value, 'fullTime')}` : 'Абраць час',
-  // fieldClearLabel: 'Clear value',
+  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')}` : 'Абраць час',
+  // fieldClearLabel: 'Clear',
 
   // Table labels
   timeTableLabel: 'абраць час',

package/modern/locales/caES.js

@@ -1,4 +1,4 @@
-import { getPickersLocalization } from './utils/getPickersLocalization';
+import { getPickersLocalization } from "./utils/getPickersLocalization.js";
 const views = {
   hours: 'Hores',
   minutes: 'Minuts',
@@ -31,7 +31,7 @@ const caESPickers = {
   timePickerToolbarTitle: 'Seleccionar hora',
   dateRangePickerToolbarTitle: 'Seleccionar rang de dates',
   // Clock labels
-  clockLabelText: (view, time, adapter) => `Selecciona ${views[view]}. ${time === null ? 'Hora no seleccionada' : `L'hora seleccionada és ${adapter.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, time, utils, formattedTime) => `Selecciona ${views[view]}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Hora no seleccionada' : `L'hora seleccionada és ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
   hoursClockNumberText: hours => `${hours} hores`,
   minutesClockNumberText: minutes => `${minutes} minuts`,
   secondsClockNumberText: seconds => `${seconds} segons`,
@@ -43,8 +43,8 @@ const caESPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `Setmana ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Tria la data, la data triada és ${utils.format(value, 'fullDate')}` : 'Tria la data',
-  openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Tria l'hora, l'hora triada és ${utils.format(value, 'fullTime')}` : "Tria l'hora",
+  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `Tria la data, la data triada és ${formattedDate ?? utils.format(value, 'fullDate')}` : 'Tria la data',
+  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `Tria l'hora, l'hora triada és ${formattedTime ?? utils.format(value, 'fullTime')}` : "Tria l'hora",
   fieldClearLabel: 'Netega el valor',
   // Table labels
   timeTableLabel: 'tria la data',

package/modern/locales/csCZ.js

@@ -1,4 +1,4 @@
-import { getPickersLocalization } from './utils/getPickersLocalization';
+import { getPickersLocalization } from "./utils/getPickersLocalization.js";
 // maps TimeView to its translation
 const timeViews = {
   hours: 'Hodiny',
@@ -33,7 +33,7 @@ const csCZPickers = {
   timePickerToolbarTitle: 'Vyberte čas',
   dateRangePickerToolbarTitle: 'Vyberete rozmezí dat',
   // Clock labels
-  clockLabelText: (view, time, adapter) => `${timeViews[view] ?? view} vybrány. ${time === null ? 'Není vybrán čas' : `Vybraný čas je ${adapter.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, time, utils, formattedTime) => `${timeViews[view] ?? view} vybrány. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Není vybrán čas' : `Vybraný čas je ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
   hoursClockNumberText: hours => `${hours} hodin`,
   minutesClockNumberText: minutes => `${minutes} minut`,
   secondsClockNumberText: seconds => `${seconds} sekund`,
@@ -45,9 +45,9 @@ const csCZPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `${weekNumber} týden v roce`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Vyberte datum, vybrané datum je ${utils.format(value, 'fullDate')}` : 'Vyberte datum',
-  openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Vyberte čas, vybraný čas je ${utils.format(value, 'fullTime')}` : 'Vyberte čas',
-  // fieldClearLabel: 'Clear value',
+  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `Vyberte datum, vybrané datum je ${formattedDate ?? utils.format(value, 'fullDate')}` : 'Vyberte datum',
+  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `Vyberte čas, vybraný čas je ${formattedTime ?? utils.format(value, 'fullTime')}` : 'Vyberte čas',
+  // fieldClearLabel: 'Clear',
 
   // Table labels
   timeTableLabel: 'vyberte čas',

package/modern/locales/daDK.js

@@ -1,4 +1,4 @@
-import { getPickersLocalization } from './utils/getPickersLocalization';
+import { getPickersLocalization } from "./utils/getPickersLocalization.js";
 // maps TimeView to its translation
 const timeViews = {
   hours: 'Timer',
@@ -32,7 +32,7 @@ const daDKPickers = {
   timePickerToolbarTitle: 'Vælg tidspunkt',
   dateRangePickerToolbarTitle: 'Vælg datointerval',
   // Clock labels
-  clockLabelText: (view, time, adapter) => `Vælg ${timeViews[view] ?? view}. ${time === null ? 'Intet tidspunkt valgt' : `Valgte tidspunkt er ${adapter.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, time, utils, formattedTime) => `Vælg ${timeViews[view] ?? view}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Intet tidspunkt valgt' : `Valgte tidspunkt er ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
   hoursClockNumberText: hours => `${hours} timer`,
   minutesClockNumberText: minutes => `${minutes} minutter`,
   secondsClockNumberText: seconds => `${seconds} sekunder`,
@@ -44,8 +44,8 @@ const daDKPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `Uge ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Vælg dato, valgte dato er ${utils.format(value, 'fullDate')}` : 'Vælg dato',
-  openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Vælg tidspunkt, valgte tidspunkt er ${utils.format(value, 'fullTime')}` : 'Vælg tidspunkt',
+  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `Vælg dato, valgte dato er ${formattedDate ?? utils.format(value, 'fullDate')}` : 'Vælg dato',
+  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `Vælg tidspunkt, valgte tidspunkt er ${formattedTime ?? utils.format(value, 'fullTime')}` : 'Vælg tidspunkt',
   fieldClearLabel: 'ryd felt',
   // Table labels
   timeTableLabel: 'vælg tidspunkt',

package/modern/locales/deDE.js

@@ -1,4 +1,4 @@
-import { getPickersLocalization } from './utils/getPickersLocalization';
+import { getPickersLocalization } from "./utils/getPickersLocalization.js";
 // maps TimeView to its translation
 const timeViews = {
   hours: 'Stunden',
@@ -32,7 +32,7 @@ const deDEPickers = {
   timePickerToolbarTitle: 'Uhrzeit auswählen',
   dateRangePickerToolbarTitle: 'Datumsbereich auswählen',
   // Clock labels
-  clockLabelText: (view, time, adapter) => `${timeViews[view] ?? view} auswählen. ${time === null ? 'Keine Uhrzeit ausgewählt' : `Gewählte Uhrzeit ist ${adapter.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, time, utils, formattedTime) => `${timeViews[view] ?? view} auswählen. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Keine Uhrzeit ausgewählt' : `Gewählte Uhrzeit ist ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
   hoursClockNumberText: hours => `${hours} ${timeViews.hours}`,
   minutesClockNumberText: minutes => `${minutes} ${timeViews.minutes}`,
   secondsClockNumberText: seconds => `${seconds}  ${timeViews.seconds}`,
@@ -44,8 +44,8 @@ const deDEPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `Woche ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Datum auswählen, gewähltes Datum ist ${utils.format(value, 'fullDate')}` : 'Datum auswählen',
-  openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Uhrzeit auswählen, gewählte Uhrzeit ist ${utils.format(value, 'fullTime')}` : 'Uhrzeit auswählen',
+  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `Datum auswählen, gewähltes Datum ist ${formattedDate ?? utils.format(value, 'fullDate')}` : 'Datum auswählen',
+  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `Uhrzeit auswählen, gewählte Uhrzeit ist ${formattedTime ?? utils.format(value, 'fullTime')}` : 'Uhrzeit auswählen',
   fieldClearLabel: 'Wert leeren',
   // Table labels
   timeTableLabel: 'Uhrzeit auswählen',

package/modern/locales/elGR.js

@@ -1,4 +1,4 @@
-import { getPickersLocalization } from './utils/getPickersLocalization';
+import { getPickersLocalization } from "./utils/getPickersLocalization.js";
 const views = {
   hours: 'ώρες',
   minutes: 'λεπτά',
@@ -32,7 +32,7 @@ const elGRPickers = {
   timePickerToolbarTitle: 'Επιλέξτε ώρα',
   dateRangePickerToolbarTitle: 'Επιλέξτε εύρος ημερομηνιών',
   // Clock labels
-  clockLabelText: (view, time, adapter) => `Επιλέξτε ${views[view]}. ${time === null ? 'Δεν έχει επιλεγεί ώρα' : `Η επιλεγμένη ώρα είναι ${adapter.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, time, utils, formattedTime) => `Επιλέξτε ${views[view]}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Δεν έχει επιλεγεί ώρα' : `Η επιλεγμένη ώρα είναι ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
   hoursClockNumberText: hours => `${hours} ώρες`,
   minutesClockNumberText: minutes => `${minutes} λεπτά`,
   secondsClockNumberText: seconds => `${seconds} δευτερόλεπτα`,
@@ -44,9 +44,9 @@ const elGRPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `Εβδομάδα ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Επιλέξτε ημερομηνία, η επιλεγμένη ημερομηνία είναι ${utils.format(value, 'fullDate')}` : 'Επιλέξτε ημερομηνία',
-  openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Επιλέξτε ώρα, η επιλεγμένη ώρα είναι ${utils.format(value, 'fullTime')}` : 'Επιλέξτε ώρα',
-  // fieldClearLabel: 'Clear value',
+  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')}` : 'Επιλέξτε ώρα',
+  // fieldClearLabel: 'Clear',
 
   // Table labels
   timeTableLabel: 'επιλέξτε ώρα',

package/modern/locales/enUS.js

@@ -1,4 +1,4 @@
-import { getPickersLocalization } from './utils/getPickersLocalization';
+import { getPickersLocalization } from "./utils/getPickersLocalization.js";
 
 // This object is not Partial<PickersLocaleText> because it is the default values
 
@@ -28,7 +28,7 @@ const enUSPickers = {
   timePickerToolbarTitle: 'Select time',
   dateRangePickerToolbarTitle: 'Select date range',
   // Clock labels
-  clockLabelText: (view, time, adapter) => `Select ${view}. ${time === null ? 'No time selected' : `Selected time is ${adapter.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, time, utils, formattedTime) => `Select ${view}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'No time selected' : `Selected time is ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
   hoursClockNumberText: hours => `${hours} hours`,
   minutesClockNumberText: minutes => `${minutes} minutes`,
   secondsClockNumberText: seconds => `${seconds} seconds`,
@@ -40,9 +40,9 @@ const enUSPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `Week ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Choose date, selected date is ${utils.format(value, 'fullDate')}` : 'Choose date',
-  openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Choose time, selected time is ${utils.format(value, 'fullTime')}` : 'Choose time',
-  fieldClearLabel: 'Clear value',
+  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `Choose date, selected date is ${formattedDate ?? utils.format(value, 'fullDate')}` : 'Choose date',
+  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `Choose time, selected time is ${formattedTime ?? utils.format(value, 'fullTime')}` : 'Choose time',
+  fieldClearLabel: 'Clear',
   // Table labels
   timeTableLabel: 'pick time',
   dateTableLabel: 'pick date',

package/modern/locales/esES.js

@@ -1,4 +1,4 @@
-import { getPickersLocalization } from './utils/getPickersLocalization';
+import { getPickersLocalization } from "./utils/getPickersLocalization.js";
 const views = {
   hours: 'Horas',
   minutes: 'Minutos',
@@ -31,7 +31,7 @@ const esESPickers = {
   timePickerToolbarTitle: 'Seleccionar hora',
   dateRangePickerToolbarTitle: 'Seleccionar rango de fecha',
   // Clock labels
-  clockLabelText: (view, time, adapter) => `Seleccione ${views[view]}. ${time === null ? 'No hay hora seleccionada' : `La hora seleccionada es ${adapter.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, time, utils, formattedTime) => `Seleccione ${views[view]}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'No hay hora seleccionada' : `La hora seleccionada es ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
   hoursClockNumberText: hours => `${hours} horas`,
   minutesClockNumberText: minutes => `${minutes} minutos`,
   secondsClockNumberText: seconds => `${seconds} segundos`,
@@ -43,8 +43,8 @@ const esESPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `Semana ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Elige fecha, la fecha elegida es ${utils.format(value, 'fullDate')}` : 'Elige fecha',
-  openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Elige hora, la hora elegida es ${utils.format(value, 'fullTime')}` : 'Elige hora',
+  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `Elige fecha, la fecha elegida es ${formattedDate ?? utils.format(value, 'fullDate')}` : 'Elige fecha',
+  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `Elige hora, la hora elegida es ${formattedTime ?? utils.format(value, 'fullTime')}` : 'Elige hora',
   fieldClearLabel: 'Limpiar valor',
   // Table labels
   timeTableLabel: 'elige hora',

package/modern/locales/eu.js

@@ -1,4 +1,4 @@
-import { getPickersLocalization } from './utils/getPickersLocalization';
+import { getPickersLocalization } from "./utils/getPickersLocalization.js";
 const views = {
   hours: 'orduak',
   minutes: 'minutuak',
@@ -32,7 +32,7 @@ const euPickers = {
   timePickerToolbarTitle: 'Ordua aukeratu',
   dateRangePickerToolbarTitle: 'Data tartea aukeratu',
   // Clock labels
-  clockLabelText: (view, time, adapter) => `Aukeratu ${views[view]}. ${time === null ? 'Ez da ordurik aukertau' : `Aukeratutako ordua ${adapter.format(time, 'fullTime')} da`}`,
+  clockLabelText: (view, time, utils, formattedTime) => `Aukeratu ${views[view]}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Ez da ordurik aukertau' : `Aukeratutako ordua ${formattedTime ?? utils.format(time, 'fullTime')} da`}`,
   hoursClockNumberText: hours => `${hours} ordu`,
   minutesClockNumberText: minutes => `${minutes} minutu`,
   secondsClockNumberText: seconds => `${seconds} segundu`,
@@ -44,8 +44,8 @@ const euPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `${weekNumber} astea`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Data aukeratu, aukeratutako data ${utils.format(value, 'fullDate')} da` : 'Data aukeratu',
-  openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Ordua aukeratu, aukeratutako ordua ${utils.format(value, 'fullTime')} da` : 'Ordua aukeratu',
+  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `Data aukeratu, aukeratutako data ${formattedDate ?? utils.format(value, 'fullDate')} da` : 'Data aukeratu',
+  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `Ordua aukeratu, aukeratutako ordua ${formattedTime ?? utils.format(value, 'fullTime')} da` : 'Ordua aukeratu',
   fieldClearLabel: 'Balioa garbitu',
   // Table labels
   timeTableLabel: 'ordua aukeratu',

package/modern/locales/faIR.js

@@ -1,4 +1,4 @@
-import { getPickersLocalization } from './utils/getPickersLocalization';
+import { getPickersLocalization } from "./utils/getPickersLocalization.js";
 const timeViews = {
   hours: 'ساعت‌ها',
   minutes: 'دقیقه‌ها',
@@ -31,7 +31,7 @@ const faIRPickers = {
   timePickerToolbarTitle: 'ساعت را انتخاب کنید',
   dateRangePickerToolbarTitle: 'محدوده تاریخ را انتخاب کنید',
   // Clock labels
-  clockLabelText: (view, time, adapter) => ` را انتخاب کنید ${timeViews[view]}. ${time === null ? 'هیچ ساعتی انتخاب نشده است' : `ساعت انتخاب ${adapter.format(time, 'fullTime')} می باشد`}`,
+  clockLabelText: (view, time, utils, formattedTime) => ` را انتخاب کنید ${timeViews[view]}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'هیچ ساعتی انتخاب نشده است' : `ساعت انتخاب ${formattedTime ?? utils.format(time, 'fullTime')} می باشد`}`,
   hoursClockNumberText: hours => `${hours} ساعت‌ها`,
   minutesClockNumberText: minutes => `${minutes} دقیقه‌ها`,
   secondsClockNumberText: seconds => `${seconds} ثانیه‌ها`,
@@ -43,8 +43,8 @@ const faIRPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `هفته ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `تاریخ را انتخاب کنید، تاریخ انتخاب شده ${utils.format(value, 'fullDate')} می‌باشد` : 'تاریخ را انتخاب کنید',
-  openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `ساعت را انتخاب کنید، ساعت انتخاب شده ${utils.format(value, 'fullTime')} می‌باشد` : 'ساعت را انتخاب کنید',
+  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')} می‌باشد` : 'ساعت را انتخاب کنید',
   fieldClearLabel: 'پاک کردن مقدار',
   // Table labels
   timeTableLabel: 'انتخاب تاریخ',

package/modern/locales/fiFI.js

@@ -1,4 +1,4 @@
-import { getPickersLocalization } from './utils/getPickersLocalization';
+import { getPickersLocalization } from "./utils/getPickersLocalization.js";
 const views = {
   hours: 'tunnit',
   minutes: 'minuutit',
@@ -31,7 +31,7 @@ const fiFIPickers = {
   timePickerToolbarTitle: 'Valitse aika',
   dateRangePickerToolbarTitle: 'Valitse aikaväli',
   // Clock labels
-  clockLabelText: (view, time, adapter) => `Valitse ${views[view]}. ${time === null ? 'Ei aikaa valittuna' : `Valittu aika on ${adapter.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, time, utils, formattedTime) => `Valitse ${views[view]}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Ei aikaa valittuna' : `Valittu aika on ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
   hoursClockNumberText: hours => `${hours} tuntia`,
   minutesClockNumberText: minutes => `${minutes} minuuttia`,
   secondsClockNumberText: seconds => `${seconds} sekuntia`,
@@ -43,8 +43,8 @@ const fiFIPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `Viikko ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Valitse päivä, valittu päivä on ${utils.format(value, 'fullDate')}` : 'Valitse päivä',
-  openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Valitse aika, valittu aika on ${utils.format(value, 'fullTime')}` : 'Valitse aika',
+  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `Valitse päivä, valittu päivä on ${formattedDate ?? utils.format(value, 'fullDate')}` : 'Valitse päivä',
+  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `Valitse aika, valittu aika on ${formattedTime ?? utils.format(value, 'fullTime')}` : 'Valitse aika',
   fieldClearLabel: 'Tyhjennä arvo',
   // Table labels
   timeTableLabel: 'valitse aika',

package/modern/locales/frFR.js

@@ -1,4 +1,4 @@
-import { getPickersLocalization } from './utils/getPickersLocalization';
+import { getPickersLocalization } from "./utils/getPickersLocalization.js";
 const views = {
   hours: 'heures',
   minutes: 'minutes',
@@ -31,7 +31,7 @@ const frFRPickers = {
   timePickerToolbarTitle: "Choisir l'heure",
   dateRangePickerToolbarTitle: 'Choisir la plage de dates',
   // Clock labels
-  clockLabelText: (view, time, adapter) => `Choix des ${views[view]}. ${time === null ? 'Aucune heure choisie' : `L'heure choisie est ${adapter.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, time, utils, formattedTime) => `Choix des ${views[view]}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Aucune heure choisie' : `L'heure choisie est ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
   hoursClockNumberText: hours => `${hours} heures`,
   minutesClockNumberText: minutes => `${minutes} minutes`,
   secondsClockNumberText: seconds => `${seconds} secondes`,
@@ -43,8 +43,8 @@ const frFRPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `Semaine ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Choisir la date, la date sélectionnée est ${utils.format(value, 'fullDate')}` : 'Choisir la date',
-  openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Choisir l'heure, l'heure sélectionnée est ${utils.format(value, 'fullTime')}` : "Choisir l'heure",
+  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `Choisir la date, la date sélectionnée est ${formattedDate ?? utils.format(value, 'fullDate')}` : 'Choisir la date',
+  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime ? `Choisir l'heure, l'heure sélectionnée est ${formattedTime ?? utils.format(value, 'fullTime')}` : "Choisir l'heure",
   fieldClearLabel: 'Effacer la valeur',
   // Table labels
   timeTableLabel: "choix de l'heure",

package/modern/locales/heIL.js

@@ -1,4 +1,4 @@
-import { getPickersLocalization } from './utils/getPickersLocalization';
+import { getPickersLocalization } from "./utils/getPickersLocalization.js";
 const views = {
   hours: 'שעות',
   minutes: 'דקות',
@@ -31,7 +31,7 @@ const heILPickers = {
   timePickerToolbarTitle: 'בחירת שעה',
   dateRangePickerToolbarTitle: 'בחירת טווח תאריכים',
   // Clock labels
-  clockLabelText: (view, time, adapter) => `בחירת ${views[view]}. ${time === null ? 'לא נבחרה שעה' : `השעה הנבחרת היא ${adapter.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, time, utils, formattedTime) => `בחירת ${views[view]}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'לא נבחרה שעה' : `השעה הנבחרת היא ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
   hoursClockNumberText: hours => `${hours} שעות`,
   minutesClockNumberText: minutes => `${minutes} דקות`,
   secondsClockNumberText: seconds => `${seconds} שניות`,
@@ -43,8 +43,8 @@ const heILPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `שבוע ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `בחירת תאריך, התאריך שנבחר הוא ${utils.format(value, 'fullDate')}` : 'בחירת תאריך',
-  openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `בחירת שעה, השעה שנבחרה היא ${utils.format(value, 'fullTime')}` : 'בחירת שעה',
+  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')}` : 'בחירת שעה',
   fieldClearLabel: 'נקה ערך',
   // Table labels
   timeTableLabel: 'בחירת שעה',

package/modern/locales/huHU.js

@@ -1,4 +1,4 @@
-import { getPickersLocalization } from './utils/getPickersLocalization';
+import { getPickersLocalization } from "./utils/getPickersLocalization.js";
 // maps TimeView to its translation
 const timeViews = {
   hours: 'Óra',
@@ -32,7 +32,7 @@ const huHUPickers = {
   timePickerToolbarTitle: 'Idő kiválasztása',
   dateRangePickerToolbarTitle: 'Dátumhatárok kiválasztása',
   // Clock labels
-  clockLabelText: (view, time, adapter) => `${timeViews[view] ?? view} kiválasztása. ${time === null ? 'Nincs kiválasztva idő' : `A kiválasztott idő ${adapter.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, time, utils, formattedTime) => `${timeViews[view] ?? view} kiválasztása. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Nincs kiválasztva idő' : `A kiválasztott idő ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
   hoursClockNumberText: hours => `${hours} ${timeViews.hours.toLowerCase()}`,
   minutesClockNumberText: minutes => `${minutes} ${timeViews.minutes.toLowerCase()}`,
   secondsClockNumberText: seconds => `${seconds}  ${timeViews.seconds.toLowerCase()}`,
@@ -44,8 +44,8 @@ const huHUPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `${weekNumber}. hét`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Válasszon dátumot, a kiválasztott dátum: ${utils.format(value, 'fullDate')}` : 'Válasszon dátumot',
-  openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Válasszon időt, a kiválasztott idő: ${utils.format(value, 'fullTime')}` : 'Válasszon időt',
+  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `Válasszon dátumot, a kiválasztott dátum: ${formattedDate ?? utils.format(value, 'fullDate')}` : 'Válasszon dátumot',
+  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `Válasszon időt, a kiválasztott idő: ${formattedTime ?? utils.format(value, 'fullTime')}` : 'Válasszon időt',
   fieldClearLabel: 'Tartalom ürítése',
   // Table labels
   timeTableLabel: 'válasszon időt',

package/modern/locales/index.js

@@ -1,36 +1,36 @@
-export * from './beBY';
-export * from './caES';
-export * from './csCZ';
-export * from './daDK';
-export * from './deDE';
-export * from './elGR';
-export * from './enUS';
-export * from './esES';
-export * from './eu';
-export * from './faIR';
-export * from './fiFI';
-export * from './frFR';
-export * from './heIL';
-export * from './huHU';
-export * from './isIS';
-export * from './itIT';
-export * from './jaJP';
-export * from './koKR';
-export * from './kzKZ';
-export * from './mk';
-export * from './nbNO';
-export * from './nlNL';
-export * from './nnNO';
-export * from './plPL';
-export * from './ptBR';
-export * from './roRO';
-export * from './ruRU';
-export * from './skSK';
-export * from './svSE';
-export * from './trTR';
-export * from './ukUA';
-export * from './urPK';
-export * from './viVN';
-export * from './zhCN';
-export * from './zhHK';
-export * from './utils/pickersLocaleTextApi';
+export * from "./beBY.js";
+export * from "./caES.js";
+export * from "./csCZ.js";
+export * from "./daDK.js";
+export * from "./deDE.js";
+export * from "./elGR.js";
+export * from "./enUS.js";
+export * from "./esES.js";
+export * from "./eu.js";
+export * from "./faIR.js";
+export * from "./fiFI.js";
+export * from "./frFR.js";
+export * from "./heIL.js";
+export * from "./huHU.js";
+export * from "./isIS.js";
+export * from "./itIT.js";
+export * from "./jaJP.js";
+export * from "./koKR.js";
+export * from "./kzKZ.js";
+export * from "./mk.js";
+export * from "./nbNO.js";
+export * from "./nlNL.js";
+export * from "./nnNO.js";
+export * from "./plPL.js";
+export * from "./ptBR.js";
+export * from "./roRO.js";
+export * from "./ruRU.js";
+export * from "./skSK.js";
+export * from "./svSE.js";
+export * from "./trTR.js";
+export * from "./ukUA.js";
+export * from "./urPK.js";
+export * from "./viVN.js";
+export * from "./zhCN.js";
+export * from "./zhHK.js";
+export * from "./utils/pickersLocaleTextApi.js";

package/modern/locales/isIS.js

@@ -1,4 +1,4 @@
-import { getPickersLocalization } from './utils/getPickersLocalization';
+import { getPickersLocalization } from "./utils/getPickersLocalization.js";
 const timeViews = {
   hours: 'klukkustundir',
   minutes: 'mínútur',
@@ -32,7 +32,7 @@ const isISPickers = {
   timePickerToolbarTitle: 'Velja tíma',
   dateRangePickerToolbarTitle: 'Velja tímabil',
   // Clock labels
-  clockLabelText: (view, time, adapter) => `Velja ${timeViews[view]}. ${time === null ? 'Enginn tími valinn' : `Valinn tími er ${adapter.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, time, utils, formattedTime) => `Velja ${timeViews[view]}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Enginn tími valinn' : `Valinn tími er ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
   hoursClockNumberText: hours => `${hours} klukkustundir`,
   minutesClockNumberText: minutes => `${minutes} mínútur`,
   secondsClockNumberText: seconds => `${seconds} sekúndur`,
@@ -44,9 +44,9 @@ const isISPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `Vika ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Velja dagsetningu, valin dagsetning er ${utils.format(value, 'fullDate')}` : 'Velja dagsetningu',
-  openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Velja tíma, valinn tími er ${utils.format(value, 'fullTime')}` : 'Velja tíma',
-  // fieldClearLabel: 'Clear value',
+  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `Velja dagsetningu, valin dagsetning er ${formattedDate ?? utils.format(value, 'fullDate')}` : 'Velja dagsetningu',
+  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `Velja tíma, valinn tími er ${formattedTime ?? utils.format(value, 'fullTime')}` : 'Velja tíma',
+  // fieldClearLabel: 'Clear',
 
   // Table labels
   timeTableLabel: 'velja tíma',

package/modern/locales/itIT.js

@@ -1,4 +1,4 @@
-import { getPickersLocalization } from './utils/getPickersLocalization';
+import { getPickersLocalization } from "./utils/getPickersLocalization.js";
 const views = {
   hours: 'le ore',
   minutes: 'i minuti',
@@ -31,7 +31,7 @@ const itITPickers = {
   timePickerToolbarTitle: 'Seleziona orario',
   dateRangePickerToolbarTitle: 'Seleziona intervallo di date',
   // Clock labels
-  clockLabelText: (view, time, adapter) => `Seleziona ${views[view]}. ${time === null ? 'Nessun orario selezionato' : `L'ora selezionata è ${adapter.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, time, utils, formattedTime) => `Seleziona ${views[view]}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Nessun orario selezionato' : `L'ora selezionata è ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
   hoursClockNumberText: hours => `${hours} ore`,
   minutesClockNumberText: minutes => `${minutes} minuti`,
   secondsClockNumberText: seconds => `${seconds} secondi`,
@@ -43,8 +43,8 @@ const itITPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `Settimana ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Scegli la data, la data selezionata è ${utils.format(value, 'fullDate')}` : 'Scegli la data',
-  openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Scegli l'ora, l'ora selezionata è ${utils.format(value, 'fullTime')}` : "Scegli l'ora",
+  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `Scegli la data, la data selezionata è ${formattedDate ?? utils.format(value, 'fullDate')}` : 'Scegli la data',
+  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `Scegli l'ora, l'ora selezionata è ${formattedTime ?? utils.format(value, 'fullTime')}` : "Scegli l'ora",
   fieldClearLabel: 'Cancella valore',
   // Table labels
   timeTableLabel: "scegli un'ora",

package/modern/locales/jaJP.js

@@ -1,4 +1,4 @@
-import { getPickersLocalization } from './utils/getPickersLocalization';
+import { getPickersLocalization } from "./utils/getPickersLocalization.js";
 // maps TimeView to its translation
 const timeViews = {
   hours: '時間',
@@ -32,7 +32,7 @@ const jaJPPickers = {
   timePickerToolbarTitle: '時間を選択',
   dateRangePickerToolbarTitle: '日付の範囲を選択',
   // Clock labels
-  clockLabelText: (view, time, adapter) => `${timeViews[view] ?? view}を選択してください ${time === null ? '時間が選択されていません' : `選択した時間は ${adapter.format(time, 'fullTime')} です`}`,
+  clockLabelText: (view, time, utils, formattedTime) => `${timeViews[view] ?? view}を選択してください ${!formattedTime && (time === null || !utils.isValid(time)) ? '時間が選択されていません' : `選択した時間は ${formattedTime ?? utils.format(time, 'fullTime')} です`}`,
   hoursClockNumberText: hours => `${hours} ${timeViews.hours}`,
   minutesClockNumberText: minutes => `${minutes} ${timeViews.minutes}`,
   secondsClockNumberText: seconds => `${seconds} ${timeViews.seconds}`,
@@ -44,8 +44,8 @@ const jaJPPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `${weekNumber}週目`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `日付を選択してください。選択した日付は ${utils.format(value, 'fullDate')} です` : '日付を選択してください',
-  openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `時間を選択してください。選択した時間は ${utils.format(value, 'fullTime')} です` : '時間を選択してください',
+  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')} です` : '時間を選択してください',
   fieldClearLabel: 'クリア',
   // Table labels
   timeTableLabel: '時間を選択',