diff --git a/docs/data/date-pickers/experimentation/CustomField.tsx b/docs/data/date-pickers/experimentation/CustomField.tsx index ddacbf62d2640..b1c10ad6b0959 100644 --- a/docs/data/date-pickers/experimentation/CustomField.tsx +++ b/docs/data/date-pickers/experimentation/CustomField.tsx @@ -4,12 +4,11 @@ import TextField from '@mui/material/TextField'; import { DemoContainer } from '@mui/x-date-pickers/internals/demo'; import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'; import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider'; -import { DatePicker } from '@mui/x-date-pickers/DatePicker'; +import { DatePicker, DatePickerFieldProps } from '@mui/x-date-pickers/DatePicker'; import { useValidation, validateDate } from '@mui/x-date-pickers/validation'; import { useSplitFieldProps } from '@mui/x-date-pickers/hooks'; -import { DateFieldInPickerProps } from '@mui/x-date-pickers/DateField'; -function ReadOnlyField(props: DateFieldInPickerProps) { +function ReadOnlyField(props: DatePickerFieldProps) { const { internalProps, forwardedProps } = useSplitFieldProps(props, 'date'); const { value, timezone, format } = internalProps; diff --git a/packages/x-date-pickers/src/DateField/DateField.types.ts b/packages/x-date-pickers/src/DateField/DateField.types.ts index 57ab1e1830aec..cf1bdfcc800ac 100644 --- a/packages/x-date-pickers/src/DateField/DateField.types.ts +++ b/packages/x-date-pickers/src/DateField/DateField.types.ts @@ -11,10 +11,9 @@ import { FieldSection, PickerValidDate, BuiltInFieldTextFieldProps, - BaseSingleInputFieldProps, } from '../models'; import { UseFieldInternalProps } from '../internals/hooks/useField'; -import { MakeOptional, DefaultizedProps } from '../internals/models/helpers'; +import { MakeOptional } from '../internals/models/helpers'; import { BaseDateValidationProps, DayValidationProps, @@ -41,19 +40,6 @@ export interface UseDateFieldProps< BaseDateValidationProps, ExportedUseClearableFieldProps {} -/** - * Props the field can receive when used inside a date picker. - * (`DatePicker`, `DesktopDatePicker` or `MobileDatePicker` component). - */ -export type DateFieldInPickerProps< - TDate extends PickerValidDate, - TEnableAccessibleFieldDOMStructure extends boolean, -> = DefaultizedProps< - UseDateFieldProps, - 'format' | 'timezone' | keyof BaseDateValidationProps -> & - BaseSingleInputFieldProps; - export type UseDateFieldComponentProps< TDate extends PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean, diff --git a/packages/x-date-pickers/src/DateField/index.ts b/packages/x-date-pickers/src/DateField/index.ts index e5f8fe21dcb29..cd6119e98a255 100644 --- a/packages/x-date-pickers/src/DateField/index.ts +++ b/packages/x-date-pickers/src/DateField/index.ts @@ -4,5 +4,4 @@ export type { UseDateFieldProps, UseDateFieldComponentProps, DateFieldProps, - DateFieldInPickerProps, } from './DateField.types'; diff --git a/packages/x-date-pickers/src/DatePicker/DatePicker.types.ts b/packages/x-date-pickers/src/DatePicker/DatePicker.types.ts index be4f6c1fbfca9..5a839bae41554 100644 --- a/packages/x-date-pickers/src/DatePicker/DatePicker.types.ts +++ b/packages/x-date-pickers/src/DatePicker/DatePicker.types.ts @@ -1,14 +1,22 @@ +import { UseDateFieldProps } from '../DateField'; import { DesktopDatePickerProps, DesktopDatePickerSlots, DesktopDatePickerSlotProps, } from '../DesktopDatePicker'; +import { DefaultizedProps } from '../internals/models/helpers'; +import { BaseDateValidationProps } from '../internals/models/validation'; import { MobileDatePickerProps, MobileDatePickerSlots, MobileDatePickerSlotProps, } from '../MobileDatePicker'; -import { PickerValidDate } from '../models'; +import { + BaseSingleInputFieldProps, + DateValidationError, + FieldSection, + PickerValidDate, +} from '../models'; export interface DatePickerSlots extends DesktopDatePickerSlots, @@ -47,3 +55,15 @@ export interface DatePickerProps< */ yearsPerRow?: 3 | 4; } + +/** + * Props the field can receive when used inside a `DatePicker`, `DesktopDatePicker` or `MobileDatePicker` component. + */ +export type DatePickerFieldProps< + TDate extends PickerValidDate, + TEnableAccessibleFieldDOMStructure extends boolean = false, +> = DefaultizedProps< + UseDateFieldProps, + 'format' | 'timezone' | keyof BaseDateValidationProps +> & + BaseSingleInputFieldProps; diff --git a/packages/x-date-pickers/src/DatePicker/index.ts b/packages/x-date-pickers/src/DatePicker/index.ts index 8c1fecffe1aa7..117b9833d3d24 100644 --- a/packages/x-date-pickers/src/DatePicker/index.ts +++ b/packages/x-date-pickers/src/DatePicker/index.ts @@ -1,5 +1,10 @@ export { DatePicker } from './DatePicker'; -export type { DatePickerProps, DatePickerSlots, DatePickerSlotProps } from './DatePicker.types'; +export type { + DatePickerProps, + DatePickerSlots, + DatePickerSlotProps, + DatePickerFieldProps, +} from './DatePicker.types'; export { DatePickerToolbar } from './DatePickerToolbar'; export type { DatePickerToolbarProps } from './DatePickerToolbar'; diff --git a/packages/x-date-pickers/src/DateTimeField/DateTimeField.types.ts b/packages/x-date-pickers/src/DateTimeField/DateTimeField.types.ts index e19e41a6345ad..625f70532e552 100644 --- a/packages/x-date-pickers/src/DateTimeField/DateTimeField.types.ts +++ b/packages/x-date-pickers/src/DateTimeField/DateTimeField.types.ts @@ -6,10 +6,9 @@ import { FieldSection, PickerValidDate, BuiltInFieldTextFieldProps, - BaseSingleInputFieldProps, } from '../models'; import { UseFieldInternalProps } from '../internals/hooks/useField'; -import { DefaultizedProps, MakeOptional } from '../internals/models/helpers'; +import { MakeOptional } from '../internals/models/helpers'; import { BaseDateValidationProps, BaseTimeValidationProps, @@ -53,23 +52,6 @@ export interface UseDateTimeFieldProps< ampm?: boolean; } -/** - * Props the field can receive when used inside a date time picker. - * (`DateTimePicker`, `DesktopDateTimePicker` or `MobileDateTimePicker` component). - */ -export type DateTimeFieldInPickerProps< - TDate extends PickerValidDate, - TEnableAccessibleFieldDOMStructure extends boolean, -> = DefaultizedProps< - UseDateTimeFieldProps, - | 'format' - | 'timezone' - | 'ampm' - | keyof BaseDateValidationProps - | keyof BaseTimeValidationProps -> & - BaseSingleInputFieldProps; - export type UseDateTimeFieldComponentProps< TDate extends PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean, diff --git a/packages/x-date-pickers/src/DateTimeField/index.ts b/packages/x-date-pickers/src/DateTimeField/index.ts index 212ce42432f5a..95952dde94748 100644 --- a/packages/x-date-pickers/src/DateTimeField/index.ts +++ b/packages/x-date-pickers/src/DateTimeField/index.ts @@ -4,5 +4,4 @@ export type { UseDateTimeFieldProps, UseDateTimeFieldComponentProps, DateTimeFieldProps, - DateTimeFieldInPickerProps, } from './DateTimeField.types'; diff --git a/packages/x-date-pickers/src/DateTimePicker/DateTimePicker.types.ts b/packages/x-date-pickers/src/DateTimePicker/DateTimePicker.types.ts index 8053bc8c5c639..6ae28b8bc2fe1 100644 --- a/packages/x-date-pickers/src/DateTimePicker/DateTimePicker.types.ts +++ b/packages/x-date-pickers/src/DateTimePicker/DateTimePicker.types.ts @@ -1,15 +1,23 @@ +import { UseDateTimeFieldProps } from '../DateTimeField'; import { DesktopDateTimePickerProps, DesktopDateTimePickerSlots, DesktopDateTimePickerSlotProps, } from '../DesktopDateTimePicker'; import { DateOrTimeViewWithMeridiem } from '../internals/models'; +import { DefaultizedProps } from '../internals/models/helpers'; +import { BaseDateValidationProps, BaseTimeValidationProps } from '../internals/models/validation'; import { MobileDateTimePickerProps, MobileDateTimePickerSlots, MobileDateTimePickerSlotProps, } from '../MobileDateTimePicker'; -import { PickerValidDate } from '../models'; +import { + BaseSingleInputFieldProps, + DateTimeValidationError, + FieldSection, + PickerValidDate, +} from '../models'; import { ExportedYearCalendarProps } from '../YearCalendar/YearCalendar.types'; export interface DateTimePickerSlots @@ -61,3 +69,20 @@ export interface DateTimePickerProps< */ yearsPerRow?: 3 | 4; } + +/** + * Props the field can receive when used inside a date time picker. + * (`DateTimePicker`, `DesktopDateTimePicker` or `MobileDateTimePicker` component). + */ +export type DateTimePickerFieldProps< + TDate extends PickerValidDate, + TEnableAccessibleFieldDOMStructure extends boolean = false, +> = DefaultizedProps< + UseDateTimeFieldProps, + | 'format' + | 'timezone' + | 'ampm' + | keyof BaseDateValidationProps + | keyof BaseTimeValidationProps +> & + BaseSingleInputFieldProps; diff --git a/packages/x-date-pickers/src/DateTimePicker/DateTimePickerTabs.tsx b/packages/x-date-pickers/src/DateTimePicker/DateTimePickerTabs.tsx index dba5be6d3383f..a9042194162d7 100644 --- a/packages/x-date-pickers/src/DateTimePicker/DateTimePickerTabs.tsx +++ b/packages/x-date-pickers/src/DateTimePicker/DateTimePickerTabs.tsx @@ -126,7 +126,7 @@ const DateTimePickerTabs = function DateTimePickerTabs = DefaultizedProps< - UseTimeFieldProps, - 'format' | 'timezone' | 'ampm' | keyof BaseTimeValidationProps -> & - BaseSingleInputFieldProps; - export type UseTimeFieldComponentProps< TDate extends PickerValidDate, TEnableAccessibleFieldDOMStructure extends boolean, diff --git a/packages/x-date-pickers/src/TimeField/index.ts b/packages/x-date-pickers/src/TimeField/index.ts index cf9c1e6a58813..f335f0f8fd769 100644 --- a/packages/x-date-pickers/src/TimeField/index.ts +++ b/packages/x-date-pickers/src/TimeField/index.ts @@ -4,5 +4,4 @@ export type { UseTimeFieldProps, UseTimeFieldComponentProps, TimeFieldProps, - TimeFieldInPickerProps, } from './TimeField.types'; diff --git a/packages/x-date-pickers/src/TimePicker/TimePicker.types.ts b/packages/x-date-pickers/src/TimePicker/TimePicker.types.ts index 23121361eff63..ea7f4fd343b16 100644 --- a/packages/x-date-pickers/src/TimePicker/TimePicker.types.ts +++ b/packages/x-date-pickers/src/TimePicker/TimePicker.types.ts @@ -4,12 +4,20 @@ import { DesktopTimePickerSlotProps, } from '../DesktopTimePicker'; import { TimeViewWithMeridiem } from '../internals/models'; +import { DefaultizedProps } from '../internals/models/helpers'; +import { BaseTimeValidationProps } from '../internals/models/validation'; import { MobileTimePickerProps, MobileTimePickerSlots, MobileTimePickerSlotProps, } from '../MobileTimePicker'; -import { PickerValidDate } from '../models'; +import { + BaseSingleInputFieldProps, + FieldSection, + PickerValidDate, + TimeValidationError, +} from '../models'; +import { UseTimeFieldProps } from '../TimeField'; export interface TimePickerSlots extends DesktopTimePickerSlots, @@ -46,3 +54,16 @@ export interface TimePickerProps< */ slotProps?: TimePickerSlotProps; } + +/** + * Props the field can receive when used inside a time picker. + * (`TimePicker`, `DesktopTimePicker` or `MobileTimePicker` component). + */ +export type TimePickerFieldProps< + TDate extends PickerValidDate, + TEnableAccessibleFieldDOMStructure extends boolean = false, +> = DefaultizedProps< + UseTimeFieldProps, + 'format' | 'timezone' | 'ampm' | keyof BaseTimeValidationProps +> & + BaseSingleInputFieldProps; diff --git a/packages/x-date-pickers/src/TimePicker/index.ts b/packages/x-date-pickers/src/TimePicker/index.ts index 485198a142bfe..9f2f67d1a5361 100644 --- a/packages/x-date-pickers/src/TimePicker/index.ts +++ b/packages/x-date-pickers/src/TimePicker/index.ts @@ -1,5 +1,10 @@ export { TimePicker } from './TimePicker'; -export type { TimePickerProps, TimePickerSlots, TimePickerSlotProps } from './TimePicker.types'; +export type { + TimePickerProps, + TimePickerSlots, + TimePickerSlotProps, + TimePickerFieldProps, +} from './TimePicker.types'; export { TimePickerToolbar } from './TimePickerToolbar'; export type { TimePickerToolbarProps } from './TimePickerToolbar'; diff --git a/scripts/x-date-pickers-pro.exports.json b/scripts/x-date-pickers-pro.exports.json index 24beed3508138..efd9594f7858f 100644 --- a/scripts/x-date-pickers-pro.exports.json +++ b/scripts/x-date-pickers-pro.exports.json @@ -34,10 +34,10 @@ { "name": "DateCalendarSlotProps", "kind": "Interface" }, { "name": "DateCalendarSlots", "kind": "Interface" }, { "name": "DateField", "kind": "Variable" }, - { "name": "DateFieldInPickerProps", "kind": "TypeAlias" }, { "name": "DateFieldProps", "kind": "TypeAlias" }, { "name": "DateOrTimeView", "kind": "TypeAlias" }, { "name": "DatePicker", "kind": "Variable" }, + { "name": "DatePickerFieldProps", "kind": "TypeAlias" }, { "name": "DatePickerProps", "kind": "Interface" }, { "name": "DatePickerSlotProps", "kind": "Interface" }, { "name": "DatePickerSlots", "kind": "Interface" }, @@ -72,9 +72,9 @@ { "name": "DateRangeValidationError", "kind": "TypeAlias" }, { "name": "DateRangeViewRendererProps", "kind": "Interface" }, { "name": "DateTimeField", "kind": "Variable" }, - { "name": "DateTimeFieldInPickerProps", "kind": "TypeAlias" }, { "name": "DateTimeFieldProps", "kind": "TypeAlias" }, { "name": "DateTimePicker", "kind": "Variable" }, + { "name": "DateTimePickerFieldProps", "kind": "TypeAlias" }, { "name": "DateTimePickerProps", "kind": "Interface" }, { "name": "DateTimePickerSlotProps", "kind": "Interface" }, { "name": "DateTimePickerSlots", "kind": "Interface" }, @@ -372,10 +372,10 @@ { "name": "TimeClockSlotProps", "kind": "Interface" }, { "name": "TimeClockSlots", "kind": "Interface" }, { "name": "TimeField", "kind": "Variable" }, - { "name": "TimeFieldInPickerProps", "kind": "TypeAlias" }, { "name": "TimeFieldProps", "kind": "TypeAlias" }, { "name": "TimeIcon", "kind": "Variable" }, { "name": "TimePicker", "kind": "Variable" }, + { "name": "TimePickerFieldProps", "kind": "TypeAlias" }, { "name": "TimePickerProps", "kind": "Interface" }, { "name": "TimePickerSlotProps", "kind": "Interface" }, { "name": "TimePickerSlots", "kind": "Interface" }, diff --git a/scripts/x-date-pickers.exports.json b/scripts/x-date-pickers.exports.json index 4ae16b168cba4..8581ad3473515 100644 --- a/scripts/x-date-pickers.exports.json +++ b/scripts/x-date-pickers.exports.json @@ -31,10 +31,10 @@ { "name": "DateCalendarSlotProps", "kind": "Interface" }, { "name": "DateCalendarSlots", "kind": "Interface" }, { "name": "DateField", "kind": "Variable" }, - { "name": "DateFieldInPickerProps", "kind": "TypeAlias" }, { "name": "DateFieldProps", "kind": "TypeAlias" }, { "name": "DateOrTimeView", "kind": "TypeAlias" }, { "name": "DatePicker", "kind": "Variable" }, + { "name": "DatePickerFieldProps", "kind": "TypeAlias" }, { "name": "DatePickerProps", "kind": "Interface" }, { "name": "DatePickerSlotProps", "kind": "Interface" }, { "name": "DatePickerSlots", "kind": "Interface" }, @@ -45,9 +45,9 @@ { "name": "DatePickerToolbarProps", "kind": "Interface" }, { "name": "DateRangeIcon", "kind": "Variable" }, { "name": "DateTimeField", "kind": "Variable" }, - { "name": "DateTimeFieldInPickerProps", "kind": "TypeAlias" }, { "name": "DateTimeFieldProps", "kind": "TypeAlias" }, { "name": "DateTimePicker", "kind": "Variable" }, + { "name": "DateTimePickerFieldProps", "kind": "TypeAlias" }, { "name": "DateTimePickerProps", "kind": "Interface" }, { "name": "DateTimePickerSlotProps", "kind": "Interface" }, { "name": "DateTimePickerSlots", "kind": "Interface" }, @@ -271,10 +271,10 @@ { "name": "TimeClockSlotProps", "kind": "Interface" }, { "name": "TimeClockSlots", "kind": "Interface" }, { "name": "TimeField", "kind": "Variable" }, - { "name": "TimeFieldInPickerProps", "kind": "TypeAlias" }, { "name": "TimeFieldProps", "kind": "TypeAlias" }, { "name": "TimeIcon", "kind": "Variable" }, { "name": "TimePicker", "kind": "Variable" }, + { "name": "TimePickerFieldProps", "kind": "TypeAlias" }, { "name": "TimePickerProps", "kind": "Interface" }, { "name": "TimePickerSlotProps", "kind": "Interface" }, { "name": "TimePickerSlots", "kind": "Interface" },