@mui/x-date-pickers 7.16.0 → 7.18.0

package/modern/locales/frFR.js

@@ -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

@@ -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

@@ -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/isIS.js

@@ -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

@@ -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

@@ -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: '時間を選択',

package/modern/locales/koKR.js

@@ -31,7 +31,7 @@ const koKRPickers = {
   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 koKRPickers = {
   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/kzKZ.js

@@ -33,7 +33,7 @@ const kzKZPickers = {
   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} секунд`,
@@ -45,9 +45,9 @@ const kzKZPickers = {
   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/mk.js

@@ -29,7 +29,7 @@ const mkPickers = {
   timePickerToolbarTitle: 'Избери време',
   dateRangePickerToolbarTitle: 'Избери временски опсег',
   // Clock labels
-  clockLabelText: (view, time, adapter) => `Select ${view}. ${time === null ? 'Нема избрано време' : `Избраното време е ${adapter.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, time, utils, formattedTime) => `Select ${view}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Нема избрано време' : `Избраното време е ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
   hoursClockNumberText: hours => `${hours} часа`,
   minutesClockNumberText: minutes => `${minutes} минути`,
   secondsClockNumberText: seconds => `${seconds} секунди`,
@@ -41,8 +41,8 @@ const mkPickers = {
   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/nbNO.js

@@ -32,7 +32,7 @@ const nbNOPickers = {
   timePickerToolbarTitle: 'Velg klokkeslett',
   dateRangePickerToolbarTitle: 'Velg datoperiode',
   // Clock labels
-  clockLabelText: (view, time, adapter) => `Velg ${timeViews[view]}. ${time === null ? 'Ingen tid valgt' : `Valgt tid er ${adapter.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, time, utils, formattedTime) => `Velg ${timeViews[view]}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Ingen tid valgt' : `Valgt tid er ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
   hoursClockNumberText: hours => `${hours} timer`,
   minutesClockNumberText: minutes => `${minutes} minutter`,
   secondsClockNumberText: seconds => `${seconds} sekunder`,
@@ -44,9 +44,9 @@ const nbNOPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `Uke ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Velg dato, valgt dato er ${utils.format(value, 'fullDate')}` : 'Velg dato',
-  openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Velg tid, valgt tid er ${utils.format(value, 'fullTime')}` : 'Velg tid',
-  // fieldClearLabel: 'Clear value',
+  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `Velg dato, valgt dato er ${formattedDate ?? utils.format(value, 'fullDate')}` : 'Velg dato',
+  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `Velg tid, valgt tid er ${formattedTime ?? utils.format(value, 'fullTime')}` : 'Velg tid',
+  // fieldClearLabel: 'Clear',
 
   // Table labels
   timeTableLabel: 'velg tid',

package/modern/locales/nlNL.js

@@ -31,7 +31,7 @@ const nlNLPickers = {
   timePickerToolbarTitle: 'Selecteer tijd',
   dateRangePickerToolbarTitle: 'Selecteer datumbereik',
   // Clock labels
-  clockLabelText: (view, time, adapter) => `Selecteer ${timeViews[view]}. ${time === null ? 'Geen tijd geselecteerd' : `Geselecteerde tijd is ${adapter.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, time, utils, formattedTime) => `Selecteer ${timeViews[view]}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Geen tijd geselecteerd' : `Geselecteerde tijd is ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
   hoursClockNumberText: hours => `${hours} uren`,
   minutesClockNumberText: minutes => `${minutes} minuten`,
   secondsClockNumberText: seconds => `${seconds} seconden`,
@@ -43,8 +43,8 @@ const nlNLPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `Week ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Kies datum, geselecteerde datum is ${utils.format(value, 'fullDate')}` : 'Kies datum',
-  openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Kies tijd, geselecteerde tijd is ${utils.format(value, 'fullTime')}` : 'Kies tijd',
+  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `Kies datum, geselecteerde datum is ${formattedDate ?? utils.format(value, 'fullDate')}` : 'Kies datum',
+  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `Kies tijd, geselecteerde tijd is ${formattedTime ?? utils.format(value, 'fullTime')}` : 'Kies tijd',
   fieldClearLabel: 'Wissen',
   // Table labels
   timeTableLabel: 'kies tijd',

package/modern/locales/nnNO.js

@@ -31,7 +31,7 @@ const nnNOPickers = {
   timePickerToolbarTitle: 'Vel klokkeslett',
   dateRangePickerToolbarTitle: 'Vel datoperiode',
   // Clock labels
-  clockLabelText: (view, time, adapter) => `Vel ${timeViews[view]}. ${time === null ? 'Ingen tid vald' : `Vald tid er ${adapter.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, time, utils, formattedTime) => `Vel ${timeViews[view]}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Ingen tid vald' : `Vald tid er ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
   hoursClockNumberText: hours => `${hours} timar`,
   minutesClockNumberText: minutes => `${minutes} minuttar`,
   secondsClockNumberText: seconds => `${seconds} sekundar`,
@@ -43,8 +43,8 @@ const nnNOPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `Veke ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Vel dato, vald dato er ${utils.format(value, 'fullDate')}` : 'Vel dato',
-  openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Vel tid, vald tid er ${utils.format(value, 'fullTime')}` : 'Vel tid',
+  openDatePickerDialogue: (value, utils, formattedDate) => formattedDate || value !== null && utils.isValid(value) ? `Vel dato, vald dato er ${formattedDate ?? utils.format(value, 'fullDate')}` : 'Vel dato',
+  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `Vel tid, vald tid er ${formattedTime ?? utils.format(value, 'fullTime')}` : 'Vel tid',
   fieldClearLabel: 'Fjern verdi',
   // Table labels
   timeTableLabel: 'vel tid',

package/modern/locales/plPL.js

@@ -32,7 +32,7 @@ const plPLPickers = {
   timePickerToolbarTitle: 'Wybierz czas',
   dateRangePickerToolbarTitle: 'Wybierz zakres dat',
   // Clock labels
-  clockLabelText: (view, time, adapter) => `Wybierz ${timeViews[view]}. ${time === null ? 'Nie wybrano czasu' : `Wybrany czas to ${adapter.format(time, 'fullTime')}`}`,
+  clockLabelText: (view, time, utils, formattedTime) => `Wybierz ${timeViews[view]}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Nie wybrano czasu' : `Wybrany czas to ${formattedTime ?? utils.format(time, 'fullTime')}`}`,
   hoursClockNumberText: hours => `${hours} godzin`,
   minutesClockNumberText: minutes => `${minutes} minut`,
   secondsClockNumberText: seconds => `${seconds} sekund`,
@@ -44,9 +44,9 @@ const plPLPickers = {
   calendarWeekNumberAriaLabelText: weekNumber => `Tydzień ${weekNumber}`,
   calendarWeekNumberText: weekNumber => `${weekNumber}`,
   // Open picker labels
-  openDatePickerDialogue: (value, utils) => value != null && utils.isValid(value) ? `Wybierz datę, obecnie wybrana data to ${utils.format(value, 'fullDate')}` : 'Wybierz datę',
-  openTimePickerDialogue: (value, utils) => value !== null && utils.isValid(value) ? `Wybierz czas, obecnie wybrany czas to ${utils.format(value, 'fullTime')}` : 'Wybierz czas',
-  // fieldClearLabel: 'Clear value',
+  openDatePickerDialogue: (value, utils, formattedDate) => value != null && utils.isValid(value) ? `Wybierz datę, obecnie wybrana data to ${formattedDate ?? utils.format(value, 'fullDate')}` : 'Wybierz datę',
+  openTimePickerDialogue: (value, utils, formattedTime) => formattedTime || value !== null && utils.isValid(value) ? `Wybierz czas, obecnie wybrany czas to ${formattedTime ?? utils.format(value, 'fullTime')}` : 'Wybierz czas',
+  // fieldClearLabel: 'Clear',
 
   // Table labels
   timeTableLabel: 'wybierz czas',

package/modern/locales/ptBR.js

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

package/modern/locales/roRO.js

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

package/modern/locales/ruRU.js

@@ -32,7 +32,7 @@ const ruRUPickers = {
   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} секунд`,
@@ -44,8 +44,8 @@ const ruRUPickers = {
   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/skSK.js

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

package/modern/locales/svSE.js

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

package/modern/locales/trTR.js

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

package/modern/locales/ukUA.js

@@ -31,7 +31,7 @@ const ukUAPickers = {
   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 ukUAPickers = {
   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/urPK.js

@@ -32,7 +32,7 @@ const urPKPickers = {
   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} سیکنڈ`,
@@ -44,9 +44,9 @@ const urPKPickers = {
   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/utils/getPickersLocalization.js

@@ -9,4 +9,17 @@ export const getPickersLocalization = pickersTranslations => {
       }
     }
   };
+};
+export const buildGetOpenDialogAriaText = params => {
+  const {
+    utils,
+    formatKey,
+    contextTranslation,
+    propsTranslation
+  } = params;
+  return value => {
+    const formattedValue = value !== null && utils.isValid(value) ? utils.format(value, formatKey) : null;
+    const translation = propsTranslation ?? contextTranslation;
+    return translation(value, utils, formattedValue);
+  };
 };

package/modern/locales/viVN.js

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

package/modern/locales/zhCN.js

@@ -31,7 +31,7 @@ const zhCNPickers = {
   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 zhCNPickers = {
   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/zhHK.js

@@ -31,7 +31,7 @@ const zhHKPickers = {
   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 zhHKPickers = {
   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/validation/index.js

@@ -0,0 +1,5 @@
+export { validateDate } from "./validateDate.js";
+export { validateTime } from "./validateTime.js";
+export { validateDateTime } from "./validateDateTime.js";
+export { extractValidationProps } from "./extractValidationProps.js";
+export { useValidation } from "./useValidation.js";