From 5b553c8a11cb8395378360108e614dab19b7855b Mon Sep 17 00:00:00 2001 From: Arthur Suh Balduini <34691066+arthurbalduini@users.noreply.github.com> Date: Tue, 29 Oct 2024 14:38:38 +0100 Subject: [PATCH 1/2] [pickers] Remove `utils` and `value` params from translations (#14986) Signed-off-by: Arthur Suh Balduini <34691066+arthurbalduini@users.noreply.github.com> Co-authored-by: Flavien DELANGLE --- .../migration-pickers-v7.md | 106 ++++++++++++++++++ .../src/DateRangePicker/shared.tsx | 4 +- .../src/DateTimeRangePicker/shared.tsx | 1 - .../hooks/useEnrichedRangePickerFieldProps.ts | 4 +- .../x-date-pickers/src/DatePicker/shared.tsx | 3 +- .../src/DateTimePicker/shared.tsx | 3 +- .../LocalizationProvider.test.tsx | 8 +- .../LocalizationProvider.tsx | 4 +- .../x-date-pickers/src/TimeClock/Clock.tsx | 2 - .../x-date-pickers/src/TimePicker/shared.tsx | 3 +- .../internals/components/PickersProvider.tsx | 8 +- .../hooks/useField/buildSectionsFromFormat.ts | 4 +- .../internals/hooks/usePicker/usePicker.ts | 2 +- .../hooks/usePicker/usePicker.types.ts | 5 +- .../hooks/usePicker/usePickerProvider.ts | 15 ++- .../src/internals/hooks/useUtils.ts | 2 +- .../models/props/basePickerProps.tsx | 2 +- packages/x-date-pickers/src/locales/beBY.ts | 18 ++- packages/x-date-pickers/src/locales/bgBG.ts | 18 ++- packages/x-date-pickers/src/locales/caES.ts | 18 ++- packages/x-date-pickers/src/locales/csCZ.ts | 18 ++- packages/x-date-pickers/src/locales/daDK.ts | 18 ++- packages/x-date-pickers/src/locales/deDE.ts | 18 ++- packages/x-date-pickers/src/locales/elGR.ts | 18 ++- packages/x-date-pickers/src/locales/enUS.ts | 22 ++-- packages/x-date-pickers/src/locales/esES.ts | 18 ++- packages/x-date-pickers/src/locales/eu.ts | 18 ++- packages/x-date-pickers/src/locales/faIR.ts | 18 +-- packages/x-date-pickers/src/locales/fiFI.ts | 18 ++- packages/x-date-pickers/src/locales/frFR.ts | 16 +-- packages/x-date-pickers/src/locales/heIL.ts | 18 ++- packages/x-date-pickers/src/locales/hrHR.ts | 18 ++- packages/x-date-pickers/src/locales/huHU.ts | 18 ++- packages/x-date-pickers/src/locales/isIS.ts | 18 ++- packages/x-date-pickers/src/locales/itIT.ts | 18 ++- packages/x-date-pickers/src/locales/jaJP.ts | 18 +-- packages/x-date-pickers/src/locales/koKR.ts | 18 +-- packages/x-date-pickers/src/locales/kzKZ.ts | 18 ++- packages/x-date-pickers/src/locales/mk.ts | 18 ++- packages/x-date-pickers/src/locales/nbNO.ts | 18 ++- packages/x-date-pickers/src/locales/nlNL.ts | 18 ++- packages/x-date-pickers/src/locales/nnNO.ts | 18 ++- packages/x-date-pickers/src/locales/plPL.ts | 18 ++- packages/x-date-pickers/src/locales/ptBR.ts | 21 ++-- packages/x-date-pickers/src/locales/ptPT.ts | 18 ++- packages/x-date-pickers/src/locales/roRO.ts | 18 ++- packages/x-date-pickers/src/locales/ruRU.ts | 18 ++- packages/x-date-pickers/src/locales/skSK.ts | 18 ++- packages/x-date-pickers/src/locales/svSE.ts | 18 ++- packages/x-date-pickers/src/locales/trTR.ts | 18 ++- packages/x-date-pickers/src/locales/ukUA.ts | 18 ++- packages/x-date-pickers/src/locales/urPK.ts | 18 ++- .../locales/utils/getPickersLocalization.ts | 18 +-- .../src/locales/utils/pickersLocaleTextApi.ts | 70 +++--------- packages/x-date-pickers/src/locales/viVN.ts | 18 ++- packages/x-date-pickers/src/locales/zhCN.ts | 18 ++- packages/x-date-pickers/src/locales/zhHK.ts | 18 ++- 57 files changed, 433 insertions(+), 520 deletions(-) diff --git a/docs/data/migration/migration-pickers-v7/migration-pickers-v7.md b/docs/data/migration/migration-pickers-v7/migration-pickers-v7.md index 18a1f57af80f..a7c30b0a931b 100644 --- a/docs/data/migration/migration-pickers-v7/migration-pickers-v7.md +++ b/docs/data/migration/migration-pickers-v7/migration-pickers-v7.md @@ -314,3 +314,109 @@ If you were using them, you need to replace them with the following code: > & UseDateTimeFieldProps; ``` + +## Stop passing `utils` and the date object to some translation keys + +Some translation keys no longer require `utils` and the date object as parameters, but only the formatted value as a string. The keys affected by this changes are: `clockLabelText`, `openDatePickerDialogue` and `openTimePickerDialogue`. +If you have customized those translation keys, you have to update them following the examples below: + +- If you are setting a custom value in a picker component: + +```diff +-clockLabelText: (view, time, utils) => +- `Select ${view}. ${ +- time === null || !utils.isValid(time) +- ? 'No time selected' +- : `Selected time is ${utils.format(time, 'fullTime')}` +- }` ++clockLabelText: (view, formattedTime) => ++ `Select ${view}. ${ ++ formattedTime == null ? 'No time selected' : `Selected time is ${formattedTime}` ++ }` + +-openDatePickerDialogue: (value, utils) => +- value !== null && utils.isValid(value) +- ? `Choose date, selected date is ${utils.format(value, 'fullDate')}` +- : 'Choose date', ++openDatePickerDialogue: (formattedDate) => ++ formattedDate ? `Choose date, selected date is ${formattedDate}` : 'Choose date' + +-openTimePickerDialogue: (value, utils) => +- value !== null && utils.isValid(value) +- ? `Choose time, selected time is ${utils.format(value, 'fullTime')}` +- : 'Choose time', ++openTimePickerDialogue: (formattedTime) => ++ formattedTime ? `Choose time, selected time is ${formattedTime}` : 'Choose time' +``` + +- If you are setting a custom value in the `LocalizationProvider`: + +```diff + +- `Select ${view}. ${ +- time === null || !utils.isValid(time) +- ? 'No time selected' +- : `Selected time is ${utils.format(time, 'fullTime')}` +- }` ++ clockLabelText: (view, formattedTime) => ++ `Select ${view}. ${ ++ formattedTime == null ? 'No time selected' : `Selected time is ${formattedTime}` ++ }` +- openDatePickerDialogue: (value, utils) => +- value !== null && utils.isValid(value) +- ? `Choose date, selected date is ${utils.format(value, 'fullDate')}` +- : 'Choose date', ++ openDatePickerDialogue: (formattedDate) => ++ formattedDate ? `Choose date, selected date is ${formattedDate}` : 'Choose date' +- openTimePickerDialogue: (value, utils) => +- value !== null && utils.isValid(value) +- ? `Choose time, selected time is ${utils.format(value, 'fullTime')}` +- : 'Choose time', ++ openTimePickerDialogue: (formattedTime) => ++ formattedTime ? `Choose time, selected time is ${formattedTime}` : 'Choose time' + }} > +``` + +- If you using this translation key in a custom component: + +```diff + const translations = usePickersTranslations(); + +-const clockLabelText = translations.clockLabelText( +- view, +- value, +- {} as any, +- value == null ? null : value.format('hh:mm:ss') +-); ++const clockLabelText = translations.clockLabelText( ++ view, ++ value == null ? null : value.format('hh:mm:ss') ++); + +-const openDatePickerDialogue = translations.openDatePickerDialogue( +- value, +- {} as any, +- value == null ? null : value.format('MM/DD/YYY') +-); ++const openDatePickerDialogue = translations.openDatePickerDialogue( ++ value == null ? null : value.format('MM/DD/YYY') ++); + +-const openTimePickerDialogue = translations.openTimePickerDialogue( +- value, +- {} as any, +- value == null ? null : value.format('hh:mm:ss') +-); ++const openTimePickerDialogue = translations.openTimePickerDialogue( ++ value == null ? null : value.format('hh:mm:ss') ++); +``` + +Also the following types and interfaces no longer receive a generic type parameter: + +- `PickersComponentAgnosticLocaleText` +- `PickersInputComponentLocaleText` +- `PickersInputLocaleText` +- `PickersLocaleText` +- `PickersTranslationKeys` diff --git a/packages/x-date-pickers-pro/src/DateRangePicker/shared.tsx b/packages/x-date-pickers-pro/src/DateRangePicker/shared.tsx index 36beb3a913bb..1099eb02994e 100644 --- a/packages/x-date-pickers-pro/src/DateRangePicker/shared.tsx +++ b/packages/x-date-pickers-pro/src/DateRangePicker/shared.tsx @@ -68,7 +68,7 @@ export interface BaseDateRangePickerProps type UseDateRangePickerDefaultizedProps< TDate extends PickerValidDate, Props extends BaseDateRangePickerProps, -> = LocalizedComponent>>; +> = LocalizedComponent>>; export function useDateRangePickerDefaultizedProps< TDate extends PickerValidDate, @@ -81,7 +81,7 @@ export function useDateRangePickerDefaultizedProps< name, }); - const localeText = React.useMemo | undefined>(() => { + const localeText = React.useMemo(() => { if (themeProps.localeText?.toolbarTitle == null) { return themeProps.localeText; } diff --git a/packages/x-date-pickers-pro/src/DateTimeRangePicker/shared.tsx b/packages/x-date-pickers-pro/src/DateTimeRangePicker/shared.tsx index 9c1e7463e31c..c05b078383b2 100644 --- a/packages/x-date-pickers-pro/src/DateTimeRangePicker/shared.tsx +++ b/packages/x-date-pickers-pro/src/DateTimeRangePicker/shared.tsx @@ -128,7 +128,6 @@ type UseDateTimeRangePickerDefaultizedProps< TDate extends PickerValidDate, Props extends BaseDateTimeRangePickerProps, > = LocalizedComponent< - TDate, Omit>, 'views'> > & { shouldRenderTimeInASingleColumn: boolean; diff --git a/packages/x-date-pickers-pro/src/internals/hooks/useEnrichedRangePickerFieldProps.ts b/packages/x-date-pickers-pro/src/internals/hooks/useEnrichedRangePickerFieldProps.ts index 7f382894f5eb..c8cab261f3e9 100644 --- a/packages/x-date-pickers-pro/src/internals/hooks/useEnrichedRangePickerFieldProps.ts +++ b/packages/x-date-pickers-pro/src/internals/hooks/useEnrichedRangePickerFieldProps.ts @@ -114,7 +114,7 @@ export interface UseEnrichedRangePickerFieldPropsParams< TEnableAccessibleFieldDOMStructure extends boolean, TError, > extends Pick< - UsePickerResponse, TDate, TView, RangeFieldSection, any>, + UsePickerResponse, TView, RangeFieldSection, any>, 'open' | 'actions' >, UseRangePositionResponse { @@ -125,7 +125,7 @@ export interface UseEnrichedRangePickerFieldPropsParams< disableOpenPicker?: boolean; onBlur?: () => void; label?: React.ReactNode; - localeText: PickersInputLocaleText | undefined; + localeText: PickersInputLocaleText | undefined; pickerSlotProps: RangePickerFieldSlotProps | undefined; pickerSlots: RangePickerFieldSlots | undefined; fieldProps: RangePickerPropsForFieldSlot< diff --git a/packages/x-date-pickers/src/DatePicker/shared.tsx b/packages/x-date-pickers/src/DatePicker/shared.tsx index abfb67d545de..dec54f98f096 100644 --- a/packages/x-date-pickers/src/DatePicker/shared.tsx +++ b/packages/x-date-pickers/src/DatePicker/shared.tsx @@ -71,7 +71,6 @@ type UseDatePickerDefaultizedProps< TDate extends PickerValidDate, Props extends BaseDatePickerProps, > = LocalizedComponent< - TDate, DefaultizedProps> >; @@ -86,7 +85,7 @@ export function useDatePickerDefaultizedProps< name, }); - const localeText = React.useMemo | undefined>(() => { + const localeText = React.useMemo(() => { if (themeProps.localeText?.toolbarTitle == null) { return themeProps.localeText; } diff --git a/packages/x-date-pickers/src/DateTimePicker/shared.tsx b/packages/x-date-pickers/src/DateTimePicker/shared.tsx index 4c34b61987e9..827c0ed4ef35 100644 --- a/packages/x-date-pickers/src/DateTimePicker/shared.tsx +++ b/packages/x-date-pickers/src/DateTimePicker/shared.tsx @@ -112,7 +112,6 @@ type UseDateTimePickerDefaultizedProps< TView extends DateOrTimeViewWithMeridiem, Props extends BaseDateTimePickerProps, > = LocalizedComponent< - TDate, DefaultizedProps< Props, | 'views' @@ -138,7 +137,7 @@ export function useDateTimePickerDefaultizedProps< const ampm = themeProps.ampm ?? utils.is12HourCycleInCurrentLocale(); - const localeText = React.useMemo | undefined>(() => { + const localeText = React.useMemo(() => { if (themeProps.localeText?.toolbarTitle == null) { return themeProps.localeText; } diff --git a/packages/x-date-pickers/src/LocalizationProvider/LocalizationProvider.test.tsx b/packages/x-date-pickers/src/LocalizationProvider/LocalizationProvider.test.tsx index 7995b6b0554c..d7722e1f3ad6 100644 --- a/packages/x-date-pickers/src/LocalizationProvider/LocalizationProvider.test.tsx +++ b/packages/x-date-pickers/src/LocalizationProvider/LocalizationProvider.test.tsx @@ -46,7 +46,7 @@ describe('', () => { , ); - const localeText: PickersLocaleText = handleContextChange.lastCall.args[0].localeText; + const localeText: PickersLocaleText = handleContextChange.lastCall.args[0].localeText; expect(localeText.start).to.equal('Debut'); expect(localeText.end).to.equal('End'); }); @@ -72,7 +72,7 @@ describe('', () => { , ); - const localeText: PickersLocaleText = handleContextChange.lastCall.args[0].localeText; + const localeText: PickersLocaleText = handleContextChange.lastCall.args[0].localeText; expect(localeText.start).to.equal('Start'); }); @@ -87,7 +87,7 @@ describe('', () => { , ); - const localeText: PickersLocaleText = handleContextChange.lastCall.args[0].localeText; + const localeText: PickersLocaleText = handleContextChange.lastCall.args[0].localeText; expect(localeText.start).to.equal('Début'); }); @@ -102,7 +102,7 @@ describe('', () => { , ); - const localeText: PickersLocaleText = handleContextChange.lastCall.args[0].localeText; + const localeText: PickersLocaleText = handleContextChange.lastCall.args[0].localeText; expect(localeText.start).to.equal('Empezar'); }); }); diff --git a/packages/x-date-pickers/src/LocalizationProvider/LocalizationProvider.tsx b/packages/x-date-pickers/src/LocalizationProvider/LocalizationProvider.tsx index 8993b434ec0c..cff47afa4d34 100644 --- a/packages/x-date-pickers/src/LocalizationProvider/LocalizationProvider.tsx +++ b/packages/x-date-pickers/src/LocalizationProvider/LocalizationProvider.tsx @@ -12,7 +12,7 @@ export interface MuiPickersAdapterContextValue { }; utils: MuiPickersAdapter; - localeText: PickersInputLocaleText | undefined; + localeText: PickersInputLocaleText | undefined; } export type MuiPickersAdapterContextNullableValue = { @@ -49,7 +49,7 @@ export interface LocalizationProviderProps; + localeText?: PickersInputLocaleText; } type LocalizationProviderComponent = (( diff --git a/packages/x-date-pickers/src/TimeClock/Clock.tsx b/packages/x-date-pickers/src/TimeClock/Clock.tsx index 4e7c3f48ba23..c75bf158cca7 100644 --- a/packages/x-date-pickers/src/TimeClock/Clock.tsx +++ b/packages/x-date-pickers/src/TimeClock/Clock.tsx @@ -380,8 +380,6 @@ export function Clock(inProps: ClockProps) aria-activedescendant={selectedId} aria-label={translations.clockLabelText( type, - value, - utils, value == null ? null : utils.format(value, 'fullTime'), )} ref={listboxRef} diff --git a/packages/x-date-pickers/src/TimePicker/shared.tsx b/packages/x-date-pickers/src/TimePicker/shared.tsx index aeb8e9686733..a459bac50d25 100644 --- a/packages/x-date-pickers/src/TimePicker/shared.tsx +++ b/packages/x-date-pickers/src/TimePicker/shared.tsx @@ -74,7 +74,6 @@ type UseTimePickerDefaultizedProps< TView extends TimeViewWithMeridiem, Props extends BaseTimePickerProps, > = LocalizedComponent< - TDate, DefaultizedProps >; @@ -91,7 +90,7 @@ export function useTimePickerDefaultizedProps< const ampm = themeProps.ampm ?? utils.is12HourCycleInCurrentLocale(); - const localeText = React.useMemo | undefined>(() => { + const localeText = React.useMemo(() => { if (themeProps.localeText?.toolbarTitle == null) { return themeProps.localeText; } diff --git a/packages/x-date-pickers/src/internals/components/PickersProvider.tsx b/packages/x-date-pickers/src/internals/components/PickersProvider.tsx index 758fe02252f3..0f1d32981472 100644 --- a/packages/x-date-pickers/src/internals/components/PickersProvider.tsx +++ b/packages/x-date-pickers/src/internals/components/PickersProvider.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { PickerOwnerState, PickerValidDate } from '../../models'; +import { PickerOwnerState } from '../../models'; import { PickersInputLocaleText } from '../../locales'; import { LocalizationProvider } from '../../LocalizationProvider'; @@ -14,7 +14,7 @@ export const PickersPrivateContext = React.createContext(props: PickersProviderProps) { +export function PickersProvider(props: PickersProviderProps) { const { contextValue, privateContextValue, localeText, children } = props; return ( @@ -26,10 +26,10 @@ export function PickersProvider(props: PickersPro ); } -export interface PickersProviderProps { +export interface PickersProviderProps { contextValue: PickersContextValue; privateContextValue: PickersPrivateContextValue; - localeText: PickersInputLocaleText | undefined; + localeText: PickersInputLocaleText | undefined; children: React.ReactNode; } diff --git a/packages/x-date-pickers/src/internals/hooks/useField/buildSectionsFromFormat.ts b/packages/x-date-pickers/src/internals/hooks/useField/buildSectionsFromFormat.ts index d811f4d649a1..41133f171e69 100644 --- a/packages/x-date-pickers/src/internals/hooks/useField/buildSectionsFromFormat.ts +++ b/packages/x-date-pickers/src/internals/hooks/useField/buildSectionsFromFormat.ts @@ -14,7 +14,7 @@ interface BuildSectionsFromFormatParams { formatDensity: 'dense' | 'spacious'; isRtl: boolean; shouldRespectLeadingZeros: boolean; - localeText: PickersLocaleText; + localeText: PickersLocaleText; localizedDigits: string[]; date: TDate | null; enableAccessibleFieldDOMStructure: boolean; @@ -63,7 +63,7 @@ const getEscapedPartsFromFormat = ({ const getSectionPlaceholder = ( utils: MuiPickersAdapter, - localeText: PickersLocaleText, + localeText: PickersLocaleText, sectionConfig: Pick, sectionFormat: string, ) => { diff --git a/packages/x-date-pickers/src/internals/hooks/usePicker/usePicker.ts b/packages/x-date-pickers/src/internals/hooks/usePicker/usePicker.ts index 4a9aeafff9d3..9d2be881f90d 100644 --- a/packages/x-date-pickers/src/internals/hooks/usePicker/usePicker.ts +++ b/packages/x-date-pickers/src/internals/hooks/usePicker/usePicker.ts @@ -33,7 +33,7 @@ export const usePicker = < TSection, TExternalProps, TAdditionalProps ->): UsePickerResponse> => { +>): UsePickerResponse> => { if (process.env.NODE_ENV !== 'production') { if ((props as any).renderInput != null) { warnOnce([ diff --git a/packages/x-date-pickers/src/internals/hooks/usePicker/usePicker.types.ts b/packages/x-date-pickers/src/internals/hooks/usePicker/usePicker.types.ts index 2c3759d734d0..cad5e32bf7c1 100644 --- a/packages/x-date-pickers/src/internals/hooks/usePicker/usePicker.types.ts +++ b/packages/x-date-pickers/src/internals/hooks/usePicker/usePicker.types.ts @@ -55,13 +55,12 @@ export interface UsePickerParams< UsePickerViewParams, 'additionalViewProps' | 'autoFocusView' | 'rendererInterceptor' | 'fieldRef' >, - Pick, 'localeText'> { + Pick, 'localeText'> { props: TExternalProps; } export interface UsePickerResponse< TValue, - TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TSection extends FieldSection, TError, @@ -69,5 +68,5 @@ export interface UsePickerResponse< Omit, 'layoutProps'>, UsePickerLayoutPropsResponse { ownerState: PickerOwnerState; - providerProps: UsePickerProviderReturnValue; + providerProps: UsePickerProviderReturnValue; } diff --git a/packages/x-date-pickers/src/internals/hooks/usePicker/usePickerProvider.ts b/packages/x-date-pickers/src/internals/hooks/usePicker/usePickerProvider.ts index 3bff7c032e67..e3bec5e1b8e1 100644 --- a/packages/x-date-pickers/src/internals/hooks/usePicker/usePickerProvider.ts +++ b/packages/x-date-pickers/src/internals/hooks/usePicker/usePickerProvider.ts @@ -1,5 +1,5 @@ import * as React from 'react'; -import { FieldSection, PickerOwnerState, PickerValidDate } from '../../../models'; +import { FieldSection, PickerOwnerState } from '../../../models'; import { UsePickerValueResponse } from './usePickerValue.types'; import { PickersProviderProps, @@ -7,18 +7,17 @@ import { PickersPrivateContextValue, } from '../../components/PickersProvider'; -export interface UsePickerProviderParameters - extends Pick, 'localeText'> { +export interface UsePickerProviderParameters + extends Pick { pickerValueResponse: UsePickerValueResponse; ownerState: PickerOwnerState; } -export interface UsePickerProviderReturnValue - extends Omit, 'children'> {} +export interface UsePickerProviderReturnValue extends Omit {} -export function usePickerProvider( - parameters: UsePickerProviderParameters, -): UsePickerProviderReturnValue { +export function usePickerProvider( + parameters: UsePickerProviderParameters, +): UsePickerProviderReturnValue { const { pickerValueResponse, ownerState, localeText } = parameters; const contextValue = React.useMemo( diff --git a/packages/x-date-pickers/src/internals/hooks/useUtils.ts b/packages/x-date-pickers/src/internals/hooks/useUtils.ts index a7c2e1d54130..9a300562aede 100644 --- a/packages/x-date-pickers/src/internals/hooks/useUtils.ts +++ b/packages/x-date-pickers/src/internals/hooks/useUtils.ts @@ -39,7 +39,7 @@ export const useLocalizationContext = () => { ...localization, localeText, }) as Omit, 'localeText'> & { - localeText: PickersLocaleText; + localeText: PickersLocaleText; }, [localization, localeText], ); diff --git a/packages/x-date-pickers/src/internals/models/props/basePickerProps.tsx b/packages/x-date-pickers/src/internals/models/props/basePickerProps.tsx index f813fcbe197f..96488a603681 100644 --- a/packages/x-date-pickers/src/internals/models/props/basePickerProps.tsx +++ b/packages/x-date-pickers/src/internals/models/props/basePickerProps.tsx @@ -29,7 +29,7 @@ export interface BasePickerProps< * Locale for components texts. * Allows overriding texts coming from `LocalizationProvider` and `theme`. */ - localeText?: PickersInputComponentLocaleText; + localeText?: PickersInputComponentLocaleText; } /** diff --git a/packages/x-date-pickers/src/locales/beBY.ts b/packages/x-date-pickers/src/locales/beBY.ts index fde5092cd80d..ffd1ad340b2c 100644 --- a/packages/x-date-pickers/src/locales/beBY.ts +++ b/packages/x-date-pickers/src/locales/beBY.ts @@ -10,7 +10,7 @@ const views: Record = { meridiem: 'мерыдыем', }; -const beBYPickers: Partial> = { +const beBYPickers: Partial = { // Calendar navigation previousMonth: 'Папярэдні месяц', nextMonth: 'Наступны месяц', @@ -44,8 +44,8 @@ const beBYPickers: Partial> = { 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} секунд`, @@ -60,14 +60,10 @@ const beBYPickers: Partial> = { 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 diff --git a/packages/x-date-pickers/src/locales/bgBG.ts b/packages/x-date-pickers/src/locales/bgBG.ts index 5425ad03d161..d0bdc22949fa 100644 --- a/packages/x-date-pickers/src/locales/bgBG.ts +++ b/packages/x-date-pickers/src/locales/bgBG.ts @@ -9,7 +9,7 @@ const views: Record = { meridiem: 'преди обяд/след обяд', }; -const bgBGPickers: Partial> = { +const bgBGPickers: Partial = { // Calendar navigation previousMonth: 'Предишен месец', nextMonth: 'Следващ месец', @@ -43,8 +43,8 @@ const bgBGPickers: Partial> = { dateRangePickerToolbarTitle: 'Избери времеви период', // Clock labels - clockLabelText: (view, time, adapter) => - `Избери ${views[view]}. ${time === null ? 'Не е избран час' : `Избраният час е ${adapter.format(time, 'fullTime')}`}`, + clockLabelText: (view, formattedTime) => + `Избери ${views[view]}. ${!formattedTime ? 'Не е избран час' : `Избраният час е ${formattedTime}`}`, hoursClockNumberText: (hours) => `${hours} часа`, minutesClockNumberText: (minutes) => `${minutes} минути`, secondsClockNumberText: (seconds) => `${seconds} секунди`, @@ -59,14 +59,10 @@ const bgBGPickers: Partial> = { 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: (formattedDate) => + formattedDate ? `Избери дата, избраната дата е ${formattedDate}` : 'Избери дата', + openTimePickerDialogue: (formattedTime) => + formattedTime ? `Избери час, избраният час е ${formattedTime}` : 'Избери час', fieldClearLabel: 'Изчисти стойност', // Table labels diff --git a/packages/x-date-pickers/src/locales/caES.ts b/packages/x-date-pickers/src/locales/caES.ts index a0f05b0cd908..15b212206d21 100644 --- a/packages/x-date-pickers/src/locales/caES.ts +++ b/packages/x-date-pickers/src/locales/caES.ts @@ -9,7 +9,7 @@ const views: Record = { meridiem: 'Meridià', }; -const caESPickers: Partial> = { +const caESPickers: Partial = { // Calendar navigation previousMonth: 'Mes anterior', nextMonth: 'Mes següent', @@ -43,8 +43,8 @@ const caESPickers: Partial> = { dateRangePickerToolbarTitle: 'Seleccionar rang de dates', // Clock labels - 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')}`}`, + clockLabelText: (view, formattedTime) => + `Selecciona ${views[view]}. ${!formattedTime ? 'Hora no seleccionada' : `L'hora seleccionada és ${formattedTime}`}`, hoursClockNumberText: (hours) => `${hours} hores`, minutesClockNumberText: (minutes) => `${minutes} minuts`, secondsClockNumberText: (seconds) => `${seconds} segons`, @@ -59,14 +59,10 @@ const caESPickers: Partial> = { calendarWeekNumberText: (weekNumber) => `${weekNumber}`, // Open picker labels - 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", + openDatePickerDialogue: (formattedDate) => + formattedDate ? `Tria la data, la data triada és ${formattedDate}` : 'Tria la data', + openTimePickerDialogue: (formattedTime) => + formattedTime ? `Tria l'hora, l'hora triada és ${formattedTime}` : "Tria l'hora", fieldClearLabel: 'Netega el valor', // Table labels diff --git a/packages/x-date-pickers/src/locales/csCZ.ts b/packages/x-date-pickers/src/locales/csCZ.ts index a419db112f53..1c8542f2a1db 100644 --- a/packages/x-date-pickers/src/locales/csCZ.ts +++ b/packages/x-date-pickers/src/locales/csCZ.ts @@ -10,7 +10,7 @@ const timeViews: Record = { meridiem: 'Odpoledne', }; -const csCZPickers: Partial> = { +const csCZPickers: Partial = { // Calendar navigation previousMonth: 'Předchozí měsíc', nextMonth: 'Další měsíc', @@ -44,8 +44,8 @@ const csCZPickers: Partial> = { dateRangePickerToolbarTitle: 'Vyberete rozmezí dat', // Clock labels - 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')}`}`, + clockLabelText: (view, formattedTime) => + `${timeViews[view] ?? view} vybrány. ${!formattedTime ? 'Není vybrán čas' : `Vybraný čas je ${formattedTime}`}`, hoursClockNumberText: (hours) => `${hours} hodin`, minutesClockNumberText: (minutes) => `${minutes} minut`, secondsClockNumberText: (seconds) => `${seconds} sekund`, @@ -60,14 +60,10 @@ const csCZPickers: Partial> = { calendarWeekNumberText: (weekNumber) => `${weekNumber}`, // Open picker labels - 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', + openDatePickerDialogue: (formattedDate) => + formattedDate ? `Vyberte datum, vybrané datum je ${formattedDate}` : 'Vyberte datum', + openTimePickerDialogue: (formattedTime) => + formattedTime ? `Vyberte čas, vybraný čas je ${formattedTime}` : 'Vyberte čas', fieldClearLabel: 'Vymazat', // Table labels diff --git a/packages/x-date-pickers/src/locales/daDK.ts b/packages/x-date-pickers/src/locales/daDK.ts index cacd45248825..6032cec2aa9a 100644 --- a/packages/x-date-pickers/src/locales/daDK.ts +++ b/packages/x-date-pickers/src/locales/daDK.ts @@ -10,7 +10,7 @@ const timeViews: Record = { meridiem: 'Meridiem', }; -const daDKPickers: Partial> = { +const daDKPickers: Partial = { // Calendar navigation previousMonth: 'Forrige måned', nextMonth: 'Næste måned', @@ -44,8 +44,8 @@ const daDKPickers: Partial> = { dateRangePickerToolbarTitle: 'Vælg datointerval', // Clock labels - 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')}`}`, + clockLabelText: (view, formattedTime) => + `Vælg ${timeViews[view] ?? view}. ${!formattedTime ? 'Intet tidspunkt valgt' : `Valgte tidspunkt er ${formattedTime}`}`, hoursClockNumberText: (hours) => `${hours} timer`, minutesClockNumberText: (minutes) => `${minutes} minutter`, secondsClockNumberText: (seconds) => `${seconds} sekunder`, @@ -60,14 +60,10 @@ const daDKPickers: Partial> = { calendarWeekNumberText: (weekNumber) => `${weekNumber}`, // Open picker labels - 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', + openDatePickerDialogue: (formattedDate) => + formattedDate ? `Vælg dato, valgte dato er ${formattedDate}` : 'Vælg dato', + openTimePickerDialogue: (formattedTime) => + formattedTime ? `Vælg tidspunkt, valgte tidspunkt er ${formattedTime}` : 'Vælg tidspunkt', fieldClearLabel: 'ryd felt', // Table labels diff --git a/packages/x-date-pickers/src/locales/deDE.ts b/packages/x-date-pickers/src/locales/deDE.ts index 197ebad04770..b0f492771c02 100644 --- a/packages/x-date-pickers/src/locales/deDE.ts +++ b/packages/x-date-pickers/src/locales/deDE.ts @@ -10,7 +10,7 @@ const timeViews: Record = { meridiem: 'Meridiem', }; -const deDEPickers: Partial> = { +const deDEPickers: Partial = { // Calendar navigation previousMonth: 'Letzter Monat', nextMonth: 'Nächster Monat', @@ -44,8 +44,8 @@ const deDEPickers: Partial> = { dateRangePickerToolbarTitle: 'Datumsbereich auswählen', // Clock labels - 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')}`}`, + clockLabelText: (view, formattedTime) => + `${timeViews[view] ?? view} auswählen. ${!formattedTime ? 'Keine Uhrzeit ausgewählt' : `Gewählte Uhrzeit ist ${formattedTime}`}`, hoursClockNumberText: (hours) => `${hours} ${timeViews.hours}`, minutesClockNumberText: (minutes) => `${minutes} ${timeViews.minutes}`, secondsClockNumberText: (seconds) => `${seconds} ${timeViews.seconds}`, @@ -60,13 +60,11 @@ const deDEPickers: Partial> = { calendarWeekNumberText: (weekNumber) => `${weekNumber}`, // Open picker labels - 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')}` + openDatePickerDialogue: (formattedDate) => + formattedDate ? `Datum auswählen, gewähltes Datum ist ${formattedDate}` : 'Datum auswählen', + openTimePickerDialogue: (formattedTime) => + formattedTime + ? `Uhrzeit auswählen, gewählte Uhrzeit ist ${formattedTime}` : 'Uhrzeit auswählen', fieldClearLabel: 'Wert leeren', diff --git a/packages/x-date-pickers/src/locales/elGR.ts b/packages/x-date-pickers/src/locales/elGR.ts index ed9f82185460..29ff14b95d39 100644 --- a/packages/x-date-pickers/src/locales/elGR.ts +++ b/packages/x-date-pickers/src/locales/elGR.ts @@ -9,7 +9,7 @@ const views: Record = { meridiem: 'μεσημβρία', }; -const elGRPickers: Partial> = { +const elGRPickers: Partial = { // Calendar navigation previousMonth: 'Προηγούμενος μήνας', nextMonth: 'Επόμενος μήνας', @@ -43,8 +43,8 @@ const elGRPickers: Partial> = { 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} δευτερόλεπτα`, @@ -59,14 +59,12 @@ const elGRPickers: Partial> = { calendarWeekNumberText: (weekNumber) => `${weekNumber}`, // Open picker labels - openDatePickerDialogue: (value, utils, formattedDate) => - formattedDate || (value !== null && utils.isValid(value)) - ? `Επιλέξτε ημερομηνία, η επιλεγμένη ημερομηνία είναι ${formattedDate ?? utils.format(value, 'fullDate')}` + openDatePickerDialogue: (formattedDate) => + formattedDate + ? `Επιλέξτε ημερομηνία, η επιλεγμένη ημερομηνία είναι ${formattedDate}` : 'Επιλέξτε ημερομηνία', - openTimePickerDialogue: (value, utils, formattedTime) => - formattedTime || (value !== null && utils.isValid(value)) - ? `Επιλέξτε ώρα, η επιλεγμένη ώρα είναι ${formattedTime ?? utils.format(value, 'fullTime')}` - : 'Επιλέξτε ώρα', + openTimePickerDialogue: (formattedTime) => + formattedTime ? `Επιλέξτε ώρα, η επιλεγμένη ώρα είναι ${formattedTime}` : 'Επιλέξτε ώρα', // fieldClearLabel: 'Clear', // Table labels diff --git a/packages/x-date-pickers/src/locales/enUS.ts b/packages/x-date-pickers/src/locales/enUS.ts index 48ff83d01306..488a0681602f 100644 --- a/packages/x-date-pickers/src/locales/enUS.ts +++ b/packages/x-date-pickers/src/locales/enUS.ts @@ -3,7 +3,7 @@ import { getPickersLocalization } from './utils/getPickersLocalization'; // This object is not Partial because it is the default values -const enUSPickers: PickersLocaleText = { +const enUSPickers: PickersLocaleText = { // Calendar navigation previousMonth: 'Previous month', nextMonth: 'Next month', @@ -37,12 +37,8 @@ const enUSPickers: PickersLocaleText = { dateRangePickerToolbarTitle: 'Select date range', // Clock labels - clockLabelText: (view, time, utils, formattedTime) => - `Select ${view}. ${ - !formattedTime && (time === null || !utils.isValid(time)) - ? 'No time selected' - : `Selected time is ${formattedTime ?? utils.format(time, 'fullTime')}` - }`, + clockLabelText: (view, formattedTime) => + `Select ${view}. ${!formattedTime ? 'No time selected' : `Selected time is ${formattedTime}`}`, hoursClockNumberText: (hours) => `${hours} hours`, minutesClockNumberText: (minutes) => `${minutes} minutes`, secondsClockNumberText: (seconds) => `${seconds} seconds`, @@ -57,14 +53,10 @@ const enUSPickers: PickersLocaleText = { calendarWeekNumberText: (weekNumber) => `${weekNumber}`, // Open picker labels - 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', + openDatePickerDialogue: (formattedDate) => + formattedDate ? `Choose date, selected date is ${formattedDate}` : 'Choose date', + openTimePickerDialogue: (formattedTime) => + formattedTime ? `Choose time, selected time is ${formattedTime}` : 'Choose time', fieldClearLabel: 'Clear', diff --git a/packages/x-date-pickers/src/locales/esES.ts b/packages/x-date-pickers/src/locales/esES.ts index c8d94e4c6f5f..4ae68d056781 100644 --- a/packages/x-date-pickers/src/locales/esES.ts +++ b/packages/x-date-pickers/src/locales/esES.ts @@ -9,7 +9,7 @@ const views: Record = { meridiem: 'Meridiano', }; -const esESPickers: Partial> = { +const esESPickers: Partial = { // Calendar navigation previousMonth: 'Mes anterior', nextMonth: 'Mes siguiente', @@ -43,8 +43,8 @@ const esESPickers: Partial> = { dateRangePickerToolbarTitle: 'Seleccionar rango de fecha', // Clock labels - 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')}`}`, + clockLabelText: (view, formattedTime) => + `Seleccione ${views[view]}. ${!formattedTime ? 'No hay hora seleccionada' : `La hora seleccionada es ${formattedTime}`}`, hoursClockNumberText: (hours) => `${hours} horas`, minutesClockNumberText: (minutes) => `${minutes} minutos`, secondsClockNumberText: (seconds) => `${seconds} segundos`, @@ -59,14 +59,10 @@ const esESPickers: Partial> = { calendarWeekNumberText: (weekNumber) => `${weekNumber}`, // Open picker labels - 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', + openDatePickerDialogue: (formattedDate) => + formattedDate ? `Elige fecha, la fecha elegida es ${formattedDate}` : 'Elige fecha', + openTimePickerDialogue: (formattedTime) => + formattedTime ? `Elige hora, la hora elegida es ${formattedTime}` : 'Elige hora', fieldClearLabel: 'Limpiar valor', // Table labels diff --git a/packages/x-date-pickers/src/locales/eu.ts b/packages/x-date-pickers/src/locales/eu.ts index 36be6036e3ff..532c9ff4685c 100644 --- a/packages/x-date-pickers/src/locales/eu.ts +++ b/packages/x-date-pickers/src/locales/eu.ts @@ -9,7 +9,7 @@ const views: Record = { meridiem: 'meridianoa', }; -const euPickers: Partial> = { +const euPickers: Partial = { // Calendar navigation previousMonth: 'Azken hilabetea', nextMonth: 'Hurrengo hilabetea', @@ -43,8 +43,8 @@ const euPickers: Partial> = { dateRangePickerToolbarTitle: 'Data tartea aukeratu', // Clock labels - 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`}`, + clockLabelText: (view, formattedTime) => + `Aukeratu ${views[view]}. ${!formattedTime ? 'Ez da ordurik aukertau' : `Aukeratutako ordua ${formattedTime} da`}`, hoursClockNumberText: (hours) => `${hours} ordu`, minutesClockNumberText: (minutes) => `${minutes} minutu`, secondsClockNumberText: (seconds) => `${seconds} segundu`, @@ -59,14 +59,10 @@ const euPickers: Partial> = { calendarWeekNumberText: (weekNumber) => `${weekNumber}`, // Open picker labels - 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', + openDatePickerDialogue: (formattedDate) => + formattedDate ? `Data aukeratu, aukeratutako data ${formattedDate} da` : 'Data aukeratu', + openTimePickerDialogue: (formattedTime) => + formattedTime ? `Ordua aukeratu, aukeratutako ordua ${formattedTime} da` : 'Ordua aukeratu', fieldClearLabel: 'Balioa garbitu', // Table labels diff --git a/packages/x-date-pickers/src/locales/faIR.ts b/packages/x-date-pickers/src/locales/faIR.ts index bcab518ca78e..e5f64dc0bc1e 100644 --- a/packages/x-date-pickers/src/locales/faIR.ts +++ b/packages/x-date-pickers/src/locales/faIR.ts @@ -9,7 +9,7 @@ const timeViews: Record = { meridiem: 'بعد از ظهر', }; -const faIRPickers: Partial> = { +const faIRPickers: Partial = { // Calendar navigation previousMonth: 'ماه گذشته', nextMonth: 'ماه آینده', @@ -43,8 +43,8 @@ const faIRPickers: Partial> = { 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} ثانیه‌ها`, @@ -59,13 +59,13 @@ const faIRPickers: Partial> = { calendarWeekNumberText: (weekNumber) => `${weekNumber}`, // Open picker labels - openDatePickerDialogue: (value, utils, formattedDate) => - formattedDate || (value !== null && utils.isValid(value)) - ? `تاریخ را انتخاب کنید، تاریخ انتخاب شده ${formattedDate ?? utils.format(value, 'fullDate')} می‌باشد` + openDatePickerDialogue: (formattedDate) => + formattedDate + ? `تاریخ را انتخاب کنید، تاریخ انتخاب شده ${formattedDate} می‌باشد` : 'تاریخ را انتخاب کنید', - openTimePickerDialogue: (value, utils, formattedTime) => - formattedTime || (value !== null && utils.isValid(value)) - ? `ساعت را انتخاب کنید، ساعت انتخاب شده ${formattedTime ?? utils.format(value, 'fullTime')} می‌باشد` + openTimePickerDialogue: (formattedTime) => + formattedTime + ? `ساعت را انتخاب کنید، ساعت انتخاب شده ${formattedTime} می‌باشد` : 'ساعت را انتخاب کنید', fieldClearLabel: 'پاک کردن مقدار', diff --git a/packages/x-date-pickers/src/locales/fiFI.ts b/packages/x-date-pickers/src/locales/fiFI.ts index 61e1f23ddd9e..104d5e343ccb 100644 --- a/packages/x-date-pickers/src/locales/fiFI.ts +++ b/packages/x-date-pickers/src/locales/fiFI.ts @@ -9,7 +9,7 @@ const views: Record = { meridiem: 'iltapäivä', }; -const fiFIPickers: Partial> = { +const fiFIPickers: Partial = { // Calendar navigation previousMonth: 'Edellinen kuukausi', nextMonth: 'Seuraava kuukausi', @@ -43,8 +43,8 @@ const fiFIPickers: Partial> = { dateRangePickerToolbarTitle: 'Valitse aikaväli', // Clock labels - 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')}`}`, + clockLabelText: (view, formattedTime) => + `Valitse ${views[view]}. ${!formattedTime ? 'Ei aikaa valittuna' : `Valittu aika on ${formattedTime}`}`, hoursClockNumberText: (hours) => `${hours} tuntia`, minutesClockNumberText: (minutes) => `${minutes} minuuttia`, secondsClockNumberText: (seconds) => `${seconds} sekuntia`, @@ -59,14 +59,10 @@ const fiFIPickers: Partial> = { calendarWeekNumberText: (weekNumber) => `${weekNumber}`, // Open picker labels - 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', + openDatePickerDialogue: (formattedDate) => + formattedDate ? `Valitse päivä, valittu päivä on ${formattedDate}` : 'Valitse päivä', + openTimePickerDialogue: (formattedTime) => + formattedTime ? `Valitse aika, valittu aika on ${formattedTime}` : 'Valitse aika', fieldClearLabel: 'Tyhjennä arvo', // Table labels diff --git a/packages/x-date-pickers/src/locales/frFR.ts b/packages/x-date-pickers/src/locales/frFR.ts index 3e50710db585..0c80ccbcc838 100644 --- a/packages/x-date-pickers/src/locales/frFR.ts +++ b/packages/x-date-pickers/src/locales/frFR.ts @@ -9,7 +9,7 @@ const views: Record = { meridiem: 'méridien', }; -const frFRPickers: Partial> = { +const frFRPickers: Partial = { // Calendar navigation previousMonth: 'Mois précédent', nextMonth: 'Mois suivant', @@ -43,8 +43,8 @@ const frFRPickers: Partial> = { dateRangePickerToolbarTitle: 'Choisir la plage de dates', // Clock labels - 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')}`}`, + clockLabelText: (view, formattedTime) => + `Choix des ${views[view]}. ${!formattedTime ? 'Aucune heure choisie' : `L'heure choisie est ${formattedTime}`}`, hoursClockNumberText: (hours) => `${hours} heures`, minutesClockNumberText: (minutes) => `${minutes} minutes`, secondsClockNumberText: (seconds) => `${seconds} secondes`, @@ -59,13 +59,13 @@ const frFRPickers: Partial> = { calendarWeekNumberText: (weekNumber) => `${weekNumber}`, // Open picker labels - openDatePickerDialogue: (value, utils, formattedDate) => - formattedDate || (value !== null && utils.isValid(value)) - ? `Choisir la date, la date sélectionnée est ${formattedDate ?? utils.format(value, 'fullDate')}` + openDatePickerDialogue: (formattedDate) => + formattedDate + ? `Choisir la date, la date sélectionnée est ${formattedDate}` : 'Choisir la date', - openTimePickerDialogue: (value, utils, formattedTime) => + openTimePickerDialogue: (formattedTime) => formattedTime - ? `Choisir l'heure, l'heure sélectionnée est ${formattedTime ?? utils.format(value, 'fullTime')}` + ? `Choisir l'heure, l'heure sélectionnée est ${formattedTime}` : "Choisir l'heure", fieldClearLabel: 'Effacer la valeur', diff --git a/packages/x-date-pickers/src/locales/heIL.ts b/packages/x-date-pickers/src/locales/heIL.ts index 2102a2a23c48..ed3adcef3f4b 100644 --- a/packages/x-date-pickers/src/locales/heIL.ts +++ b/packages/x-date-pickers/src/locales/heIL.ts @@ -9,7 +9,7 @@ const views: Record = { meridiem: 'מרידיאם', }; -const heILPickers: Partial> = { +const heILPickers: Partial = { // Calendar navigation previousMonth: 'חודש קודם', nextMonth: 'חודש הבא', @@ -43,8 +43,8 @@ const heILPickers: Partial> = { 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} שניות`, @@ -59,14 +59,10 @@ const heILPickers: Partial> = { 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 diff --git a/packages/x-date-pickers/src/locales/hrHR.ts b/packages/x-date-pickers/src/locales/hrHR.ts index 0f83f17a9d6b..c1a276282387 100644 --- a/packages/x-date-pickers/src/locales/hrHR.ts +++ b/packages/x-date-pickers/src/locales/hrHR.ts @@ -10,7 +10,7 @@ const timeViews: Record = { meridiem: 'meridiem', }; -const hrHRPickers: Partial> = { +const hrHRPickers: Partial = { // Calendar navigation previousMonth: 'Prethodni mjesec', nextMonth: 'Naredni mjesec', @@ -44,8 +44,8 @@ const hrHRPickers: Partial> = { dateRangePickerToolbarTitle: 'Odaberi vremenski okvir', // Clock labels - clockLabelText: (view, time, utils, formattedTime) => - `Odaberi ${timeViews[view] ?? view}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Vrijeme nije odabrano' : `Odabrano vrijeme je ${formattedTime ?? utils.format(time, 'fullTime')}`}`, + clockLabelText: (view, formattedTime) => + `Odaberi ${timeViews[view] ?? view}. ${!formattedTime ? 'Vrijeme nije odabrano' : `Odabrano vrijeme je ${formattedTime}`}`, hoursClockNumberText: (hours) => { let suffix = 'sati'; if (Number(hours) === 1) { @@ -77,14 +77,10 @@ const hrHRPickers: Partial> = { calendarWeekNumberText: (weekNumber) => `${weekNumber}`, // Open picker labels - openDatePickerDialogue: (value, utils, formattedDate) => - formattedDate || (value !== null && utils.isValid(value)) - ? `Odaberi datum, odabrani datum je ${formattedDate ?? utils.format(value, 'fullDate')}` - : 'Odaberi datum', - openTimePickerDialogue: (value, utils, formattedTime) => - formattedTime || (value !== null && utils.isValid(value)) - ? `Odaberi vrijeme, odabrano vrijeme je ${formattedTime ?? utils.format(value, 'fullTime')}` - : 'Odaberi vrijeme', + openDatePickerDialogue: (formattedDate) => + formattedDate ? `Odaberi datum, odabrani datum je ${formattedDate}` : 'Odaberi datum', + openTimePickerDialogue: (formattedTime) => + formattedTime ? `Odaberi vrijeme, odabrano vrijeme je ${formattedTime}` : 'Odaberi vrijeme', fieldClearLabel: 'Izbriši', // Table labels diff --git a/packages/x-date-pickers/src/locales/huHU.ts b/packages/x-date-pickers/src/locales/huHU.ts index df92c047482b..5852e7539d5d 100644 --- a/packages/x-date-pickers/src/locales/huHU.ts +++ b/packages/x-date-pickers/src/locales/huHU.ts @@ -10,7 +10,7 @@ const timeViews: Record = { meridiem: 'Délután', }; -const huHUPickers: Partial> = { +const huHUPickers: Partial = { // Calendar navigation previousMonth: 'Előző hónap', nextMonth: 'Következő hónap', @@ -44,8 +44,8 @@ const huHUPickers: Partial> = { dateRangePickerToolbarTitle: 'Dátumhatárok kiválasztása', // Clock labels - 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')}`}`, + clockLabelText: (view, formattedTime) => + `${timeViews[view] ?? view} kiválasztása. ${!formattedTime ? 'Nincs kiválasztva idő' : `A kiválasztott idő ${formattedTime}`}`, hoursClockNumberText: (hours) => `${hours} ${timeViews.hours.toLowerCase()}`, minutesClockNumberText: (minutes) => `${minutes} ${timeViews.minutes.toLowerCase()}`, secondsClockNumberText: (seconds) => `${seconds} ${timeViews.seconds.toLowerCase()}`, @@ -60,14 +60,12 @@ const huHUPickers: Partial> = { calendarWeekNumberText: (weekNumber) => `${weekNumber}`, // Open picker labels - openDatePickerDialogue: (value, utils, formattedDate) => - formattedDate || (value !== null && utils.isValid(value)) - ? `Válasszon dátumot, a kiválasztott dátum: ${formattedDate ?? utils.format(value, 'fullDate')}` + openDatePickerDialogue: (formattedDate) => + formattedDate + ? `Válasszon dátumot, a kiválasztott dátum: ${formattedDate}` : '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', + openTimePickerDialogue: (formattedTime) => + formattedTime ? `Válasszon időt, a kiválasztott idő: ${formattedTime}` : 'Válasszon időt', fieldClearLabel: 'Tartalom ürítése', // Table labels diff --git a/packages/x-date-pickers/src/locales/isIS.ts b/packages/x-date-pickers/src/locales/isIS.ts index eb2095b75d29..7484608914db 100644 --- a/packages/x-date-pickers/src/locales/isIS.ts +++ b/packages/x-date-pickers/src/locales/isIS.ts @@ -9,7 +9,7 @@ const timeViews: Record = { meridiem: 'eftirmiðdagur', }; -const isISPickers: Partial> = { +const isISPickers: Partial = { // Calendar navigation previousMonth: 'Fyrri mánuður', nextMonth: 'Næsti mánuður', @@ -43,8 +43,8 @@ const isISPickers: Partial> = { dateRangePickerToolbarTitle: 'Velja tímabil', // Clock labels - 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')}`}`, + clockLabelText: (view, formattedTime) => + `Velja ${timeViews[view]}. ${!formattedTime ? 'Enginn tími valinn' : `Valinn tími er ${formattedTime}`}`, hoursClockNumberText: (hours) => `${hours} klukkustundir`, minutesClockNumberText: (minutes) => `${minutes} mínútur`, secondsClockNumberText: (seconds) => `${seconds} sekúndur`, @@ -59,14 +59,10 @@ const isISPickers: Partial> = { calendarWeekNumberText: (weekNumber) => `${weekNumber}`, // Open picker labels - 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', + openDatePickerDialogue: (formattedDate) => + formattedDate ? `Velja dagsetningu, valin dagsetning er ${formattedDate}` : 'Velja dagsetningu', + openTimePickerDialogue: (formattedTime) => + formattedTime ? `Velja tíma, valinn tími er ${formattedTime}` : 'Velja tíma', // fieldClearLabel: 'Clear', // Table labels diff --git a/packages/x-date-pickers/src/locales/itIT.ts b/packages/x-date-pickers/src/locales/itIT.ts index d88041c3aba4..570e6e905fe5 100644 --- a/packages/x-date-pickers/src/locales/itIT.ts +++ b/packages/x-date-pickers/src/locales/itIT.ts @@ -9,7 +9,7 @@ const views: Record = { meridiem: 'il meridiano', }; -const itITPickers: Partial> = { +const itITPickers: Partial = { // Calendar navigation previousMonth: 'Mese precedente', nextMonth: 'Mese successivo', @@ -43,8 +43,8 @@ const itITPickers: Partial> = { dateRangePickerToolbarTitle: 'Seleziona intervallo di date', // Clock labels - 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')}`}`, + clockLabelText: (view, formattedTime) => + `Seleziona ${views[view]}. ${!formattedTime ? 'Nessun orario selezionato' : `L'ora selezionata è ${formattedTime}`}`, hoursClockNumberText: (hours) => `${hours} ore`, minutesClockNumberText: (minutes) => `${minutes} minuti`, secondsClockNumberText: (seconds) => `${seconds} secondi`, @@ -59,14 +59,10 @@ const itITPickers: Partial> = { calendarWeekNumberText: (weekNumber) => `${weekNumber}`, // Open picker labels - 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", + openDatePickerDialogue: (formattedDate) => + formattedDate ? `Scegli la data, la data selezionata è ${formattedDate}` : 'Scegli la data', + openTimePickerDialogue: (formattedTime) => + formattedTime ? `Scegli l'ora, l'ora selezionata è ${formattedTime}` : "Scegli l'ora", fieldClearLabel: 'Cancella valore', // Table labels diff --git a/packages/x-date-pickers/src/locales/jaJP.ts b/packages/x-date-pickers/src/locales/jaJP.ts index bddc697c9f1f..e76438b6164a 100644 --- a/packages/x-date-pickers/src/locales/jaJP.ts +++ b/packages/x-date-pickers/src/locales/jaJP.ts @@ -10,7 +10,7 @@ const timeViews: Record = { meridiem: 'メリディム', }; -const jaJPPickers: Partial> = { +const jaJPPickers: Partial = { // Calendar navigation previousMonth: '先月', nextMonth: '来月', @@ -44,8 +44,8 @@ const jaJPPickers: Partial> = { dateRangePickerToolbarTitle: '日付の範囲を選択', // Clock labels - clockLabelText: (view, time, utils, formattedTime) => - `${timeViews[view] ?? view}を選択してください ${!formattedTime && (time === null || !utils.isValid(time)) ? '時間が選択されていません' : `選択した時間は ${formattedTime ?? utils.format(time, 'fullTime')} です`}`, + clockLabelText: (view, formattedTime) => + `${timeViews[view] ?? view}を選択してください ${!formattedTime ? '時間が選択されていません' : `選択した時間は ${formattedTime} です`}`, hoursClockNumberText: (hours) => `${hours} ${timeViews.hours}`, minutesClockNumberText: (minutes) => `${minutes} ${timeViews.minutes}`, secondsClockNumberText: (seconds) => `${seconds} ${timeViews.seconds}`, @@ -60,13 +60,13 @@ const jaJPPickers: Partial> = { calendarWeekNumberText: (weekNumber) => `${weekNumber}`, // Open picker labels - openDatePickerDialogue: (value, utils, formattedDate) => - formattedDate || (value !== null && utils.isValid(value)) - ? `日付を選択してください。選択した日付は ${formattedDate ?? utils.format(value, 'fullDate')} です` + openDatePickerDialogue: (formattedDate) => + formattedDate + ? `日付を選択してください。選択した日付は ${formattedDate} です` : '日付を選択してください', - openTimePickerDialogue: (value, utils, formattedTime) => - formattedTime || (value !== null && utils.isValid(value)) - ? `時間を選択してください。選択した時間は ${formattedTime ?? utils.format(value, 'fullTime')} です` + openTimePickerDialogue: (formattedTime) => + formattedTime + ? `時間を選択してください。選択した時間は ${formattedTime} です` : '時間を選択してください', fieldClearLabel: 'クリア', diff --git a/packages/x-date-pickers/src/locales/koKR.ts b/packages/x-date-pickers/src/locales/koKR.ts index 6b72286dba1e..52ff53f41fa6 100644 --- a/packages/x-date-pickers/src/locales/koKR.ts +++ b/packages/x-date-pickers/src/locales/koKR.ts @@ -9,7 +9,7 @@ const views: Record = { meridiem: '오전/오후를', }; -const koKRPickers: Partial> = { +const koKRPickers: Partial = { // Calendar navigation previousMonth: '이전 달', nextMonth: '다음 달', @@ -43,8 +43,8 @@ const koKRPickers: Partial> = { 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}초`, @@ -59,13 +59,13 @@ const koKRPickers: Partial> = { calendarWeekNumberText: (weekNumber) => `${weekNumber}`, // Open picker labels - openDatePickerDialogue: (value, utils, formattedDate) => - formattedDate || (value !== null && utils.isValid(value)) - ? `날짜를 선택하세요. 현재 선택된 날짜는 ${formattedDate ?? utils.format(value, 'fullDate')}입니다.` + openDatePickerDialogue: (formattedDate) => + formattedDate + ? `날짜를 선택하세요. 현재 선택된 날짜는 ${formattedDate}입니다.` : '날짜를 선택하세요', - openTimePickerDialogue: (value, utils, formattedTime) => - formattedTime || (value !== null && utils.isValid(value)) - ? `시간을 선택하세요. 현재 선택된 시간은 ${formattedTime ?? utils.format(value, 'fullTime')}입니다.` + openTimePickerDialogue: (formattedTime) => + formattedTime + ? `시간을 선택하세요. 현재 선택된 시간은 ${formattedTime}입니다.` : '시간을 선택하세요', fieldClearLabel: '지우기', diff --git a/packages/x-date-pickers/src/locales/kzKZ.ts b/packages/x-date-pickers/src/locales/kzKZ.ts index 938350a57f04..1205ba488073 100644 --- a/packages/x-date-pickers/src/locales/kzKZ.ts +++ b/packages/x-date-pickers/src/locales/kzKZ.ts @@ -10,7 +10,7 @@ const timeViews: Record = { meridiem: 'Меридием', }; -const kzKZPickers: Partial> = { +const kzKZPickers: Partial = { // Calendar navigation previousMonth: 'Алдыңғы ай', nextMonth: 'Келесі ай', @@ -44,8 +44,8 @@ const kzKZPickers: Partial> = { 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} секунд`, @@ -60,14 +60,10 @@ const kzKZPickers: Partial> = { 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 diff --git a/packages/x-date-pickers/src/locales/mk.ts b/packages/x-date-pickers/src/locales/mk.ts index c5e965e450e6..bc76dbabce87 100644 --- a/packages/x-date-pickers/src/locales/mk.ts +++ b/packages/x-date-pickers/src/locales/mk.ts @@ -3,7 +3,7 @@ import { getPickersLocalization } from './utils/getPickersLocalization'; // This object is not Partial because it is the default values -const mkPickers: Partial> = { +const mkPickers: Partial = { // Calendar navigation previousMonth: 'Предходен месец', nextMonth: 'Следен месец', @@ -37,8 +37,8 @@ const mkPickers: Partial> = { dateRangePickerToolbarTitle: 'Избери временски опсег', // Clock labels - clockLabelText: (view, time, utils, formattedTime) => - `Select ${view}. ${!formattedTime && (time === null || !utils.isValid(time)) ? 'Нема избрано време' : `Избраното време е ${formattedTime ?? utils.format(time, 'fullTime')}`}`, + clockLabelText: (view, formattedTime) => + `Select ${view}. ${!formattedTime ? 'Нема избрано време' : `Избраното време е ${formattedTime}`}`, hoursClockNumberText: (hours) => `${hours} часа`, minutesClockNumberText: (minutes) => `${minutes} минути`, secondsClockNumberText: (seconds) => `${seconds} секунди`, @@ -53,14 +53,10 @@ const mkPickers: Partial> = { 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 diff --git a/packages/x-date-pickers/src/locales/nbNO.ts b/packages/x-date-pickers/src/locales/nbNO.ts index 8e9582788593..57732c773daa 100644 --- a/packages/x-date-pickers/src/locales/nbNO.ts +++ b/packages/x-date-pickers/src/locales/nbNO.ts @@ -9,7 +9,7 @@ const timeViews: Record = { meridiem: 'meridiem', }; -const nbNOPickers: Partial> = { +const nbNOPickers: Partial = { // Calendar navigation previousMonth: 'Forrige måned', nextMonth: 'Neste måned', @@ -43,8 +43,8 @@ const nbNOPickers: Partial> = { dateRangePickerToolbarTitle: 'Velg datoperiode', // Clock labels - 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')}`}`, + clockLabelText: (view, formattedTime) => + `Velg ${timeViews[view]}. ${!formattedTime ? 'Ingen tid valgt' : `Valgt tid er ${formattedTime}`}`, hoursClockNumberText: (hours) => `${hours} timer`, minutesClockNumberText: (minutes) => `${minutes} minutter`, secondsClockNumberText: (seconds) => `${seconds} sekunder`, @@ -59,14 +59,10 @@ const nbNOPickers: Partial> = { calendarWeekNumberText: (weekNumber) => `${weekNumber}`, // Open picker labels - 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', + openDatePickerDialogue: (formattedDate) => + formattedDate ? `Velg dato, valgt dato er ${formattedDate}` : 'Velg dato', + openTimePickerDialogue: (formattedTime) => + formattedTime ? `Velg tid, valgt tid er ${formattedTime}` : 'Velg tid', // fieldClearLabel: 'Clear', // Table labels diff --git a/packages/x-date-pickers/src/locales/nlNL.ts b/packages/x-date-pickers/src/locales/nlNL.ts index 6c8f7d3490d0..a8f167718b2c 100644 --- a/packages/x-date-pickers/src/locales/nlNL.ts +++ b/packages/x-date-pickers/src/locales/nlNL.ts @@ -9,7 +9,7 @@ const timeViews: Record = { meridiem: 'meridium', }; -const nlNLPickers: Partial> = { +const nlNLPickers: Partial = { // Calendar navigation previousMonth: 'Vorige maand', nextMonth: 'Volgende maand', @@ -43,8 +43,8 @@ const nlNLPickers: Partial> = { dateRangePickerToolbarTitle: 'Selecteer datumbereik', // Clock labels - 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')}`}`, + clockLabelText: (view, formattedTime) => + `Selecteer ${timeViews[view]}. ${!formattedTime ? 'Geen tijd geselecteerd' : `Geselecteerde tijd is ${formattedTime}`}`, hoursClockNumberText: (hours) => `${hours} uren`, minutesClockNumberText: (minutes) => `${minutes} minuten`, secondsClockNumberText: (seconds) => `${seconds} seconden`, @@ -59,14 +59,10 @@ const nlNLPickers: Partial> = { calendarWeekNumberText: (weekNumber) => `${weekNumber}`, // Open picker labels - 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', + openDatePickerDialogue: (formattedDate) => + formattedDate ? `Kies datum, geselecteerde datum is ${formattedDate}` : 'Kies datum', + openTimePickerDialogue: (formattedTime) => + formattedTime ? `Kies tijd, geselecteerde tijd is ${formattedTime}` : 'Kies tijd', fieldClearLabel: 'Wissen', // Table labels diff --git a/packages/x-date-pickers/src/locales/nnNO.ts b/packages/x-date-pickers/src/locales/nnNO.ts index e547e022647c..b80155914958 100644 --- a/packages/x-date-pickers/src/locales/nnNO.ts +++ b/packages/x-date-pickers/src/locales/nnNO.ts @@ -9,7 +9,7 @@ const timeViews: Record = { meridiem: 'meridiem', }; -const nnNOPickers: Partial> = { +const nnNOPickers: Partial = { // Calendar navigation previousMonth: 'Forrige månad', nextMonth: 'Neste månad', @@ -43,8 +43,8 @@ const nnNOPickers: Partial> = { dateRangePickerToolbarTitle: 'Vel datoperiode', // Clock labels - 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')}`}`, + clockLabelText: (view, formattedTime) => + `Vel ${timeViews[view]}. ${!formattedTime ? 'Ingen tid vald' : `Vald tid er ${formattedTime}`}`, hoursClockNumberText: (hours) => `${hours} timar`, minutesClockNumberText: (minutes) => `${minutes} minuttar`, secondsClockNumberText: (seconds) => `${seconds} sekundar`, @@ -59,14 +59,10 @@ const nnNOPickers: Partial> = { calendarWeekNumberText: (weekNumber) => `${weekNumber}`, // Open picker labels - 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', + openDatePickerDialogue: (formattedDate) => + formattedDate ? `Vel dato, vald dato er ${formattedDate}` : 'Vel dato', + openTimePickerDialogue: (formattedTime) => + formattedTime ? `Vel tid, vald tid er ${formattedTime}` : 'Vel tid', fieldClearLabel: 'Fjern verdi', // Table labels diff --git a/packages/x-date-pickers/src/locales/plPL.ts b/packages/x-date-pickers/src/locales/plPL.ts index 52c04ba46ad5..a65ce59c360d 100644 --- a/packages/x-date-pickers/src/locales/plPL.ts +++ b/packages/x-date-pickers/src/locales/plPL.ts @@ -9,7 +9,7 @@ const timeViews: Record = { meridiem: 'popołudnie', }; -const plPLPickers: Partial> = { +const plPLPickers: Partial = { // Calendar navigation previousMonth: 'Poprzedni miesiąc', nextMonth: 'Następny miesiąc', @@ -43,8 +43,8 @@ const plPLPickers: Partial> = { dateRangePickerToolbarTitle: 'Wybierz zakres dat', // Clock labels - 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')}`}`, + clockLabelText: (view, formattedTime) => + `Wybierz ${timeViews[view]}. ${!formattedTime ? 'Nie wybrano czasu' : `Wybrany czas to ${formattedTime}`}`, hoursClockNumberText: (hours) => `${hours} godzin`, minutesClockNumberText: (minutes) => `${minutes} minut`, secondsClockNumberText: (seconds) => `${seconds} sekund`, @@ -59,14 +59,10 @@ const plPLPickers: Partial> = { calendarWeekNumberText: (weekNumber) => `${weekNumber}`, // Open picker labels - 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', + openDatePickerDialogue: (formattedDate) => + formattedDate ? `Wybierz datę, obecnie wybrana data to ${formattedDate}` : 'Wybierz datę', + openTimePickerDialogue: (formattedTime) => + formattedTime ? `Wybierz czas, obecnie wybrany czas to ${formattedTime}` : 'Wybierz czas', // fieldClearLabel: 'Clear', // Table labels diff --git a/packages/x-date-pickers/src/locales/ptBR.ts b/packages/x-date-pickers/src/locales/ptBR.ts index b136e208f023..2f78696135fa 100644 --- a/packages/x-date-pickers/src/locales/ptBR.ts +++ b/packages/x-date-pickers/src/locales/ptBR.ts @@ -9,7 +9,7 @@ const timeViews: Record = { meridiem: 'meridiano', }; -const ptBRPickers: Partial> = { +const ptBRPickers: Partial = { // Calendar navigation previousMonth: 'Mês anterior', nextMonth: 'Próximo mês', @@ -43,8 +43,8 @@ const ptBRPickers: Partial> = { dateRangePickerToolbarTitle: 'Selecione o intervalo entre 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`, @@ -59,14 +59,13 @@ const ptBRPickers: Partial> = { calendarWeekNumberText: (weekNumber) => `${weekNumber}`, // Open picker labels - 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', + openDatePickerDialogue: (formattedDate) => { + return formattedDate + ? `Escolha uma data, data selecionada ${formattedDate}` + : 'Escolha uma data'; + }, + openTimePickerDialogue: (formattedTime) => + formattedTime ? `Escolha uma hora, hora selecionada ${formattedTime}` : 'Escolha uma hora', fieldClearLabel: 'Limpar valor', // Table labels diff --git a/packages/x-date-pickers/src/locales/ptPT.ts b/packages/x-date-pickers/src/locales/ptPT.ts index 290f1c3d3e23..0432c7f5821a 100644 --- a/packages/x-date-pickers/src/locales/ptPT.ts +++ b/packages/x-date-pickers/src/locales/ptPT.ts @@ -9,7 +9,7 @@ const timeViews: Record = { meridiem: 'meridiano', }; -const ptPTPickers: Partial> = { +const ptPTPickers: Partial = { // Calendar navigation previousMonth: 'Mês anterior', nextMonth: 'Próximo mês', @@ -43,8 +43,8 @@ const ptPTPickers: Partial> = { 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`, @@ -59,14 +59,10 @@ const ptPTPickers: Partial> = { 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 diff --git a/packages/x-date-pickers/src/locales/roRO.ts b/packages/x-date-pickers/src/locales/roRO.ts index 61ea968f77a9..d14bca8bc3b7 100644 --- a/packages/x-date-pickers/src/locales/roRO.ts +++ b/packages/x-date-pickers/src/locales/roRO.ts @@ -10,7 +10,7 @@ const timeViews: Record = { meridiem: 'Meridiane', }; -const roROPickers: Partial> = { +const roROPickers: Partial = { // Calendar navigation previousMonth: 'Luna anterioară', nextMonth: 'Luna următoare', @@ -44,8 +44,8 @@ const roROPickers: Partial> = { 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}`, @@ -60,14 +60,10 @@ const roROPickers: Partial> = { 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 diff --git a/packages/x-date-pickers/src/locales/ruRU.ts b/packages/x-date-pickers/src/locales/ruRU.ts index 6b9286b59cb2..58292619984d 100644 --- a/packages/x-date-pickers/src/locales/ruRU.ts +++ b/packages/x-date-pickers/src/locales/ruRU.ts @@ -10,7 +10,7 @@ const timeViews: Record = { meridiem: 'меридием', }; -const ruRUPickers: Partial> = { +const ruRUPickers: Partial = { // Calendar navigation previousMonth: 'Предыдущий месяц', nextMonth: 'Следующий месяц', @@ -44,8 +44,8 @@ const ruRUPickers: Partial> = { 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} секунд`, @@ -60,14 +60,10 @@ const ruRUPickers: Partial> = { 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 diff --git a/packages/x-date-pickers/src/locales/skSK.ts b/packages/x-date-pickers/src/locales/skSK.ts index 4030651f7e0a..f8d7a4a30016 100644 --- a/packages/x-date-pickers/src/locales/skSK.ts +++ b/packages/x-date-pickers/src/locales/skSK.ts @@ -10,7 +10,7 @@ const timeViews: Record = { meridiem: 'Popoludnie', }; -const skSKPickers: Partial> = { +const skSKPickers: Partial = { // Calendar navigation previousMonth: 'Ďalší mesiac', nextMonth: 'Predchádzajúci mesiac', @@ -44,8 +44,8 @@ const skSKPickers: Partial> = { 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`, @@ -60,14 +60,10 @@ const skSKPickers: Partial> = { 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 diff --git a/packages/x-date-pickers/src/locales/svSE.ts b/packages/x-date-pickers/src/locales/svSE.ts index 339919c475ba..31c1c70bf319 100644 --- a/packages/x-date-pickers/src/locales/svSE.ts +++ b/packages/x-date-pickers/src/locales/svSE.ts @@ -9,7 +9,7 @@ const timeViews: Record = { meridiem: 'meridiem', }; -const svSEPickers: Partial> = { +const svSEPickers: Partial = { // Calendar navigation previousMonth: 'Föregående månad', nextMonth: 'Nästa månad', @@ -43,8 +43,8 @@ const svSEPickers: Partial> = { 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`, @@ -59,14 +59,10 @@ const svSEPickers: Partial> = { 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 diff --git a/packages/x-date-pickers/src/locales/trTR.ts b/packages/x-date-pickers/src/locales/trTR.ts index 8c49e3bb9e2a..567e42a17830 100644 --- a/packages/x-date-pickers/src/locales/trTR.ts +++ b/packages/x-date-pickers/src/locales/trTR.ts @@ -9,7 +9,7 @@ const timeViews: Record = { meridiem: 'öğleden sonra', }; -const trTRPickers: Partial> = { +const trTRPickers: Partial = { // Calendar navigation previousMonth: 'Önceki ay', nextMonth: 'Sonraki ay', @@ -43,8 +43,8 @@ const trTRPickers: Partial> = { 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`, @@ -59,14 +59,10 @@ const trTRPickers: Partial> = { 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 diff --git a/packages/x-date-pickers/src/locales/ukUA.ts b/packages/x-date-pickers/src/locales/ukUA.ts index 16ee5ef430a5..f03f89138408 100644 --- a/packages/x-date-pickers/src/locales/ukUA.ts +++ b/packages/x-date-pickers/src/locales/ukUA.ts @@ -9,7 +9,7 @@ const timeViews: Record = { meridiem: 'Південь', }; -const ukUAPickers: Partial> = { +const ukUAPickers: Partial = { // Calendar navigation previousMonth: 'Попередній місяць', nextMonth: 'Наступний місяць', @@ -43,8 +43,8 @@ const ukUAPickers: Partial> = { 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} секунд`, @@ -59,14 +59,10 @@ const ukUAPickers: Partial> = { 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 diff --git a/packages/x-date-pickers/src/locales/urPK.ts b/packages/x-date-pickers/src/locales/urPK.ts index afbfbc328b61..d23d5e37a6da 100644 --- a/packages/x-date-pickers/src/locales/urPK.ts +++ b/packages/x-date-pickers/src/locales/urPK.ts @@ -9,7 +9,7 @@ const timeViews: Record = { meridiem: 'میریڈیم', }; -const urPKPickers: Partial> = { +const urPKPickers: Partial = { // Calendar navigation previousMonth: 'پچھلا مہینہ', nextMonth: 'اگلا مہینہ', @@ -43,8 +43,8 @@ const urPKPickers: Partial> = { 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} سیکنڈ`, @@ -59,14 +59,10 @@ const urPKPickers: Partial> = { 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 diff --git a/packages/x-date-pickers/src/locales/utils/getPickersLocalization.ts b/packages/x-date-pickers/src/locales/utils/getPickersLocalization.ts index 20600845e335..bc791367a8a2 100644 --- a/packages/x-date-pickers/src/locales/utils/getPickersLocalization.ts +++ b/packages/x-date-pickers/src/locales/utils/getPickersLocalization.ts @@ -1,7 +1,7 @@ import { AdapterFormats, MuiPickersAdapter, PickerValidDate } from '../../models'; import { PickersLocaleText } from './pickersLocaleTextApi'; -export const getPickersLocalization = (pickersTranslations: Partial>) => { +export const getPickersLocalization = (pickersTranslations: Partial) => { return { components: { MuiLocalizationProvider: { @@ -16,18 +16,8 @@ export const getPickersLocalization = (pickersTranslations: Partial(params: { utils: MuiPickersAdapter; formatKey: keyof AdapterFormats; - contextTranslation: ( - date: TDate | null, - utils: MuiPickersAdapter, - formattedValue: string | null, - ) => string; - propsTranslation: - | (( - date: TDate | null, - utils: MuiPickersAdapter, - formattedValue: string | null, - ) => string) - | undefined; + contextTranslation: (formattedValue: string | null) => string; + propsTranslation: ((formattedValue: string | null) => string) | undefined; }) => { const { utils, formatKey, contextTranslation, propsTranslation } = params; @@ -35,6 +25,6 @@ export const buildGetOpenDialogAriaText = (params const formattedValue = value !== null && utils.isValid(value) ? utils.format(value, formatKey) : null; const translation = propsTranslation ?? contextTranslation; - return translation(value, utils, formattedValue); + return translation(formattedValue); }; }; diff --git a/packages/x-date-pickers/src/locales/utils/pickersLocaleTextApi.ts b/packages/x-date-pickers/src/locales/utils/pickersLocaleTextApi.ts index 38f4371fbe22..902aa019f149 100644 --- a/packages/x-date-pickers/src/locales/utils/pickersLocaleTextApi.ts +++ b/packages/x-date-pickers/src/locales/utils/pickersLocaleTextApi.ts @@ -1,11 +1,5 @@ import { TimeViewWithMeridiem } from '../../internals/models'; -import { - DateView, - TimeView, - MuiPickersAdapter, - FieldSectionContentType, - PickerValidDate, -} from '../../models'; +import { DateView, TimeView, FieldSectionContentType } from '../../models'; export interface PickersComponentSpecificLocaleText { /** @@ -30,7 +24,7 @@ export interface PickersComponentSpecificLocaleText { dateRangePickerToolbarTitle: string; } -export interface PickersComponentAgnosticLocaleText { +export interface PickersComponentAgnosticLocaleText { // Calendar navigation previousMonth: string; nextMonth: string; @@ -61,19 +55,7 @@ export interface PickersComponentAgnosticLocaleText, - // TODO v8: Make it required - formattedTime?: string | null, - ) => string; + clockLabelText: (view: TimeView, formattedTime: string | null) => string; hoursClockNumberText: (hours: string) => string; minutesClockNumberText: (minutes: string) => string; secondsClockNumberText: (seconds: string) => string; @@ -82,30 +64,8 @@ export interface PickersComponentAgnosticLocaleText string; // Open picker labels - openDatePickerDialogue: ( - /** - * @deprecated Use `formattedTime` instead - */ - date: TDate | null, - /** - * @deprecated Use `formattedTime` instead - */ - utils: MuiPickersAdapter, - // TODO v8: Make it required - formattedDate: string | null, - ) => string; - openTimePickerDialogue: ( - /** - * @deprecated Use `formattedTime` instead - */ - date: TDate | null, - /** - * @deprecated Use `formattedTime` instead - */ - utils: MuiPickersAdapter, - // TODO v8: Make it required - formattedTime: string | null, - ) => string; + openDatePickerDialogue: (formattedDate: string | null) => string; + openTimePickerDialogue: (formattedTime: string | null) => string; // Clear button label fieldClearLabel: string; @@ -144,21 +104,19 @@ export interface PickersComponentAgnosticLocaleText - extends PickersComponentAgnosticLocaleText, +export interface PickersLocaleText + extends PickersComponentAgnosticLocaleText, PickersComponentSpecificLocaleText {} -export type PickersInputLocaleText = Partial< - PickersLocaleText ->; +export type PickersInputLocaleText = Partial; /** * Translations that can be provided directly to the picker components. * It contains some generic translations like `toolbarTitle` * which will be dispatched to various translations keys in `PickersLocaleText`, depending on the pickers received them. */ -export interface PickersInputComponentLocaleText - extends Partial> { +export interface PickersInputComponentLocaleText + extends Partial { /** * Title displayed in the toolbar of this picker. * Will override the global translation keys like `datePickerToolbarTitle` passed to the `LocalizationProvider`. @@ -166,9 +124,7 @@ export interface PickersInputComponentLocaleText toolbarTitle?: string; } -export type PickersTranslationKeys = keyof PickersLocaleText; +export type PickersTranslationKeys = keyof PickersLocaleText; -export type LocalizedComponent< - TDate extends PickerValidDate, - Props extends { localeText?: PickersInputComponentLocaleText }, -> = Omit & { localeText?: PickersInputLocaleText }; +export type LocalizedComponent = + Omit & { localeText?: PickersInputLocaleText }; diff --git a/packages/x-date-pickers/src/locales/viVN.ts b/packages/x-date-pickers/src/locales/viVN.ts index 5fddced07adc..a13d883b082a 100644 --- a/packages/x-date-pickers/src/locales/viVN.ts +++ b/packages/x-date-pickers/src/locales/viVN.ts @@ -9,7 +9,7 @@ const views: Record = { meridiem: 'buổi', }; -const viVNPickers: Partial> = { +const viVNPickers: Partial = { // Calendar navigation previousMonth: 'Tháng trước', nextMonth: 'Tháng sau', @@ -43,8 +43,8 @@ const viVNPickers: Partial> = { 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`, @@ -59,14 +59,10 @@ const viVNPickers: Partial> = { 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 diff --git a/packages/x-date-pickers/src/locales/zhCN.ts b/packages/x-date-pickers/src/locales/zhCN.ts index b564ce25b6e9..d4202d719535 100644 --- a/packages/x-date-pickers/src/locales/zhCN.ts +++ b/packages/x-date-pickers/src/locales/zhCN.ts @@ -9,7 +9,7 @@ const views: Record = { meridiem: '十二小时制', }; -const zhCNPickers: Partial> = { +const zhCNPickers: Partial = { // Calendar navigation previousMonth: '上个月', nextMonth: '下个月', @@ -41,8 +41,8 @@ const zhCNPickers: Partial> = { 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}秒`, @@ -57,14 +57,10 @@ const zhCNPickers: Partial> = { 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 diff --git a/packages/x-date-pickers/src/locales/zhHK.ts b/packages/x-date-pickers/src/locales/zhHK.ts index 067106afac2d..d67678983873 100644 --- a/packages/x-date-pickers/src/locales/zhHK.ts +++ b/packages/x-date-pickers/src/locales/zhHK.ts @@ -9,7 +9,7 @@ const views: Record = { meridiem: '子午線', }; -const zhHKPickers: Partial> = { +const zhHKPickers: Partial = { // Calendar navigation previousMonth: '上個月', nextMonth: '下個月', @@ -41,8 +41,8 @@ const zhHKPickers: Partial> = { 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}秒`, @@ -57,14 +57,10 @@ const zhHKPickers: Partial> = { 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 From 8ed5c998151f0ca881b5f5a24e94d8973616c97d Mon Sep 17 00:00:00 2001 From: Kenan Yusuf Date: Tue, 29 Oct 2024 13:41:10 +0000 Subject: [PATCH 2/2] [DataGridPro] Add list view tests (#15043) --- .../src/tests/listView.DataGridPro.test.tsx | 98 +++++++++++++++++++ .../features/listView/useGridListView.tsx | 17 +++- 2 files changed, 113 insertions(+), 2 deletions(-) create mode 100644 packages/x-data-grid-pro/src/tests/listView.DataGridPro.test.tsx diff --git a/packages/x-data-grid-pro/src/tests/listView.DataGridPro.test.tsx b/packages/x-data-grid-pro/src/tests/listView.DataGridPro.test.tsx new file mode 100644 index 000000000000..043ca3ab6179 --- /dev/null +++ b/packages/x-data-grid-pro/src/tests/listView.DataGridPro.test.tsx @@ -0,0 +1,98 @@ +import * as React from 'react'; +import { expect } from 'chai'; +import { createRenderer, screen } from '@mui/internal-test-utils'; +import { + DataGridPro, + DataGridProProps, + GridColDef, + GridListColDef, + GridRowsProp, +} from '@mui/x-data-grid-pro'; + +const rows: GridRowsProp = [{ id: '123567', title: 'test' }]; + +const columns: GridColDef[] = [{ field: 'id' }, { field: 'title' }]; + +const listColumn: GridListColDef = { + field: 'listColumn', + renderCell: (params) =>
Title: {params.row.title}
, +}; + +describe(' - List view', () => { + const { render } = createRenderer(); + + function Test(props: Partial) { + return ( +
+ +
+ ); + } + + it('should not render list column when list view is not enabled', () => { + render( +
+ +
, + ); + expect(screen.queryByTestId('list-column')).to.equal(null); + }); + + it('should render list column when list view is enabled', () => { + render( +
+ +
, + ); + expect(screen.getByTestId('list-column')).not.to.equal(null); + expect(screen.getByTestId('list-column')).to.have.text('Title: test'); + }); + + it('should render list column when `unstable_listView` prop updates', () => { + const { setProps } = render(); + expect(screen.queryByTestId('list-column')).to.equal(null); + + setProps({ unstable_listView: true }); + + expect(screen.getByTestId('list-column')).not.to.equal(null); + expect(screen.getByTestId('list-column')).to.have.text('Title: test'); + + setProps({ unstable_listView: false }); + + expect(screen.queryByTestId('list-column')).to.equal(null); + }); + + it('should update cell contents when the `renderCell` function changes', () => { + const { setProps } = render(); + + setProps({ + unstable_listColumn: { + ...listColumn, + renderCell: (params) =>
ID: {params.row.id}
, + }, + } as Partial); + + expect(screen.getByTestId('list-column')).to.have.text('ID: 123567'); + }); + + it('should warn if the `unstable_listColumn` prop is not provided when `unstable_listView` is enabled', () => { + expect(() => { + render( +
+ +
, + ); + }).toWarnDev( + [ + 'MUI X: The `unstable_listColumn` prop must be set if `unstable_listView` is enabled.', + 'To fix, pass a column definition to the `unstable_listColumn` prop, e.g. `{ field: "example", renderCell: (params) =>
{params.row.id}
}`.', + 'For more details, see https://mui.com/x/react-data-grid/list-view/', + ].join('\n'), + ); + }); +}); diff --git a/packages/x-data-grid/src/hooks/features/listView/useGridListView.tsx b/packages/x-data-grid/src/hooks/features/listView/useGridListView.tsx index 4f552b30eb49..246892724148 100644 --- a/packages/x-data-grid/src/hooks/features/listView/useGridListView.tsx +++ b/packages/x-data-grid/src/hooks/features/listView/useGridListView.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import { warnOnce } from '@mui/x-internals/warning'; import type { GridListColDef } from '../../../models/colDef/gridColDef'; import { GridStateInitializer } from '../../utils/useGridInitializeState'; import { GridPrivateApiCommunity } from '../../../models/api/gridApiCommunity'; @@ -13,12 +14,14 @@ export const listViewStateInitializer: GridStateInitializer< Pick > = (state, props, apiRef) => ({ ...state, - listViewColumn: { ...props.unstable_listColumn, computedWidth: getListColumnWidth(apiRef) }, + listViewColumn: props.unstable_listColumn + ? { ...props.unstable_listColumn, computedWidth: getListColumnWidth(apiRef) } + : undefined, }); export function useGridListView( apiRef: React.MutableRefObject, - props: Pick, + props: Pick, ) { /* * EVENTS @@ -68,6 +71,16 @@ export function useGridListView( }); } }, [apiRef, props.unstable_listColumn]); + + React.useEffect(() => { + if (props.unstable_listView && !props.unstable_listColumn) { + warnOnce([ + 'MUI X: The `unstable_listColumn` prop must be set if `unstable_listView` is enabled.', + 'To fix, pass a column definition to the `unstable_listColumn` prop, e.g. `{ field: "example", renderCell: (params) =>
{params.row.id}
}`.', + 'For more details, see https://mui.com/x/react-data-grid/list-view/', + ]); + } + }, [props.unstable_listView, props.unstable_listColumn]); } function getListColumnWidth(apiRef: React.MutableRefObject) {