diff --git a/packages/x-date-pickers-pro/src/DateRangeCalendar/useDragRange.ts b/packages/x-date-pickers-pro/src/DateRangeCalendar/useDragRange.ts index 670fb5094a5e..f829d5397aeb 100644 --- a/packages/x-date-pickers-pro/src/DateRangeCalendar/useDragRange.ts +++ b/packages/x-date-pickers-pro/src/DateRangeCalendar/useDragRange.ts @@ -1,6 +1,6 @@ import * as React from 'react'; import useEventCallback from '@mui/utils/useEventCallback'; -import { MuiPickersAdapter } from '@mui/x-date-pickers/internals'; +import { MuiPickersAdapter } from '@mui/x-date-pickers/models'; import { DateRangePosition } from './DateRangeCalendar.types'; import { DateRange } from '../internal/models'; import { isEndOfRange, isStartOfRange } from '../internal/utils/date-utils'; diff --git a/packages/x-date-pickers-pro/src/internal/utils/date-range-manager.ts b/packages/x-date-pickers-pro/src/internal/utils/date-range-manager.ts index 6f0f2675bddc..fab411794a63 100644 --- a/packages/x-date-pickers-pro/src/internal/utils/date-range-manager.ts +++ b/packages/x-date-pickers-pro/src/internal/utils/date-range-manager.ts @@ -1,4 +1,4 @@ -import { MuiPickersAdapter } from '@mui/x-date-pickers/internals'; +import { MuiPickersAdapter } from '@mui/x-date-pickers/models'; import { DateRange, RangePosition } from '../models/range'; interface CalculateRangeChangeOptions { diff --git a/packages/x-date-pickers-pro/src/internal/utils/date-utils.ts b/packages/x-date-pickers-pro/src/internal/utils/date-utils.ts index e8a6986a5d14..4aba07ecd281 100644 --- a/packages/x-date-pickers-pro/src/internal/utils/date-utils.ts +++ b/packages/x-date-pickers-pro/src/internal/utils/date-utils.ts @@ -1,4 +1,4 @@ -import { MuiPickersAdapter } from '@mui/x-date-pickers/internals'; +import { MuiPickersAdapter } from '@mui/x-date-pickers/models'; import { DateRange, NonEmptyDateRange } from '../models/range'; export const isRangeValid = ( diff --git a/packages/x-date-pickers/src/AdapterDateFns/index.ts b/packages/x-date-pickers/src/AdapterDateFns/index.ts index 0cd8f0f90661..c91ada3eaff4 100644 --- a/packages/x-date-pickers/src/AdapterDateFns/index.ts +++ b/packages/x-date-pickers/src/AdapterDateFns/index.ts @@ -3,7 +3,7 @@ import defaultLocale from 'date-fns/locale/en-US'; // @ts-ignore import longFormatters from 'date-fns/_lib/format/longFormatters'; import getWeek from 'date-fns/getWeek'; -import { FieldFormatTokenMap, MuiPickersAdapter } from '../internals/models'; +import { FieldFormatTokenMap, MuiPickersAdapter } from '../models'; const formatTokenMap: FieldFormatTokenMap = { // Year diff --git a/packages/x-date-pickers/src/AdapterDateFnsJalali/index.ts b/packages/x-date-pickers/src/AdapterDateFnsJalali/index.ts index 822abd1465b3..f5f035a22828 100644 --- a/packages/x-date-pickers/src/AdapterDateFnsJalali/index.ts +++ b/packages/x-date-pickers/src/AdapterDateFnsJalali/index.ts @@ -3,7 +3,7 @@ import defaultLocale from 'date-fns-jalali/locale/fa-IR'; import getWeek from 'date-fns-jalali/getWeek'; // @ts-ignore import longFormatters from 'date-fns-jalali/_lib/format/longFormatters'; -import { FieldFormatTokenMap, MuiPickersAdapter } from '../internals/models'; +import { FieldFormatTokenMap, MuiPickersAdapter } from '../models'; const formatTokenMap: FieldFormatTokenMap = { // Year diff --git a/packages/x-date-pickers/src/AdapterDayjs/index.ts b/packages/x-date-pickers/src/AdapterDayjs/index.ts index 42e51cb5b3d7..34de8262844e 100644 --- a/packages/x-date-pickers/src/AdapterDayjs/index.ts +++ b/packages/x-date-pickers/src/AdapterDayjs/index.ts @@ -2,8 +2,7 @@ import defaultDayjs, { Dayjs } from 'dayjs'; import weekOfYear from 'dayjs/plugin/weekOfYear'; import BaseAdapterDayjs from '@date-io/dayjs'; -import { DateIOFormats } from '@date-io/core/IUtils'; -import { FieldFormatTokenMap, MuiPickersAdapter } from '../internals/models'; +import { FieldFormatTokenMap, MuiPickersAdapter, AdapterFormats } from '../models'; import { buildWarning } from '../internals/utils/warning'; const localeNotFoundWarning = buildWarning([ @@ -58,7 +57,7 @@ interface Opts { locale?: string; /** Make sure that your dayjs instance extends customParseFormat and advancedFormat */ instance?: typeof defaultDayjs; - formats?: Partial; + formats?: Partial; } export class AdapterDayjs extends BaseAdapterDayjs implements MuiPickersAdapter { diff --git a/packages/x-date-pickers/src/AdapterLuxon/index.ts b/packages/x-date-pickers/src/AdapterLuxon/index.ts index 06cb7783c26d..2fb39888ee12 100644 --- a/packages/x-date-pickers/src/AdapterLuxon/index.ts +++ b/packages/x-date-pickers/src/AdapterLuxon/index.ts @@ -1,7 +1,7 @@ /* eslint-disable class-methods-use-this */ import { DateTime } from 'luxon'; import BaseAdapterLuxon from '@date-io/luxon'; -import { FieldFormatTokenMap, MuiPickersAdapter } from '../internals/models'; +import { FieldFormatTokenMap, MuiPickersAdapter } from '../models'; const formatTokenMap: FieldFormatTokenMap = { // Year @@ -64,7 +64,7 @@ export class AdapterLuxon extends BaseAdapterLuxon implements MuiPickersAdapter< 'Your luxon version does not support `expandFormat`. Consider upgrading it to v3.0.2', ); } - // Extract escaped section to avoid entending them + // Extract escaped section to avoid extending them const longFormatRegexp = /''|'(''|[^'])+('|$)|[^']*/g; return ( format diff --git a/packages/x-date-pickers/src/AdapterMoment/index.ts b/packages/x-date-pickers/src/AdapterMoment/index.ts index 85c39b107801..a3a78981dd32 100644 --- a/packages/x-date-pickers/src/AdapterMoment/index.ts +++ b/packages/x-date-pickers/src/AdapterMoment/index.ts @@ -1,7 +1,7 @@ /* eslint-disable class-methods-use-this */ import defaultMoment, { LongDateFormatKey } from 'moment'; import BaseAdapterMoment from '@date-io/moment'; -import { FieldFormatTokenMap, MuiPickersAdapter } from '../internals/models'; +import { FieldFormatTokenMap, MuiPickersAdapter } from '../models'; // From https://momentjs.com/docs/#/displaying/format/ const formatTokenMap: FieldFormatTokenMap = { diff --git a/packages/x-date-pickers/src/AdapterMomentHijri/index.ts b/packages/x-date-pickers/src/AdapterMomentHijri/index.ts index ee66f161db73..7430ffdaf18a 100644 --- a/packages/x-date-pickers/src/AdapterMomentHijri/index.ts +++ b/packages/x-date-pickers/src/AdapterMomentHijri/index.ts @@ -2,7 +2,7 @@ import BaseAdapterMomentHijri from '@date-io/hijri'; // @ts-ignore import defaultMoment, { LongDateFormatKey } from 'moment-hijri'; -import { FieldFormatTokenMap, MuiPickersAdapter } from '../internals/models'; +import { FieldFormatTokenMap, MuiPickersAdapter } from '../models'; // From https://momentjs.com/docs/#/displaying/format/ const formatTokenMap: FieldFormatTokenMap = { diff --git a/packages/x-date-pickers/src/AdapterMomentJalaali/index.ts b/packages/x-date-pickers/src/AdapterMomentJalaali/index.ts index 88db200ce17f..72fc989215d0 100644 --- a/packages/x-date-pickers/src/AdapterMomentJalaali/index.ts +++ b/packages/x-date-pickers/src/AdapterMomentJalaali/index.ts @@ -1,7 +1,7 @@ /* eslint-disable class-methods-use-this */ import BaseAdapterMomentJalaali from '@date-io/jalaali'; import defaultMoment, { LongDateFormatKey } from 'moment-jalaali'; -import { FieldFormatTokenMap, MuiPickersAdapter } from '../internals/models'; +import { FieldFormatTokenMap, MuiPickersAdapter } from '../models'; type Moment = defaultMoment.Moment; diff --git a/packages/x-date-pickers/src/DateCalendar/useCalendarState.tsx b/packages/x-date-pickers/src/DateCalendar/useCalendarState.tsx index 89a859d9c126..f9a98c1ad0eb 100644 --- a/packages/x-date-pickers/src/DateCalendar/useCalendarState.tsx +++ b/packages/x-date-pickers/src/DateCalendar/useCalendarState.tsx @@ -3,7 +3,7 @@ import useEventCallback from '@mui/utils/useEventCallback'; import { SlideDirection } from './PickersSlideTransition'; import { useIsDateDisabled } from '../internals/hooks/validation/useDateValidation'; import { useUtils, useNow } from '../internals/hooks/useUtils'; -import { MuiPickersAdapter } from '../internals/models'; +import { MuiPickersAdapter } from '../models'; import { clamp } from '../internals/utils/date-utils'; import { DateCalendarDefaultizedProps } from './DateCalendar.types'; diff --git a/packages/x-date-pickers/src/DatePicker/shared.tsx b/packages/x-date-pickers/src/DatePicker/shared.tsx index 67fa540f285b..97cc80a69d64 100644 --- a/packages/x-date-pickers/src/DatePicker/shared.tsx +++ b/packages/x-date-pickers/src/DatePicker/shared.tsx @@ -12,10 +12,10 @@ import { isYearAndMonthViews, isYearOnlyView, } from '../internals/utils/views'; -import { DateValidationError, DateView } from '../models'; +import { DateValidationError, DateView, MuiPickersAdapter } from '../models'; import { BasePickerInputProps } from '../internals/models/props/basePickerProps'; import { applyDefaultDate } from '../internals/utils/date-utils'; -import { BaseDateValidationProps, MuiPickersAdapter, UncapitalizeObjectKeys } from '../internals'; +import { BaseDateValidationProps, UncapitalizeObjectKeys } from '../internals'; import { LocalizedComponent, PickersInputLocaleText } from '../locales/utils/pickersLocaleTextApi'; import { DatePickerToolbar, diff --git a/packages/x-date-pickers/src/LocalizationProvider/LocalizationProvider.tsx b/packages/x-date-pickers/src/LocalizationProvider/LocalizationProvider.tsx index f84033a64ff4..aee0892125cc 100644 --- a/packages/x-date-pickers/src/LocalizationProvider/LocalizationProvider.tsx +++ b/packages/x-date-pickers/src/LocalizationProvider/LocalizationProvider.tsx @@ -1,8 +1,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import { DateIOFormats } from '@date-io/core/IUtils'; import { useThemeProps } from '@mui/material/styles'; -import { MuiPickersAdapter } from '../internals/models'; +import { AdapterFormats, MuiPickersAdapter } from '../models'; import { PickersInputLocaleText } from '../locales'; export interface MuiPickersAdapterContextValue { @@ -34,7 +33,7 @@ export interface LocalizationProviderProps { */ dateAdapter?: new (...args: any) => MuiPickersAdapter; /** Formats that are used for any child pickers */ - dateFormats?: Partial; + dateFormats?: Partial; /** * Date library instance you are using, if it has some global overrides * ```jsx diff --git a/packages/x-date-pickers/src/TimeClock/ClockNumbers.tsx b/packages/x-date-pickers/src/TimeClock/ClockNumbers.tsx index 2be24484fcd3..62c9f79c1e28 100644 --- a/packages/x-date-pickers/src/TimeClock/ClockNumbers.tsx +++ b/packages/x-date-pickers/src/TimeClock/ClockNumbers.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { ClockNumber } from './ClockNumber'; -import { MuiPickersAdapter } from '../internals/models'; +import { MuiPickersAdapter } from '../models'; import type { PickerSelectionState } from '../internals/hooks/usePicker'; interface GetHourNumbersOptions { diff --git a/packages/x-date-pickers/src/internals/hooks/useDesktopPicker/useDesktopPicker.types.ts b/packages/x-date-pickers/src/internals/hooks/useDesktopPicker/useDesktopPicker.types.ts index a5a4ea1d80fd..8b3f9336257b 100644 --- a/packages/x-date-pickers/src/internals/hooks/useDesktopPicker/useDesktopPicker.types.ts +++ b/packages/x-date-pickers/src/internals/hooks/useDesktopPicker/useDesktopPicker.types.ts @@ -3,7 +3,6 @@ import IconButton, { IconButtonProps } from '@mui/material/IconButton'; import { InputAdornmentProps } from '@mui/material/InputAdornment'; import TextField, { TextFieldProps } from '@mui/material/TextField'; import { SlotComponentProps } from '@mui/base/utils'; -import { MuiPickersAdapter } from '../../models'; import { BaseNonStaticPickerProps, BasePickerProps, @@ -14,7 +13,12 @@ import { PickersPopperSlotsComponentsProps, } from '../../components/PickersPopper'; import { UsePickerParams, UsePickerProps } from '../usePicker'; -import { BaseSingleInputFieldProps, FieldSection, DateOrTimeView } from '../../../models'; +import { + BaseSingleInputFieldProps, + FieldSection, + DateOrTimeView, + MuiPickersAdapter, +} from '../../../models'; import { ExportedPickersLayoutSlotsComponent, ExportedPickersLayoutSlotsComponentsProps, diff --git a/packages/x-date-pickers/src/internals/hooks/useField/useField.types.ts b/packages/x-date-pickers/src/internals/hooks/useField/useField.types.ts index 2860d81958a2..85883b687c7c 100644 --- a/packages/x-date-pickers/src/internals/hooks/useField/useField.types.ts +++ b/packages/x-date-pickers/src/internals/hooks/useField/useField.types.ts @@ -1,6 +1,10 @@ import * as React from 'react'; -import { MuiPickersAdapter } from '../../models'; -import { FieldSectionType, FieldSection, FieldSelectedSections } from '../../../models'; +import { + FieldSectionType, + FieldSection, + FieldSelectedSections, + MuiPickersAdapter, +} from '../../../models'; import type { PickerValueManager } from '../usePicker'; import { InferError, Validator } from '../validation/useValidation'; diff --git a/packages/x-date-pickers/src/internals/hooks/useField/useField.utils.ts b/packages/x-date-pickers/src/internals/hooks/useField/useField.utils.ts index 30237e8a2da1..b343cb408db5 100644 --- a/packages/x-date-pickers/src/internals/hooks/useField/useField.utils.ts +++ b/packages/x-date-pickers/src/internals/hooks/useField/useField.utils.ts @@ -7,8 +7,7 @@ import { FieldSectionWithoutPosition, FieldSectionValueBoundaries, } from './useField.types'; -import { MuiPickersAdapter } from '../../models'; -import { FieldSectionType, FieldSection } from '../../../models'; +import { FieldSectionType, FieldSection, MuiPickersAdapter } from '../../../models'; import { PickersLocaleText } from '../../../locales/utils/pickersLocaleTextApi'; export const getDateSectionConfigFromFormatToken = ( diff --git a/packages/x-date-pickers/src/internals/hooks/useMobilePicker/useMobilePicker.types.ts b/packages/x-date-pickers/src/internals/hooks/useMobilePicker/useMobilePicker.types.ts index a910b5117fd3..9a2f23e51386 100644 --- a/packages/x-date-pickers/src/internals/hooks/useMobilePicker/useMobilePicker.types.ts +++ b/packages/x-date-pickers/src/internals/hooks/useMobilePicker/useMobilePicker.types.ts @@ -1,7 +1,6 @@ import * as React from 'react'; import TextField, { TextFieldProps } from '@mui/material/TextField'; import { SlotComponentProps } from '@mui/base/utils'; -import { MuiPickersAdapter } from '../../models'; import { BaseNonStaticPickerProps, BasePickerProps, @@ -12,7 +11,12 @@ import { PickersModalDialogSlotsComponentsProps, } from '../../components/PickersModalDialog'; import { UsePickerParams, UsePickerProps } from '../usePicker'; -import { BaseSingleInputFieldProps, FieldSection, DateOrTimeView } from '../../../models'; +import { + BaseSingleInputFieldProps, + FieldSection, + DateOrTimeView, + MuiPickersAdapter, +} from '../../../models'; import { ExportedPickersLayoutSlotsComponent, ExportedPickersLayoutSlotsComponentsProps, diff --git a/packages/x-date-pickers/src/internals/hooks/usePicker/usePickerValue.ts b/packages/x-date-pickers/src/internals/hooks/usePicker/usePickerValue.ts index 4241b9db4ed8..bf47a101f7dc 100644 --- a/packages/x-date-pickers/src/internals/hooks/usePicker/usePickerValue.ts +++ b/packages/x-date-pickers/src/internals/hooks/usePicker/usePickerValue.ts @@ -7,8 +7,7 @@ import { FieldChangeHandlerContext, UseFieldInternalProps } from '../useField'; import { InferError, useValidation, Validator } from '../validation/useValidation'; import { UseFieldValidationProps } from '../useField/useField.types'; import { WrapperVariant } from '../../models/common'; -import { MuiPickersAdapter } from '../../models/muiPickersAdapter'; -import { FieldSection, FieldSelectedSections } from '../../../models'; +import { FieldSection, FieldSelectedSections, MuiPickersAdapter } from '../../../models'; export interface PickerValueManager { /** diff --git a/packages/x-date-pickers/src/internals/index.ts b/packages/x-date-pickers/src/internals/index.ts index db086a00bf26..2fb5f51ac2e4 100644 --- a/packages/x-date-pickers/src/internals/index.ts +++ b/packages/x-date-pickers/src/internals/index.ts @@ -120,7 +120,6 @@ export type { BaseNonStaticPickerProps, } from './models/props/basePickerProps'; export type { BaseToolbarProps, ExportedBaseToolbarProps } from './models/props/toolbar'; -export type { MuiPickersAdapter } from './models/muiPickersAdapter'; export type { DefaultizedProps, MakeOptional } from './models/helpers'; export type { WrapperVariant } from './models/common'; diff --git a/packages/x-date-pickers/src/internals/models/index.ts b/packages/x-date-pickers/src/internals/models/index.ts index 659e36addf29..cbc6c8c464c5 100644 --- a/packages/x-date-pickers/src/internals/models/index.ts +++ b/packages/x-date-pickers/src/internals/models/index.ts @@ -1,2 +1 @@ export * from './fields'; -export * from './muiPickersAdapter'; diff --git a/packages/x-date-pickers/src/internals/models/muiPickersAdapter.d.ts b/packages/x-date-pickers/src/internals/models/muiPickersAdapter.d.ts deleted file mode 100644 index cde703792ac3..000000000000 --- a/packages/x-date-pickers/src/internals/models/muiPickersAdapter.d.ts +++ /dev/null @@ -1,26 +0,0 @@ -// Do not remove the `.d.ts` file extension, it allows to keep the `@ts-expect-error` below after the build. -import { IUtils } from '@date-io/core/IUtils'; -import { FieldSectionType } from '../../models'; - -// TODO: Maybe we should add the same constraint. -// @ts-ignore TDate in our codebase does not have the `ExtendableDateType` constraint. -export type MuiPickersAdapter = IUtils & { - isMUIAdapter: boolean; - - formatTokenMap: FieldFormatTokenMap; - - /** - * Characters used to start and end an escaped message in the format. - */ - escapedCharacters: { start: string; end: string }; - - expandFormat: (format: string) => string; - - getWeekNumber: (date: TDate) => number; -}; - -export type FieldFormatTokenMap = { - [formatToken: string]: - | FieldSectionType - | { sectionType: FieldSectionType; contentType: 'digit' | 'letter' }; -}; diff --git a/packages/x-date-pickers/src/internals/utils/date-utils.ts b/packages/x-date-pickers/src/internals/utils/date-utils.ts index c2bfe0671c2e..61bbfcbec292 100644 --- a/packages/x-date-pickers/src/internals/utils/date-utils.ts +++ b/packages/x-date-pickers/src/internals/utils/date-utils.ts @@ -1,4 +1,4 @@ -import { MuiPickersAdapter } from '../models'; +import { MuiPickersAdapter } from '../../models'; interface FindClosestDateParams { date: TDate; diff --git a/packages/x-date-pickers/src/internals/utils/time-utils.ts b/packages/x-date-pickers/src/internals/utils/time-utils.ts index fb85f53b004c..b58980322c7d 100644 --- a/packages/x-date-pickers/src/internals/utils/time-utils.ts +++ b/packages/x-date-pickers/src/internals/utils/time-utils.ts @@ -1,5 +1,4 @@ -import { MuiPickersAdapter } from '../models'; -import { DateOrTimeView } from '../../models'; +import { DateOrTimeView, MuiPickersAdapter } from '../../models'; export const isTimeView = (view: DateOrTimeView) => ['hours', 'minutes', 'seconds'].includes(view); diff --git a/packages/x-date-pickers/src/locales/utils/pickersLocaleTextApi.ts b/packages/x-date-pickers/src/locales/utils/pickersLocaleTextApi.ts index 077fe34332ef..3b1fc9cdb720 100644 --- a/packages/x-date-pickers/src/locales/utils/pickersLocaleTextApi.ts +++ b/packages/x-date-pickers/src/locales/utils/pickersLocaleTextApi.ts @@ -1,5 +1,4 @@ -import { MuiPickersAdapter } from '../../internals/models'; -import { DateView, TimeView } from '../../models'; +import { DateView, TimeView, MuiPickersAdapter } from '../../models'; export interface PickersComponentSpecificLocaleText { /** diff --git a/packages/x-date-pickers/src/models/adapters.ts b/packages/x-date-pickers/src/models/adapters.ts new file mode 100644 index 000000000000..a9627caeb2b9 --- /dev/null +++ b/packages/x-date-pickers/src/models/adapters.ts @@ -0,0 +1,586 @@ +import { FieldSectionType } from './fields'; + +export interface AdapterFormats { + /** Localized full date @example "Jan 1, 2019" */ + fullDate: TLibFormatToken; + /** Partially localized full date with weekday, useful for text-to-speech accessibility @example "Tuesday, January 1, 2019" */ + fullDateWithWeekday: TLibFormatToken; + /** Date format string with month and day of month @example "1 January" */ + normalDate: TLibFormatToken; + /** Date format string with weekday, month and day of month @example "Wed, Jan 1" */ + normalDateWithWeekday: TLibFormatToken; + /** Shorter day format @example "Jan 1" */ + shortDate: TLibFormatToken; + /** Year format string @example "2019" */ + year: TLibFormatToken; + /** Month format string @example "January" */ + month: TLibFormatToken; + /** Short month format string @example "Jan" */ + monthShort: TLibFormatToken; + /** Month with year format string @example "January 2018" */ + monthAndYear: TLibFormatToken; + /** Month with date format string @example "January 1" */ + monthAndDate: TLibFormatToken; + /** Weekday format string @example "Wednesday" */ + weekday: TLibFormatToken; + /** Short weekday format string @example "Wed" */ + weekdayShort: TLibFormatToken; + /** Day format string @example "1" */ + dayOfMonth: TLibFormatToken; + /** Hours format string @example "11" */ + hours12h: TLibFormatToken; + /** Hours format string @example "23" */ + hours24h: TLibFormatToken; + /** Minutes format string @example "44" */ + minutes: TLibFormatToken; + /** Seconds format string @example "00" */ + seconds: TLibFormatToken; + /** Full time localized format string @example "11:44 PM" for US, "23:44" for Europe */ + fullTime: TLibFormatToken; + /** Not localized full time format string @example "11:44 PM" */ + fullTime12h: TLibFormatToken; + /** Not localized full time format string @example "23:44" */ + fullTime24h: TLibFormatToken; + /** Date & time format string with localized time @example "Jan 1, 2018 11:44 PM" */ + fullDateTime: TLibFormatToken; + /** Not localized date & Time format 12h @example "Jan 1, 2018 11:44 PM" */ + fullDateTime12h: TLibFormatToken; + /** Not localized date & Time format 24h @example "Jan 1, 2018 23:44" */ + fullDateTime24h: TLibFormatToken; + /** Localized keyboard input friendly date format @example "02/13/2020 */ + keyboardDate: TLibFormatToken; + /** Localized keyboard input friendly date/time format @example "02/13/2020 23:44" */ + keyboardDateTime: TLibFormatToken; + /** Partially localized keyboard input friendly date/time 12h format @example "02/13/2020 11:44 PM" */ + keyboardDateTime12h: TLibFormatToken; + /** Partially localized keyboard input friendly date/time 24h format @example "02/13/2020 23:44" */ + keyboardDateTime24h: TLibFormatToken; +} + +export type AdapterUnits = + | 'years' + | 'quarters' + | 'months' + | 'weeks' + | 'days' + | 'hours' + | 'minutes' + | 'seconds' + | 'milliseconds'; + +export type FieldFormatTokenMap = { + [formatToken: string]: + | FieldSectionType + | { sectionType: FieldSectionType; contentType: 'digit' | 'letter' }; +}; + +export interface MuiPickersAdapter { + /** + * A boolean confirming that the adapter used is an MUI adapter. + */ + isMUIAdapter: boolean; + formats: AdapterFormats; + locale?: any; + moment?: any; + dayjs?: any; + /** Name of the library that is used right now */ + lib: string; + /** + * The characters used to escape a string inside a format. + */ + escapedCharacters: { start: string; end: string }; + + /** + * A map containing all the format that the field components can understand. + */ + formatTokenMap: FieldFormatTokenMap; + + // constructor (options?: { formats?: DateIOFormats, locale?: any, instance?: any }); + + /** + * Create a date in the date library format. + * If no `value` parameter is provided, creates a date with the current timestamp. + * If a `value` parameter is provided, pass it to the date library to try to parse it. + * @template TDate + * @param {any} value The optional value to parse. + * @returns {TDate | null} The parsed date. + */ + date(value?: any): TDate | null; + /** + * Convert a date in the library format into a JavaScript `Date` object. + * @deprecate Will be removed in v7. + * @template TDate + * @param {TDate} value The value to convert. + * @returns {Date} the JavaScript date. + */ + toJsDate(value: TDate): Date; + /** + * Parses an iso string into a date in the date library format. + * @deprecate Will be removed in v7. + * @template TDate + * @param {string} isoString The iso string to parse. + * @returns {TDate} the parsed date. + */ + parseISO(isoString: string): TDate; + /** + * Stringifies a date in the date library format into an ISO string. + * @deprecate Will be removed in v7. + * @template TDate + * @param {TDate} value The date to stringify. + * @returns {string} the iso string representing the date. + */ + toISO(value: TDate): string; + /** + * Parses a string date in a specific format. + * @template TDate + * @param {string} value The string date to parse. + * @param {string} format The format in which the string date is. + * @returns {TDate | null} The parsed date. + */ + parse(value: string, format: string): TDate | null; + /** + * Returns the code of the locale currently used by the adapter. + * @returns {string} The code of the locale. + */ + getCurrentLocaleCode(): string; + /** + * Returns `true` if the current locale is using 12 hours cycle (i.e: time with meridiem). + * @returns {boolean} `true` if the current locale is using 12 hours cycle. + */ + is12HourCycleInCurrentLocale(): boolean; + /** + * Creates a format with no meta-token (e.g: `LLL` or `PP`). + * @param {string} format The format to expand. + * @returns {string} The expanded format. + */ + expandFormat: (format: string) => string; + /** + * Returns user readable format (taking into account localized format tokens), useful to render helper text for input (e.g. placeholder). + * @deprecated Will be removed in v7. + * @param {string} format The format to analyze. + * @returns {string} The helper text of the given format. + */ + getFormatHelperText(format: string): string; + /** + * Returns `true` if the date is null. + * @template TDate + * @param {TDate | null} value The date to test. + * @returns {boolean} `true` if the date is null. + */ + isNull(value: TDate | null): boolean; + /** + * Returns `true` if the date is valid. + * TODO v7: Type `value` to be `TDate | null` and make sure the `isValid(null)` returns `false`. + * @param {any} value The value to test. + * @returns {boolean} `true` if the value is valid. + */ + isValid(value: any): boolean; + /** + * Format a date using an adapter format string (see the `AdapterFormats` interface) + * @template TDate + * @param {TDate} value The date to format. + * @param {keyof AdapterFormats} formatKey The formatKey to use. + * @returns {string} The stringify date. + */ + format(value: TDate, formatKey: keyof AdapterFormats): string; + /** + * Format a date using a format of the date library. + * @template TDate + * @param {TDate} value The date to format. + * @param {string} formatString The format to use. + * @returns {string} The stringify date. + */ + formatByString(value: TDate, formatString: string): string; + /** + * Format a number to be rendered in the clock. + * Is being used in hijri and jalali adapters. + * @param {string} numberToFormat The number to format. + * @returns {string} The formatted number. + */ + formatNumber(numberToFormat: string): string; + /** + * @deprecated Will be removed in v7. + * @template TDate + * @param {TDate} value The reference date. + * @param {TDate | string} comparing The date to compare with the reference date. + * @param {AdapterUnits} unit The unit in which we want to the result to be. + * @returns {number} The diff between the two dates. + */ + getDiff(value: TDate, comparing: TDate | string, unit?: AdapterUnits): number; + /** + * Returns `true` is the two dates are equal. + * TODO v7: Type `value` and `comparing` to be `TDate | null`. + * @param {any} value The reference date. + * @param {any} comparing The date to compare with the reference date. + * @returns {boolean} `true` if the two dates are equal. + */ + isEqual(value: any, comparing: any): boolean; + /** + * Returns `true` if the two dates are in the same day. + * @template TDate + * @param {TDate} value The reference date. + * @param {TDate} comparing The date to compare with the reference date. + * @returns {boolean} `true` if the two dates are in the same day. + */ + isSameDay(value: TDate, comparing: TDate): boolean; + /** + * Returns `true` if the two dates are in the same month. + * @template TDate + * @param {TDate} value The reference date. + * @param {TDate} comparing The date to compare with the reference date. + * @returns {boolean} `true` if the two dates are in the same month. + */ + isSameMonth(value: TDate, comparing: TDate): boolean; + /** + * Returns `true` if the two dates are in the same year. + * @template TDate + * @param {TDate} value The reference date. + * @param {TDate} comparing The date to compare with the reference date. + * @returns {boolean} `true` if the two dates are in the same year. + */ + isSameYear(value: TDate, comparing: TDate): boolean; + /** + * Returns `true` if the two dates are in the same hour. + * @template TDate + * @param {TDate} value The reference date. + * @param {TDate} comparing The date to compare with the reference date. + * @returns {boolean} `true` if the two dates are in the same hour. + */ + isSameHour(value: TDate, comparing: TDate): boolean; + /** + * Returns `true` if the reference date is after the second date. + * @template TDate + * @param {TDate} value The reference date. + * @param {TDate} comparing The date to compare with the reference date. + * @returns {boolean} `true` if the reference date is after the second date. + */ + isAfter(value: TDate, comparing: TDate): boolean; + /** + * Returns `true` if the day of the reference date is after the day of the second date. + * TODO v7: Consider adding a `unit` param to `isAfter` and drop this method. + * @template TDate + * @param {TDate} value The reference date. + * @param {TDate} comparing The date to compare with the reference date. + * @returns {boolean} `true` if the day of the reference date is after the day of the second date. + */ + isAfterDay(value: TDate, comparing: TDate): boolean; + /** + * Returns `true` if the year of the reference date is after the year of the second date. + * TODO v7: Consider adding a `unit` param to `isAfter` and drop this method. + * @template TDate + * @param {TDate} value The reference date. + * @param {TDate} comparing The date to compare with the reference date. + * @returns {boolean} `true` if the year of the reference date is after the year of the second date. + */ + isAfterYear(value: TDate, comparing: TDate): boolean; + /** + * Returns `true` if the reference date is before the second date. + * @template TDate + * @param {TDate} value The reference date. + * @param {TDate} comparing The date to compare with the reference date. + * @returns {boolean} `true` if the reference date is before the second date. + */ + isBefore(value: TDate, comparing: TDate): boolean; + /** + * Returns `true` if the day of the reference date is before the day of the second date. + * TODO v7: Consider adding a `unit` param to `isBefore` and drop this method. + * @template TDate + * @param {TDate} value The reference date. + * @param {TDate} comparing The date to compare with the reference date. + * @returns {boolean} `true` if the day of the reference date is before the day of the second date. + */ + isBeforeDay(value: TDate, comparing: TDate): boolean; + /** + * Returns `true` if the year of the reference date is before the year of the second date. + * TODO v7: Consider adding a `unit` param to `isBefore` and drop this method. + * @template TDate + * @param {TDate} value The reference date. + * @param {TDate} comparing The date to compare with the reference date. + * @returns {boolean} `true` if the year of the reference date is before the year of the second date. + */ + isBeforeYear(value: TDate, comparing: TDate): boolean; + /** + * Returns `true` if the value is withing the provided range. + * @template TDate + * @param {TDate} value The value to test. + * @param {[TDate, TDate]} range The range in which the value should be. + * @returns {boolean} `true` if the value is withing the provided range. + */ + isWithinRange(value: TDate, range: [TDate, TDate]): boolean; + /** + * Return the start of the year for the given date. + * @template TDate + * @param {TDate} value The original date. + * @returns {TDate} The start of the year. + */ + startOfYear(value: TDate): TDate; + /** + * Return the start of the month for the given date. + * @template TDate + * @param {TDate} value The original date. + * @returns {TDate} The start of the month. + */ + startOfMonth(value: TDate): TDate; + /** + * Return the start of the week for the given date. + * @template TDate + * @param {TDate} value The original date. + * @returns {TDate} The start of the week. + */ + startOfWeek(value: TDate): TDate; + /** + * Return the start of the day for the given date. + * @template TDate + * @param {TDate} value The original date. + * @returns {TDate} The start of the day. + */ + startOfDay(value: TDate): TDate; + /** + * Return the end of the year for the given date. + * @template TDate + * @param {TDate} value The original date. + * @returns {TDate} The end of the year. + */ + endOfYear(value: TDate): TDate; + /** + * Return the end of the month for the given date. + * @template TDate + * @param {TDate} value The original date. + * @returns {TDate} The end of the month. + */ + endOfMonth(value: TDate): TDate; + /** + * Return the end of the week for the given date. + * @template TDate + * @param {TDate} value The original date. + * @returns {TDate} The end of the week. + */ + endOfWeek(value: TDate): TDate; + /** + * Return the end of the day for the given date. + * @template TDate + * @param {TDate} value The original date. + * @returns {TDate} The end of the day. + */ + endOfDay(value: TDate): TDate; + /** + * Add the specified number of years to the given date. + * @template TDate + * @param {TDate} value The date to be changed. + * @param {number} amount The amount of years to be added. + * @returns {TDate} The new date with the years added. + */ + addYears(value: TDate, amount: number): TDate; + /** + * Add the specified number of months to the given date. + * @template TDate + * @param {TDate} value The date to be changed. + * @param {number} amount The amount of months to be added. + * @returns {TDate} The new date with the months added. + */ + addMonths(value: TDate, amount: number): TDate; + /** + * Add the specified number of weeks to the given date. + * @template TDate + * @param {TDate} value The date to be changed. + * @param {number} amount The amount of weeks to be added. + * @returns {TDate} The new date with the weeks added. + */ + addWeeks(value: TDate, amount: number): TDate; + /** + * Add the specified number of days to the given date. + * @template TDate + * @param {TDate} value The date to be changed. + * @param {number} amount The amount of days to be added. + * @returns {TDate} The new date with the days added. + */ + addDays(value: TDate, amount: number): TDate; + /** + * Add the specified number of hours to the given date. + * @template TDate + * @param {TDate} value The date to be changed. + * @param {number} amount The amount of hours to be added. + * @returns {TDate} The new date with the hours added. + */ + addHours(value: TDate, amount: number): TDate; + /** + * Add the specified number of minutes to the given date. + * @template TDate + * @param {TDate} value The date to be changed. + * @param {number} amount The amount of minutes to be added. + * @returns {TDate} The new date with the minutes added. + */ + addMinutes(value: TDate, amount: number): TDate; + /** + * Add the specified number of seconds to the given date. + * @template TDate + * @param {TDate} value The date to be changed. + * @param {number} amount The amount of seconds to be added. + * @returns {TDate} The new date with the seconds added. + */ + addSeconds(value: TDate, amount: number): TDate; + /** + * Get the year of the given date. + * @template TDate + * @param {TDate} value The given date. + * @returns {number} The year of the given date. + */ + getYear(value: TDate): number; + /** + * Get the month of the given date. + * @template TDate + * @param {TDate} value The given date. + * @returns {number} The month of the given date. + */ + getMonth(value: TDate): number; + /** + * Get the date (e.g: the day in the month) of the given date. + * @template TDate + * @param {TDate} value The given date. + * @returns {number} The date of the given date. + */ + getDate(value: TDate): number; + /** + * Get the hours of the given date. + * @template TDate + * @param {TDate} value The given date. + * @returns {number} The hours of the given date. + */ + getHours(value: TDate): number; + /** + * Get the minutes of the given date. + * @template TDate + * @param {TDate} value The given date. + * @returns {number} The minutes of the given date. + */ + getMinutes(value: TDate): number; + /** + * Get the seconds of the given date. + * @template TDate + * @param {TDate} value The given date. + * @returns {number} The seconds of the given date. + */ + getSeconds(value: TDate): number; + /** + * Set the year to the given date. + * @template TDate + * @param {TDate} value The date to be changed. + * @param {number} year The year of the new date. + * @returns {TDate} The new date with the year set. + */ + setYear(value: TDate, year: number): TDate; + /** + * Set the month to the given date. + * @template TDate + * @param {TDate} value The date to be changed. + * @param {number} month The month of the new date. + * @returns {TDate} The new date with the month set. + */ + setMonth(value: TDate, month: number): TDate; + /** + * Set the date (e.g: the day in the month) to the given date. + * @template TDate + * @param {TDate} value The date to be changed. + * @param {number} date The date of the new date. + * @returns {TDate} The new date with the date set. + */ + setDate(value: TDate, date: number): TDate; + /** + * Set the hours to the given date. + * @template TDate + * @param {TDate} value The date to be changed. + * @param {number} hours The hours of the new date. + * @returns {TDate} The new date with the hours set. + */ + setHours(value: TDate, hours: number): TDate; + /** + * Set the minutes to the given date. + * @template TDate + * @param {TDate} value The date to be changed. + * @param {number} minutes The minutes of the new date. + * @returns {TDate} The new date with the minutes set. + */ + setMinutes(value: TDate, minutes: number): TDate; + /** + * Set the seconds to the given date. + * @template TDate + * @param {TDate} value The date to be changed. + * @param {number} seconds The seconds of the new date. + * @returns {TDate} The new date with the seconds set. + */ + setSeconds(value: TDate, seconds: number): TDate; + /** + * Get the number of days in a month of the given date. + * @template TDate + * @param {TDate} value The given date. + * @returns {number} The number of days in the month + */ + getDaysInMonth(value: TDate): number; + /** + * Add one month to the given date. + * @deprecated Use `addMonths(value, 1)` + * @template TDate + * @param {TDate} value The given date. + * @returns {TDate} The new date with one month added. + */ + getNextMonth(value: TDate): TDate; + /** + * Subtract one month to the given date. + * @deprecated Use `addMonths(value, -1)` + * @template TDate + * @param {TDate} value The given date. + * @returns {TDate} The new date with one month subtracted. + */ + getPreviousMonth(value: TDate): TDate; + /** + * Get an array with all the months in the year of the given date. + * TODO: Inline the logic in a utility function using `addMonths`, we don't need one method per adapter. + * @deprecated Will be removed in v7. + * @template TDate + * @param {TDate} value The given date. + * @returns {TDate[]} All the months in the year of the given date. + */ + getMonthArray(value: TDate): TDate[]; + /** + * Creates a date with the date of the first param and the time of the second param. + * @template TDate + * @param {TDate} dateParam Param from which we want to get the date. + * @param {TDate} timeParam Param from which we want to get the time. + * @returns Date with the date of the first param and the time of the second param. + */ + mergeDateAndTime(dateParam: TDate, timeParam: TDate): TDate; + /** + * Get the label of each day of a week. + * @returns {string[]} The label of each day of a week. + */ + getWeekdays(): string[]; + /** + * Creates a nested list with all the days of the month of the given date grouped by week. + * @template TDate + * @param {TDate} date The given date. + * @returns {TDate[][]} The nested with all the days of the month grouped by week. + */ + getWeekArray(date: TDate): TDate[][]; + /** + * Get the number of the week of the given date. + * @template TDate + * @param {TDate} date The given date. + * @returns {number} The number of the week of the given date. + */ + getWeekNumber: (date: TDate) => number; + /** + * Creates a list with all the years between the start end the end date. + * TODO v7: Replace with a single range param `[TDate, TDate]`, to be coherent with `isWithingRange`. + * @template TDate + * @param {TDate} start The start of the range. + * @param {TDate} end The end of the range. + * @returns {TDate[]} List of all the years between the start end the end date. + */ + getYearRange(start: TDate, end: TDate): TDate[]; + /** + * Allow to customize how the "am"` and "pm" strings are rendered. + * @param {"am" | "pm"} meridiem The string to render. + * @return {string} The formatted string. + */ + getMeridiemText(meridiem: 'am' | 'pm'): string; +} diff --git a/packages/x-date-pickers/src/models/index.ts b/packages/x-date-pickers/src/models/index.ts index ecbc6cb041db..4a55f5ec3aea 100644 --- a/packages/x-date-pickers/src/models/index.ts +++ b/packages/x-date-pickers/src/models/index.ts @@ -1,3 +1,4 @@ export * from './fields'; export * from './validation'; export * from './views'; +export * from './adapters'; diff --git a/packages/x-date-pickers/src/tests/fieldKeyboardInteraction.test.tsx b/packages/x-date-pickers/src/tests/fieldKeyboardInteraction.test.tsx index 4c6b4beb5a2d..a167a210a563 100644 --- a/packages/x-date-pickers/src/tests/fieldKeyboardInteraction.test.tsx +++ b/packages/x-date-pickers/src/tests/fieldKeyboardInteraction.test.tsx @@ -8,9 +8,8 @@ import { expectInputValue, getTextbox, } from 'test/utils/pickers-utils'; -import { DateTimeField } from '@mui/x-date-pickers/DateTimeField/DateTimeField'; -import { FieldSectionType } from '@mui/x-date-pickers/models'; -import { MuiPickersAdapter } from '../internals/models/muiPickersAdapter'; +import { DateTimeField } from '@mui/x-date-pickers/DateTimeField'; +import { FieldSectionType, MuiPickersAdapter } from '@mui/x-date-pickers/models'; const testDate = new Date(2018, 4, 15, 9, 35, 10); diff --git a/scripts/x-date-pickers-pro.exports.json b/scripts/x-date-pickers-pro.exports.json index cfe74148458d..ec390df4b4ab 100644 --- a/scripts/x-date-pickers-pro.exports.json +++ b/scripts/x-date-pickers-pro.exports.json @@ -1,4 +1,6 @@ [ + { "name": "AdapterFormats", "kind": "Interface" }, + { "name": "AdapterUnits", "kind": "TypeAlias" }, { "name": "BaseMultiInputFieldProps", "kind": "Interface" }, { "name": "BaseSingleInputFieldProps", "kind": "Interface" }, { "name": "beBY", "kind": "Variable" }, @@ -113,6 +115,7 @@ { "name": "ExportedPickersYearProps", "kind": "Interface" }, { "name": "ExportedSlideTransitionProps", "kind": "Interface" }, { "name": "faIR", "kind": "Variable" }, + { "name": "FieldFormatTokenMap", "kind": "TypeAlias" }, { "name": "FieldRef", "kind": "Interface" }, { "name": "FieldSection", "kind": "Interface" }, { "name": "FieldSectionType", "kind": "TypeAlias" }, @@ -159,6 +162,7 @@ { "name": "MonthCalendarClasses", "kind": "Interface" }, { "name": "MonthCalendarClassKey", "kind": "TypeAlias" }, { "name": "MonthCalendarProps", "kind": "Interface" }, + { "name": "MuiPickersAdapter", "kind": "Interface" }, { "name": "MuiPickersAdapterContext", "kind": "Variable" }, { "name": "MultiInputDateRangeField", "kind": "Variable" }, { "name": "MultiInputDateRangeFieldProps", "kind": "Interface" }, diff --git a/scripts/x-date-pickers.exports.json b/scripts/x-date-pickers.exports.json index a7f281344aa9..d299272de896 100644 --- a/scripts/x-date-pickers.exports.json +++ b/scripts/x-date-pickers.exports.json @@ -1,4 +1,6 @@ [ + { "name": "AdapterFormats", "kind": "Interface" }, + { "name": "AdapterUnits", "kind": "TypeAlias" }, { "name": "BaseSingleInputFieldProps", "kind": "Interface" }, { "name": "beBY", "kind": "Variable" }, { "name": "clockClasses", "kind": "Variable" }, @@ -82,6 +84,7 @@ { "name": "ExportedPickersYearProps", "kind": "Interface" }, { "name": "ExportedSlideTransitionProps", "kind": "Interface" }, { "name": "faIR", "kind": "Variable" }, + { "name": "FieldFormatTokenMap", "kind": "TypeAlias" }, { "name": "FieldRef", "kind": "Interface" }, { "name": "FieldSection", "kind": "Interface" }, { "name": "FieldSectionType", "kind": "TypeAlias" }, @@ -120,6 +123,7 @@ { "name": "MonthCalendarClasses", "kind": "Interface" }, { "name": "MonthCalendarClassKey", "kind": "TypeAlias" }, { "name": "MonthCalendarProps", "kind": "Interface" }, + { "name": "MuiPickersAdapter", "kind": "Interface" }, { "name": "MuiPickersAdapterContext", "kind": "Variable" }, { "name": "nbNO", "kind": "Variable" }, { "name": "nlNL", "kind": "Variable" }, diff --git a/test/utils/pickers-utils.tsx b/test/utils/pickers-utils.tsx index 167188424a25..f182a690a1a0 100644 --- a/test/utils/pickers-utils.tsx +++ b/test/utils/pickers-utils.tsx @@ -22,7 +22,7 @@ import { AdapterMoment } from '@mui/x-date-pickers/AdapterMoment'; import { AdapterMomentHijri } from '@mui/x-date-pickers/AdapterMomentHijri'; import { AdapterMomentJalaali } from '@mui/x-date-pickers/AdapterMomentJalaali'; import { AdapterDateFnsJalali } from '@mui/x-date-pickers/AdapterDateFnsJalali'; -import { MuiPickersAdapter } from '@mui/x-date-pickers/internals/models'; +import { MuiPickersAdapter } from '@mui/x-date-pickers/models'; import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider'; import { CLOCK_WIDTH } from '@mui/x-date-pickers/TimeClock/shared';