diff --git a/docs/data/data-grid/custom-columns/EditingWithDatePickers.tsx b/docs/data/data-grid/custom-columns/EditingWithDatePickers.tsx index 4f8f4803dd6c5..5942bbb3c31c6 100644 --- a/docs/data/data-grid/custom-columns/EditingWithDatePickers.tsx +++ b/docs/data/data-grid/custom-columns/EditingWithDatePickers.tsx @@ -70,7 +70,7 @@ function GridEditDateCell({ field, value, colDef, -}: GridRenderEditCellParams) { +}: GridRenderEditCellParams) { const apiRef = useGridApiContext(); const Component = colDef.type === 'dateTime' ? DateTimePicker : DatePicker; diff --git a/docs/data/date-pickers/custom-field/WrappedSingleInputDateRangePicker.tsx b/docs/data/date-pickers/custom-field/WrappedSingleInputDateRangePicker.tsx index 6e104e4b67779..a7f000683fc7c 100644 --- a/docs/data/date-pickers/custom-field/WrappedSingleInputDateRangePicker.tsx +++ b/docs/data/date-pickers/custom-field/WrappedSingleInputDateRangePicker.tsx @@ -8,8 +8,9 @@ import { SingleInputDateRangeFieldProps, } from '@mui/x-date-pickers-pro/SingleInputDateRangeField'; import { DemoContainer } from '@mui/x-date-pickers/internals/demo'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; -type FieldComponent = (( +type FieldComponent = (( props: SingleInputDateRangeFieldProps & React.RefAttributes, ) => React.JSX.Element) & { fieldType?: string }; diff --git a/docs/data/date-pickers/lifecycle/LifeCycleDateFieldEmpty.js b/docs/data/date-pickers/lifecycle/LifeCycleDateFieldEmpty.js index ff6c9544090e2..3ed120732789b 100644 --- a/docs/data/date-pickers/lifecycle/LifeCycleDateFieldEmpty.js +++ b/docs/data/date-pickers/lifecycle/LifeCycleDateFieldEmpty.js @@ -12,7 +12,7 @@ export default function LifeCycleDateFieldEmpty() { return ( - setValue(newValue)} /> + Value: {value == null ? 'null' : value.format('L')} diff --git a/docs/data/date-pickers/lifecycle/LifeCycleDateFieldEmpty.tsx b/docs/data/date-pickers/lifecycle/LifeCycleDateFieldEmpty.tsx index 22fafe61283b9..6444023122b6b 100644 --- a/docs/data/date-pickers/lifecycle/LifeCycleDateFieldEmpty.tsx +++ b/docs/data/date-pickers/lifecycle/LifeCycleDateFieldEmpty.tsx @@ -12,7 +12,7 @@ export default function LifeCycleDateFieldEmpty() { return ( - setValue(newValue)} /> + Value: {value == null ? 'null' : value.format('L')} diff --git a/docs/data/date-pickers/lifecycle/LifeCycleDateFieldEmpty.tsx.preview b/docs/data/date-pickers/lifecycle/LifeCycleDateFieldEmpty.tsx.preview index 7f22674742a9f..1746e78fd888d 100644 --- a/docs/data/date-pickers/lifecycle/LifeCycleDateFieldEmpty.tsx.preview +++ b/docs/data/date-pickers/lifecycle/LifeCycleDateFieldEmpty.tsx.preview @@ -1,4 +1,4 @@ - setValue(newValue)} /> + Value: {value == null ? 'null' : value.format('L')} \ No newline at end of file diff --git a/docs/data/date-pickers/lifecycle/LifeCycleDateRangeField.js b/docs/data/date-pickers/lifecycle/LifeCycleDateRangeField.js index a77c9d6d5abf8..ff34833efbb6a 100644 --- a/docs/data/date-pickers/lifecycle/LifeCycleDateRangeField.js +++ b/docs/data/date-pickers/lifecycle/LifeCycleDateRangeField.js @@ -14,10 +14,7 @@ export default function LifeCycleDateRangeField() { - setValue(newValue)} - /> + diff --git a/docs/data/date-pickers/lifecycle/LifeCycleDateRangeField.tsx b/docs/data/date-pickers/lifecycle/LifeCycleDateRangeField.tsx index f6cae364e97b8..8bab9a5ad4607 100644 --- a/docs/data/date-pickers/lifecycle/LifeCycleDateRangeField.tsx +++ b/docs/data/date-pickers/lifecycle/LifeCycleDateRangeField.tsx @@ -9,7 +9,7 @@ import { SingleInputDateRangeField } from '@mui/x-date-pickers-pro/SingleInputDa import { DateRange } from '@mui/x-date-pickers-pro/models'; export default function LifeCycleDateRangeField() { - const [value, setValue] = React.useState>([ + const [value, setValue] = React.useState>([ dayjs('2022-04-17'), null, ]); @@ -18,10 +18,7 @@ export default function LifeCycleDateRangeField() { - setValue(newValue)} - /> + diff --git a/docs/data/date-pickers/lifecycle/LifeCycleDateRangeField.tsx.preview b/docs/data/date-pickers/lifecycle/LifeCycleDateRangeField.tsx.preview index 90f4a115ac5da..4cce05110e86b 100644 --- a/docs/data/date-pickers/lifecycle/LifeCycleDateRangeField.tsx.preview +++ b/docs/data/date-pickers/lifecycle/LifeCycleDateRangeField.tsx.preview @@ -1,9 +1,6 @@ - setValue(newValue)} - /> + diff --git a/docs/pages/x/api/date-pickers/date-calendar.json b/docs/pages/x/api/date-pickers/date-calendar.json index 146845aef005c..b25efc587db9f 100644 --- a/docs/pages/x/api/date-pickers/date-calendar.json +++ b/docs/pages/x/api/date-pickers/date-calendar.json @@ -10,7 +10,7 @@ "returned": "string" } }, - "defaultValue": { "type": { "name": "any" } }, + "defaultValue": { "type": { "name": "object" } }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableFuture": { "type": { "name": "bool" }, "default": "false" }, "disableHighlightToday": { "type": { "name": "bool" }, "default": "false" }, @@ -24,8 +24,8 @@ } }, "loading": { "type": { "name": "bool" }, "default": "false" }, - "maxDate": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, "monthsPerRow": { "type": { "name": "enum", "description": "3
| 4" }, "default": "3" @@ -68,7 +68,7 @@ "default": "`@media(prefers-reduced-motion: reduce)` || `navigator.userAgent` matches Android <10 or iOS <13" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date using the validation props, except callbacks such as `shouldDisableDate`." }, "renderLoading": { @@ -126,7 +126,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "any" } }, + "value": { "type": { "name": "object" } }, "view": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/date-field.json b/docs/pages/x/api/date-pickers/date-field.json index 46e896fb433f9..ac12fc860e072 100644 --- a/docs/pages/x/api/date-pickers/date-field.json +++ b/docs/pages/x/api/date-pickers/date-field.json @@ -9,7 +9,7 @@ }, "default": "'primary'" }, - "defaultValue": { "type": { "name": "any" } }, + "defaultValue": { "type": { "name": "object" } }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableFuture": { "type": { "name": "bool" }, "default": "false" }, "disablePast": { "type": { "name": "bool" }, "default": "false" }, @@ -36,8 +36,8 @@ }, "default": "'none'" }, - "maxDate": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, "name": { "type": { "name": "string" } }, "onChange": { "type": { "name": "func" }, @@ -63,7 +63,7 @@ }, "readOnly": { "type": { "name": "bool" }, "default": "false" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date using the validation props, except callbacks such as `shouldDisableDate`. Value is rounded to the most granular section used." }, "required": { "type": { "name": "bool" }, "default": "false" }, @@ -123,7 +123,7 @@ "unstableFieldRef": { "type": { "name": "union", "description": "func
| object" } }, - "value": { "type": { "name": "any" } }, + "value": { "type": { "name": "object" } }, "variant": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/date-picker.json b/docs/pages/x/api/date-pickers/date-picker.json index 136abb7d5337c..74bd6aecc5b16 100644 --- a/docs/pages/x/api/date-pickers/date-picker.json +++ b/docs/pages/x/api/date-pickers/date-picker.json @@ -14,7 +14,7 @@ "returned": "string" } }, - "defaultValue": { "type": { "name": "any" } }, + "defaultValue": { "type": { "name": "object" } }, "desktopModeMediaQuery": { "type": { "name": "string" }, "default": "'@media (pointer: fine)'" @@ -35,8 +35,8 @@ "label": { "type": { "name": "node" } }, "loading": { "type": { "name": "bool" }, "default": "false" }, "localeText": { "type": { "name": "object" } }, - "maxDate": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, "monthsPerRow": { "type": { "name": "enum", "description": "3
| 4" }, "default": "3" @@ -96,7 +96,7 @@ "default": "`@media(prefers-reduced-motion: reduce)` || `navigator.userAgent` matches Android <10 or iOS <13" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`." }, "renderLoading": { @@ -160,7 +160,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "any" } }, + "value": { "type": { "name": "object" } }, "view": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/date-range-calendar.json b/docs/pages/x/api/date-pickers/date-range-calendar.json index afa6e86ecdf77..bc7330a92d879 100644 --- a/docs/pages/x/api/date-pickers/date-range-calendar.json +++ b/docs/pages/x/api/date-pickers/date-range-calendar.json @@ -26,7 +26,7 @@ "type": { "name": "enum", "description": "'end'
| 'start'" }, "default": "'start'" }, - "defaultValue": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "defaultValue": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "disableAutoMonthSwitching": { "type": { "name": "bool" }, "default": "false" }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableDragEditing": { "type": { "name": "bool" }, "default": "false" }, @@ -37,8 +37,8 @@ "fixedWeekNumber": { "type": { "name": "number" }, "default": "undefined" }, "focusedView": { "type": { "name": "enum", "description": "'day'" } }, "loading": { "type": { "name": "bool" }, "default": "false" }, - "maxDate": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, "onChange": { "type": { "name": "func" }, "signature": { @@ -76,7 +76,7 @@ "default": "`@media(prefers-reduced-motion: reduce)` || `navigator.userAgent` matches Android <10 or iOS <13" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date using the validation props, except callbacks such as `shouldDisableDate`." }, "renderLoading": { @@ -118,7 +118,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "value": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "view": { "type": { "name": "enum", "description": "'day'" } }, "views": { "type": { "name": "arrayOf", "description": "Array<'day'>" } } }, diff --git a/docs/pages/x/api/date-pickers/date-range-picker-day.json b/docs/pages/x/api/date-pickers/date-range-picker-day.json index 03725816fc5ab..fc19b9e50ec6d 100644 --- a/docs/pages/x/api/date-pickers/date-range-picker-day.json +++ b/docs/pages/x/api/date-pickers/date-range-picker-day.json @@ -1,6 +1,6 @@ { "props": { - "day": { "type": { "name": "any" }, "required": true }, + "day": { "type": { "name": "object" }, "required": true }, "isEndOfHighlighting": { "type": { "name": "bool" }, "required": true }, "isEndOfPreviewing": { "type": { "name": "bool" }, "required": true }, "isFirstVisibleCell": { "type": { "name": "bool" }, "required": true }, diff --git a/docs/pages/x/api/date-pickers/date-range-picker.json b/docs/pages/x/api/date-pickers/date-range-picker.json index 09c5a61c90075..e880dfb8e391d 100644 --- a/docs/pages/x/api/date-pickers/date-range-picker.json +++ b/docs/pages/x/api/date-pickers/date-range-picker.json @@ -26,7 +26,7 @@ "type": { "name": "enum", "description": "'end'
| 'start'" }, "default": "'start'" }, - "defaultValue": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "defaultValue": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "desktopModeMediaQuery": { "type": { "name": "string" }, "default": "'@media (pointer: fine)'" @@ -49,8 +49,8 @@ "label": { "type": { "name": "node" } }, "loading": { "type": { "name": "bool" }, "default": "false" }, "localeText": { "type": { "name": "object" } }, - "maxDate": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, "name": { "type": { "name": "string" } }, "onAccept": { "type": { "name": "func" }, @@ -97,7 +97,7 @@ "default": "`@media(prefers-reduced-motion: reduce)` || `navigator.userAgent` matches Android <10 or iOS <13" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`." }, "renderLoading": { @@ -145,7 +145,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "value": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "viewRenderers": { "type": { "name": "shape", "description": "{ day?: func }" } } }, "name": "DateRangePicker", diff --git a/docs/pages/x/api/date-pickers/date-time-field.json b/docs/pages/x/api/date-pickers/date-time-field.json index 2ccfcbcc7dd5e..6c12c32f7960c 100644 --- a/docs/pages/x/api/date-pickers/date-time-field.json +++ b/docs/pages/x/api/date-pickers/date-time-field.json @@ -10,7 +10,7 @@ }, "default": "'primary'" }, - "defaultValue": { "type": { "name": "any" } }, + "defaultValue": { "type": { "name": "object" } }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableFuture": { "type": { "name": "bool" }, "default": "false" }, "disableIgnoringDatePartForTimeValidation": { "type": { "name": "bool" }, "default": "false" }, @@ -38,12 +38,12 @@ }, "default": "'none'" }, - "maxDate": { "type": { "name": "any" } }, - "maxDateTime": { "type": { "name": "any" } }, - "maxTime": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, - "minDateTime": { "type": { "name": "any" } }, - "minTime": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "maxDateTime": { "type": { "name": "object" } }, + "maxTime": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, + "minDateTime": { "type": { "name": "object" } }, + "minTime": { "type": { "name": "object" } }, "minutesStep": { "type": { "name": "number" }, "default": "1" }, "name": { "type": { "name": "string" } }, "onChange": { @@ -70,7 +70,7 @@ }, "readOnly": { "type": { "name": "bool" }, "default": "false" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date using the validation props, except callbacks such as `shouldDisableDate`. Value is rounded to the most granular section used." }, "required": { "type": { "name": "bool" }, "default": "false" }, @@ -138,7 +138,7 @@ "unstableFieldRef": { "type": { "name": "union", "description": "func
| object" } }, - "value": { "type": { "name": "any" } }, + "value": { "type": { "name": "object" } }, "variant": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/date-time-picker.json b/docs/pages/x/api/date-pickers/date-time-picker.json index e6627f6e6a428..ed8010be192b1 100644 --- a/docs/pages/x/api/date-pickers/date-time-picker.json +++ b/docs/pages/x/api/date-pickers/date-time-picker.json @@ -16,7 +16,7 @@ "returned": "string" } }, - "defaultValue": { "type": { "name": "any" } }, + "defaultValue": { "type": { "name": "object" } }, "desktopModeMediaQuery": { "type": { "name": "string" }, "default": "'@media (pointer: fine)'" @@ -38,12 +38,12 @@ "label": { "type": { "name": "node" } }, "loading": { "type": { "name": "bool" }, "default": "false" }, "localeText": { "type": { "name": "object" } }, - "maxDate": { "type": { "name": "any" } }, - "maxDateTime": { "type": { "name": "any" } }, - "maxTime": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, - "minDateTime": { "type": { "name": "any" } }, - "minTime": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "maxDateTime": { "type": { "name": "object" } }, + "maxTime": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, + "minDateTime": { "type": { "name": "object" } }, + "minTime": { "type": { "name": "object" } }, "minutesStep": { "type": { "name": "number" }, "default": "1" }, "monthsPerRow": { "type": { "name": "enum", "description": "3
| 4" }, @@ -104,7 +104,7 @@ "default": "`@media(prefers-reduced-motion: reduce)` || `navigator.userAgent` matches Android <10 or iOS <13" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`." }, "renderLoading": { @@ -185,7 +185,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "any" } }, + "value": { "type": { "name": "object" } }, "view": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/date-time-range-picker.json b/docs/pages/x/api/date-pickers/date-time-range-picker.json index 55d6d1ee2f796..ce588b76b7efb 100644 --- a/docs/pages/x/api/date-pickers/date-time-range-picker.json +++ b/docs/pages/x/api/date-pickers/date-time-range-picker.json @@ -27,7 +27,7 @@ "type": { "name": "enum", "description": "'end'
| 'start'" }, "default": "'start'" }, - "defaultValue": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "defaultValue": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "desktopModeMediaQuery": { "type": { "name": "string" }, "default": "'@media (pointer: fine)'" @@ -53,12 +53,12 @@ "label": { "type": { "name": "node" } }, "loading": { "type": { "name": "bool" }, "default": "false" }, "localeText": { "type": { "name": "object" } }, - "maxDate": { "type": { "name": "any" } }, - "maxDateTime": { "type": { "name": "any" } }, - "maxTime": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, - "minDateTime": { "type": { "name": "any" } }, - "minTime": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "maxDateTime": { "type": { "name": "object" } }, + "maxTime": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, + "minDateTime": { "type": { "name": "object" } }, + "minTime": { "type": { "name": "object" } }, "minutesStep": { "type": { "name": "number" }, "default": "1" }, "name": { "type": { "name": "string" } }, "onAccept": { @@ -116,7 +116,7 @@ "default": "`@media(prefers-reduced-motion: reduce)` || `navigator.userAgent` matches Android <10 or iOS <13" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`." }, "renderLoading": { @@ -181,7 +181,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "value": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "view": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/desktop-date-picker.json b/docs/pages/x/api/date-pickers/desktop-date-picker.json index b63268557d6cd..005ee08d475ea 100644 --- a/docs/pages/x/api/date-pickers/desktop-date-picker.json +++ b/docs/pages/x/api/date-pickers/desktop-date-picker.json @@ -14,7 +14,7 @@ "returned": "string" } }, - "defaultValue": { "type": { "name": "any" } }, + "defaultValue": { "type": { "name": "object" } }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableFuture": { "type": { "name": "bool" }, "default": "false" }, "disableHighlightToday": { "type": { "name": "bool" }, "default": "false" }, @@ -31,8 +31,8 @@ "label": { "type": { "name": "node" } }, "loading": { "type": { "name": "bool" }, "default": "false" }, "localeText": { "type": { "name": "object" } }, - "maxDate": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, "monthsPerRow": { "type": { "name": "enum", "description": "3
| 4" }, "default": "3" @@ -92,7 +92,7 @@ "default": "`@media(prefers-reduced-motion: reduce)` || `navigator.userAgent` matches Android <10 or iOS <13" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`." }, "renderLoading": { @@ -156,7 +156,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "any" } }, + "value": { "type": { "name": "object" } }, "view": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/desktop-date-range-picker.json b/docs/pages/x/api/date-pickers/desktop-date-range-picker.json index f846abac5f697..6803cc3627dbf 100644 --- a/docs/pages/x/api/date-pickers/desktop-date-range-picker.json +++ b/docs/pages/x/api/date-pickers/desktop-date-range-picker.json @@ -26,7 +26,7 @@ "type": { "name": "enum", "description": "'end'
| 'start'" }, "default": "'start'" }, - "defaultValue": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "defaultValue": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "disableAutoMonthSwitching": { "type": { "name": "bool" }, "default": "false" }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableDragEditing": { "type": { "name": "bool" }, "default": "false" }, @@ -45,8 +45,8 @@ "label": { "type": { "name": "node" } }, "loading": { "type": { "name": "bool" }, "default": "false" }, "localeText": { "type": { "name": "object" } }, - "maxDate": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, "name": { "type": { "name": "string" } }, "onAccept": { "type": { "name": "func" }, @@ -93,7 +93,7 @@ "default": "`@media(prefers-reduced-motion: reduce)` || `navigator.userAgent` matches Android <10 or iOS <13" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`." }, "renderLoading": { @@ -141,7 +141,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "value": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "viewRenderers": { "type": { "name": "shape", "description": "{ day?: func }" } } }, "name": "DesktopDateRangePicker", diff --git a/docs/pages/x/api/date-pickers/desktop-date-time-picker.json b/docs/pages/x/api/date-pickers/desktop-date-time-picker.json index d4040cd02ae37..cdb7d42d3b16d 100644 --- a/docs/pages/x/api/date-pickers/desktop-date-time-picker.json +++ b/docs/pages/x/api/date-pickers/desktop-date-time-picker.json @@ -16,7 +16,7 @@ "returned": "string" } }, - "defaultValue": { "type": { "name": "any" } }, + "defaultValue": { "type": { "name": "object" } }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableFuture": { "type": { "name": "bool" }, "default": "false" }, "disableHighlightToday": { "type": { "name": "bool" }, "default": "false" }, @@ -34,12 +34,12 @@ "label": { "type": { "name": "node" } }, "loading": { "type": { "name": "bool" }, "default": "false" }, "localeText": { "type": { "name": "object" } }, - "maxDate": { "type": { "name": "any" } }, - "maxDateTime": { "type": { "name": "any" } }, - "maxTime": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, - "minDateTime": { "type": { "name": "any" } }, - "minTime": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "maxDateTime": { "type": { "name": "object" } }, + "maxTime": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, + "minDateTime": { "type": { "name": "object" } }, + "minTime": { "type": { "name": "object" } }, "minutesStep": { "type": { "name": "number" }, "default": "1" }, "monthsPerRow": { "type": { "name": "enum", "description": "3
| 4" }, @@ -100,7 +100,7 @@ "default": "`@media(prefers-reduced-motion: reduce)` || `navigator.userAgent` matches Android <10 or iOS <13" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`." }, "renderLoading": { @@ -181,7 +181,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "any" } }, + "value": { "type": { "name": "object" } }, "view": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/desktop-date-time-range-picker.json b/docs/pages/x/api/date-pickers/desktop-date-time-range-picker.json index 90357b9228f5f..b083f9ceeb1e0 100644 --- a/docs/pages/x/api/date-pickers/desktop-date-time-range-picker.json +++ b/docs/pages/x/api/date-pickers/desktop-date-time-range-picker.json @@ -27,7 +27,7 @@ "type": { "name": "enum", "description": "'end'
| 'start'" }, "default": "'start'" }, - "defaultValue": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "defaultValue": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "disableAutoMonthSwitching": { "type": { "name": "bool" }, "default": "false" }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableDragEditing": { "type": { "name": "bool" }, "default": "false" }, @@ -49,12 +49,12 @@ "label": { "type": { "name": "node" } }, "loading": { "type": { "name": "bool" }, "default": "false" }, "localeText": { "type": { "name": "object" } }, - "maxDate": { "type": { "name": "any" } }, - "maxDateTime": { "type": { "name": "any" } }, - "maxTime": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, - "minDateTime": { "type": { "name": "any" } }, - "minTime": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "maxDateTime": { "type": { "name": "object" } }, + "maxTime": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, + "minDateTime": { "type": { "name": "object" } }, + "minTime": { "type": { "name": "object" } }, "minutesStep": { "type": { "name": "number" }, "default": "1" }, "name": { "type": { "name": "string" } }, "onAccept": { @@ -112,7 +112,7 @@ "default": "`@media(prefers-reduced-motion: reduce)` || `navigator.userAgent` matches Android <10 or iOS <13" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`." }, "renderLoading": { @@ -177,7 +177,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "value": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "view": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/desktop-time-picker.json b/docs/pages/x/api/date-pickers/desktop-time-picker.json index 1b91794a34ccb..8273e26e92d90 100644 --- a/docs/pages/x/api/date-pickers/desktop-time-picker.json +++ b/docs/pages/x/api/date-pickers/desktop-time-picker.json @@ -7,7 +7,7 @@ "type": { "name": "bool" }, "default": "`true` for desktop, `false` for mobile (based on the chosen wrapper and `desktopModeMediaQuery` prop)." }, - "defaultValue": { "type": { "name": "any" } }, + "defaultValue": { "type": { "name": "object" } }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableFuture": { "type": { "name": "bool" }, "default": "false" }, "disableIgnoringDatePartForTimeValidation": { "type": { "name": "bool" }, "default": "false" }, @@ -21,8 +21,8 @@ "inputRef": { "type": { "name": "custom", "description": "ref" } }, "label": { "type": { "name": "node" } }, "localeText": { "type": { "name": "object" } }, - "maxTime": { "type": { "name": "any" } }, - "minTime": { "type": { "name": "any" } }, + "maxTime": { "type": { "name": "object" } }, + "minTime": { "type": { "name": "object" } }, "minutesStep": { "type": { "name": "number" }, "default": "1" }, "name": { "type": { "name": "string" } }, "onAccept": { @@ -71,7 +71,7 @@ "default": "`@media(prefers-reduced-motion: reduce)` || `navigator.userAgent` matches Android <10 or iOS <13" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`." }, "selectedSections": { @@ -118,7 +118,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "any" } }, + "value": { "type": { "name": "object" } }, "view": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/digital-clock.json b/docs/pages/x/api/date-pickers/digital-clock.json index 8f3d3af0be1c9..ab41bb11244ee 100644 --- a/docs/pages/x/api/date-pickers/digital-clock.json +++ b/docs/pages/x/api/date-pickers/digital-clock.json @@ -3,14 +3,14 @@ "ampm": { "type": { "name": "bool" }, "default": "`utils.is12HourCycleInCurrentLocale()`" }, "autoFocus": { "type": { "name": "bool" } }, "classes": { "type": { "name": "object" }, "additionalInfo": { "cssApi": true } }, - "defaultValue": { "type": { "name": "any" } }, + "defaultValue": { "type": { "name": "object" } }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableFuture": { "type": { "name": "bool" }, "default": "false" }, "disableIgnoringDatePartForTimeValidation": { "type": { "name": "bool" }, "default": "false" }, "disablePast": { "type": { "name": "bool" }, "default": "false" }, "focusedView": { "type": { "name": "enum", "description": "'hours'" } }, - "maxTime": { "type": { "name": "any" } }, - "minTime": { "type": { "name": "any" } }, + "maxTime": { "type": { "name": "object" } }, + "minTime": { "type": { "name": "object" } }, "minutesStep": { "type": { "name": "number" }, "default": "1" }, "onChange": { "type": { "name": "func" }, @@ -33,7 +33,7 @@ "openTo": { "type": { "name": "enum", "description": "'hours'" } }, "readOnly": { "type": { "name": "bool" }, "default": "false" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid time using the validation props, except callbacks such as `shouldDisableTime`." }, "shouldDisableTime": { @@ -67,7 +67,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "any" } }, + "value": { "type": { "name": "object" } }, "view": { "type": { "name": "enum", "description": "'hours'" } }, "views": { "type": { "name": "arrayOf", "description": "Array<'hours'>" }, diff --git a/docs/pages/x/api/date-pickers/mobile-date-picker.json b/docs/pages/x/api/date-pickers/mobile-date-picker.json index 97c2da277d2af..515572fbf8e53 100644 --- a/docs/pages/x/api/date-pickers/mobile-date-picker.json +++ b/docs/pages/x/api/date-pickers/mobile-date-picker.json @@ -14,7 +14,7 @@ "returned": "string" } }, - "defaultValue": { "type": { "name": "any" } }, + "defaultValue": { "type": { "name": "object" } }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableFuture": { "type": { "name": "bool" }, "default": "false" }, "disableHighlightToday": { "type": { "name": "bool" }, "default": "false" }, @@ -31,8 +31,8 @@ "label": { "type": { "name": "node" } }, "loading": { "type": { "name": "bool" }, "default": "false" }, "localeText": { "type": { "name": "object" } }, - "maxDate": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, "monthsPerRow": { "type": { "name": "enum", "description": "3
| 4" }, "default": "3" @@ -92,7 +92,7 @@ "default": "`@media(prefers-reduced-motion: reduce)` || `navigator.userAgent` matches Android <10 or iOS <13" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`." }, "renderLoading": { @@ -156,7 +156,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "any" } }, + "value": { "type": { "name": "object" } }, "view": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/mobile-date-range-picker.json b/docs/pages/x/api/date-pickers/mobile-date-range-picker.json index 88e6f7786dc1b..a4e7fd4f0ee02 100644 --- a/docs/pages/x/api/date-pickers/mobile-date-range-picker.json +++ b/docs/pages/x/api/date-pickers/mobile-date-range-picker.json @@ -22,7 +22,7 @@ "type": { "name": "enum", "description": "'end'
| 'start'" }, "default": "'start'" }, - "defaultValue": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "defaultValue": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "disableAutoMonthSwitching": { "type": { "name": "bool" }, "default": "false" }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableDragEditing": { "type": { "name": "bool" }, "default": "false" }, @@ -41,8 +41,8 @@ "label": { "type": { "name": "node" } }, "loading": { "type": { "name": "bool" }, "default": "false" }, "localeText": { "type": { "name": "object" } }, - "maxDate": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, "name": { "type": { "name": "string" } }, "onAccept": { "type": { "name": "func" }, @@ -89,7 +89,7 @@ "default": "`@media(prefers-reduced-motion: reduce)` || `navigator.userAgent` matches Android <10 or iOS <13" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`." }, "renderLoading": { @@ -137,7 +137,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "value": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "viewRenderers": { "type": { "name": "shape", "description": "{ day?: func }" } } }, "name": "MobileDateRangePicker", diff --git a/docs/pages/x/api/date-pickers/mobile-date-time-picker.json b/docs/pages/x/api/date-pickers/mobile-date-time-picker.json index 74600ec6244ea..619ab628fa460 100644 --- a/docs/pages/x/api/date-pickers/mobile-date-time-picker.json +++ b/docs/pages/x/api/date-pickers/mobile-date-time-picker.json @@ -16,7 +16,7 @@ "returned": "string" } }, - "defaultValue": { "type": { "name": "any" } }, + "defaultValue": { "type": { "name": "object" } }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableFuture": { "type": { "name": "bool" }, "default": "false" }, "disableHighlightToday": { "type": { "name": "bool" }, "default": "false" }, @@ -34,12 +34,12 @@ "label": { "type": { "name": "node" } }, "loading": { "type": { "name": "bool" }, "default": "false" }, "localeText": { "type": { "name": "object" } }, - "maxDate": { "type": { "name": "any" } }, - "maxDateTime": { "type": { "name": "any" } }, - "maxTime": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, - "minDateTime": { "type": { "name": "any" } }, - "minTime": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "maxDateTime": { "type": { "name": "object" } }, + "maxTime": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, + "minDateTime": { "type": { "name": "object" } }, + "minTime": { "type": { "name": "object" } }, "minutesStep": { "type": { "name": "number" }, "default": "1" }, "monthsPerRow": { "type": { "name": "enum", "description": "3
| 4" }, @@ -100,7 +100,7 @@ "default": "`@media(prefers-reduced-motion: reduce)` || `navigator.userAgent` matches Android <10 or iOS <13" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`." }, "renderLoading": { @@ -172,7 +172,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "any" } }, + "value": { "type": { "name": "object" } }, "view": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/mobile-date-time-range-picker.json b/docs/pages/x/api/date-pickers/mobile-date-time-range-picker.json index 688f24d49b0d3..fdbfb01fa0753 100644 --- a/docs/pages/x/api/date-pickers/mobile-date-time-range-picker.json +++ b/docs/pages/x/api/date-pickers/mobile-date-time-range-picker.json @@ -23,7 +23,7 @@ "type": { "name": "enum", "description": "'end'
| 'start'" }, "default": "'start'" }, - "defaultValue": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "defaultValue": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "disableAutoMonthSwitching": { "type": { "name": "bool" }, "default": "false" }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableDragEditing": { "type": { "name": "bool" }, "default": "false" }, @@ -45,12 +45,12 @@ "label": { "type": { "name": "node" } }, "loading": { "type": { "name": "bool" }, "default": "false" }, "localeText": { "type": { "name": "object" } }, - "maxDate": { "type": { "name": "any" } }, - "maxDateTime": { "type": { "name": "any" } }, - "maxTime": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, - "minDateTime": { "type": { "name": "any" } }, - "minTime": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "maxDateTime": { "type": { "name": "object" } }, + "maxTime": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, + "minDateTime": { "type": { "name": "object" } }, + "minTime": { "type": { "name": "object" } }, "minutesStep": { "type": { "name": "number" }, "default": "1" }, "name": { "type": { "name": "string" } }, "onAccept": { @@ -108,7 +108,7 @@ "default": "`@media(prefers-reduced-motion: reduce)` || `navigator.userAgent` matches Android <10 or iOS <13" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`." }, "renderLoading": { @@ -173,7 +173,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "value": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "view": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/mobile-time-picker.json b/docs/pages/x/api/date-pickers/mobile-time-picker.json index 59748eba26059..ff478590ca5df 100644 --- a/docs/pages/x/api/date-pickers/mobile-time-picker.json +++ b/docs/pages/x/api/date-pickers/mobile-time-picker.json @@ -7,7 +7,7 @@ "type": { "name": "bool" }, "default": "`true` for desktop, `false` for mobile (based on the chosen wrapper and `desktopModeMediaQuery` prop)." }, - "defaultValue": { "type": { "name": "any" } }, + "defaultValue": { "type": { "name": "object" } }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableFuture": { "type": { "name": "bool" }, "default": "false" }, "disableIgnoringDatePartForTimeValidation": { "type": { "name": "bool" }, "default": "false" }, @@ -21,8 +21,8 @@ "inputRef": { "type": { "name": "custom", "description": "ref" } }, "label": { "type": { "name": "node" } }, "localeText": { "type": { "name": "object" } }, - "maxTime": { "type": { "name": "any" } }, - "minTime": { "type": { "name": "any" } }, + "maxTime": { "type": { "name": "object" } }, + "minTime": { "type": { "name": "object" } }, "minutesStep": { "type": { "name": "number" }, "default": "1" }, "name": { "type": { "name": "string" } }, "onAccept": { @@ -71,7 +71,7 @@ "default": "`@media(prefers-reduced-motion: reduce)` || `navigator.userAgent` matches Android <10 or iOS <13" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`." }, "selectedSections": { @@ -109,7 +109,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "any" } }, + "value": { "type": { "name": "object" } }, "view": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/month-calendar.json b/docs/pages/x/api/date-pickers/month-calendar.json index 55c00405e6710..2fe02db3fe453 100644 --- a/docs/pages/x/api/date-pickers/month-calendar.json +++ b/docs/pages/x/api/date-pickers/month-calendar.json @@ -1,13 +1,13 @@ { "props": { "classes": { "type": { "name": "object" }, "additionalInfo": { "cssApi": true } }, - "defaultValue": { "type": { "name": "any" } }, + "defaultValue": { "type": { "name": "object" } }, "disabled": { "type": { "name": "bool" } }, "disableFuture": { "type": { "name": "bool" }, "default": "false" }, "disableHighlightToday": { "type": { "name": "bool" }, "default": "false" }, "disablePast": { "type": { "name": "bool" }, "default": "false" }, - "maxDate": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, "monthsPerRow": { "type": { "name": "enum", "description": "3
| 4" }, "default": "3" @@ -18,7 +18,7 @@ }, "readOnly": { "type": { "name": "bool" } }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid month using the validation props, except callbacks such as `shouldDisableMonth`." }, "shouldDisableMonth": { @@ -44,7 +44,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "any" } } + "value": { "type": { "name": "object" } } }, "name": "MonthCalendar", "imports": [ diff --git a/docs/pages/x/api/date-pickers/multi-input-date-range-field.json b/docs/pages/x/api/date-pickers/multi-input-date-range-field.json index 43fa71b3f73fd..ab581f1f6f69f 100644 --- a/docs/pages/x/api/date-pickers/multi-input-date-range-field.json +++ b/docs/pages/x/api/date-pickers/multi-input-date-range-field.json @@ -1,7 +1,7 @@ { "props": { "classes": { "type": { "name": "object" }, "additionalInfo": { "cssApi": true } }, - "defaultValue": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "defaultValue": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "direction": { "type": { "name": "union", @@ -18,8 +18,8 @@ "type": { "name": "enum", "description": "'dense'
| 'spacious'" }, "default": "\"dense\"" }, - "maxDate": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, "onChange": { "type": { "name": "func" }, "signature": { @@ -43,7 +43,7 @@ }, "readOnly": { "type": { "name": "bool" }, "default": "false" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date using the validation props, except callbacks such as `shouldDisableDate`. Value is rounded to the most granular section used." }, "selectedSections": { @@ -90,7 +90,7 @@ } }, "useFlexGap": { "type": { "name": "bool" }, "default": "false" }, - "value": { "type": { "name": "arrayOf", "description": "Array<any>" } } + "value": { "type": { "name": "arrayOf", "description": "Array<object>" } } }, "name": "MultiInputDateRangeField", "imports": [ diff --git a/docs/pages/x/api/date-pickers/multi-input-date-time-range-field.json b/docs/pages/x/api/date-pickers/multi-input-date-time-range-field.json index 481f133235df6..3ad6a4c4bc6bc 100644 --- a/docs/pages/x/api/date-pickers/multi-input-date-time-range-field.json +++ b/docs/pages/x/api/date-pickers/multi-input-date-time-range-field.json @@ -2,7 +2,7 @@ "props": { "ampm": { "type": { "name": "bool" }, "default": "`utils.is12HourCycleInCurrentLocale()`" }, "classes": { "type": { "name": "object" }, "additionalInfo": { "cssApi": true } }, - "defaultValue": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "defaultValue": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "direction": { "type": { "name": "union", @@ -20,12 +20,12 @@ "type": { "name": "enum", "description": "'dense'
| 'spacious'" }, "default": "\"dense\"" }, - "maxDate": { "type": { "name": "any" } }, - "maxDateTime": { "type": { "name": "any" } }, - "maxTime": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, - "minDateTime": { "type": { "name": "any" } }, - "minTime": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "maxDateTime": { "type": { "name": "object" } }, + "maxTime": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, + "minDateTime": { "type": { "name": "object" } }, + "minTime": { "type": { "name": "object" } }, "minutesStep": { "type": { "name": "number" }, "default": "1" }, "onChange": { "type": { "name": "func" }, @@ -50,7 +50,7 @@ }, "readOnly": { "type": { "name": "bool" }, "default": "false" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date using the validation props, except callbacks such as `shouldDisableDate`. Value is rounded to the most granular section used." }, "selectedSections": { @@ -105,7 +105,7 @@ } }, "useFlexGap": { "type": { "name": "bool" }, "default": "false" }, - "value": { "type": { "name": "arrayOf", "description": "Array<any>" } } + "value": { "type": { "name": "arrayOf", "description": "Array<object>" } } }, "name": "MultiInputDateTimeRangeField", "imports": [ diff --git a/docs/pages/x/api/date-pickers/multi-input-time-range-field.json b/docs/pages/x/api/date-pickers/multi-input-time-range-field.json index 9ea14b1bd7785..230921861f532 100644 --- a/docs/pages/x/api/date-pickers/multi-input-time-range-field.json +++ b/docs/pages/x/api/date-pickers/multi-input-time-range-field.json @@ -2,7 +2,7 @@ "props": { "ampm": { "type": { "name": "bool" }, "default": "`utils.is12HourCycleInCurrentLocale()`" }, "classes": { "type": { "name": "object" }, "additionalInfo": { "cssApi": true } }, - "defaultValue": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "defaultValue": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "direction": { "type": { "name": "union", @@ -20,8 +20,8 @@ "type": { "name": "enum", "description": "'dense'
| 'spacious'" }, "default": "\"dense\"" }, - "maxTime": { "type": { "name": "any" } }, - "minTime": { "type": { "name": "any" } }, + "maxTime": { "type": { "name": "object" } }, + "minTime": { "type": { "name": "object" } }, "minutesStep": { "type": { "name": "number" }, "default": "1" }, "onChange": { "type": { "name": "func" }, @@ -46,7 +46,7 @@ }, "readOnly": { "type": { "name": "bool" }, "default": "false" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date using the validation props, except callbacks such as `shouldDisableDate`. Value is rounded to the most granular section used." }, "selectedSections": { @@ -93,7 +93,7 @@ } }, "useFlexGap": { "type": { "name": "bool" }, "default": "false" }, - "value": { "type": { "name": "arrayOf", "description": "Array<any>" } } + "value": { "type": { "name": "arrayOf", "description": "Array<object>" } } }, "name": "MultiInputTimeRangeField", "imports": [ diff --git a/docs/pages/x/api/date-pickers/multi-section-digital-clock.json b/docs/pages/x/api/date-pickers/multi-section-digital-clock.json index f87b4cc0e5445..792a65ce1208b 100644 --- a/docs/pages/x/api/date-pickers/multi-section-digital-clock.json +++ b/docs/pages/x/api/date-pickers/multi-section-digital-clock.json @@ -3,7 +3,7 @@ "ampm": { "type": { "name": "bool" }, "default": "`utils.is12HourCycleInCurrentLocale()`" }, "autoFocus": { "type": { "name": "bool" } }, "classes": { "type": { "name": "object" }, "additionalInfo": { "cssApi": true } }, - "defaultValue": { "type": { "name": "any" } }, + "defaultValue": { "type": { "name": "object" } }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableFuture": { "type": { "name": "bool" }, "default": "false" }, "disableIgnoringDatePartForTimeValidation": { "type": { "name": "bool" }, "default": "false" }, @@ -14,8 +14,8 @@ "description": "'hours'
| 'meridiem'
| 'minutes'
| 'seconds'" } }, - "maxTime": { "type": { "name": "any" } }, - "minTime": { "type": { "name": "any" } }, + "maxTime": { "type": { "name": "object" } }, + "minTime": { "type": { "name": "object" } }, "minutesStep": { "type": { "name": "number" }, "default": "1" }, "onChange": { "type": { "name": "func" }, @@ -43,7 +43,7 @@ }, "readOnly": { "type": { "name": "bool" }, "default": "false" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid time using the validation props, except callbacks such as `shouldDisableTime`." }, "shouldDisableTime": { @@ -83,7 +83,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "any" } }, + "value": { "type": { "name": "object" } }, "view": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/pickers-day.json b/docs/pages/x/api/date-pickers/pickers-day.json index 42e74730e2908..1380c63391db3 100644 --- a/docs/pages/x/api/date-pickers/pickers-day.json +++ b/docs/pages/x/api/date-pickers/pickers-day.json @@ -1,6 +1,6 @@ { "props": { - "day": { "type": { "name": "any" }, "required": true }, + "day": { "type": { "name": "object" }, "required": true }, "isFirstVisibleCell": { "type": { "name": "bool" }, "required": true }, "isLastVisibleCell": { "type": { "name": "bool" }, "required": true }, "outsideCurrentMonth": { "type": { "name": "bool" }, "required": true }, diff --git a/docs/pages/x/api/date-pickers/single-input-date-range-field.json b/docs/pages/x/api/date-pickers/single-input-date-range-field.json index bf3556552fea7..0b8a151594e24 100644 --- a/docs/pages/x/api/date-pickers/single-input-date-range-field.json +++ b/docs/pages/x/api/date-pickers/single-input-date-range-field.json @@ -9,7 +9,7 @@ }, "default": "'primary'" }, - "defaultValue": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "defaultValue": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableFuture": { "type": { "name": "bool" }, "default": "false" }, "disablePast": { "type": { "name": "bool" }, "default": "false" }, @@ -36,8 +36,8 @@ }, "default": "'none'" }, - "maxDate": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, "name": { "type": { "name": "string" } }, "onChange": { "type": { "name": "func" }, @@ -63,7 +63,7 @@ }, "readOnly": { "type": { "name": "bool" }, "default": "false" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date using the validation props, except callbacks such as `shouldDisableDate`. Value is rounded to the most granular section used." }, "required": { "type": { "name": "bool" }, "default": "false" }, @@ -107,7 +107,7 @@ "unstableFieldRef": { "type": { "name": "union", "description": "func
| object" } }, - "value": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "value": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "variant": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/single-input-date-time-range-field.json b/docs/pages/x/api/date-pickers/single-input-date-time-range-field.json index 2e611014ece1d..5ea7d709048a7 100644 --- a/docs/pages/x/api/date-pickers/single-input-date-time-range-field.json +++ b/docs/pages/x/api/date-pickers/single-input-date-time-range-field.json @@ -10,7 +10,7 @@ }, "default": "'primary'" }, - "defaultValue": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "defaultValue": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableFuture": { "type": { "name": "bool" }, "default": "false" }, "disableIgnoringDatePartForTimeValidation": { "type": { "name": "bool" }, "default": "false" }, @@ -38,12 +38,12 @@ }, "default": "'none'" }, - "maxDate": { "type": { "name": "any" } }, - "maxDateTime": { "type": { "name": "any" } }, - "maxTime": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, - "minDateTime": { "type": { "name": "any" } }, - "minTime": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "maxDateTime": { "type": { "name": "object" } }, + "maxTime": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, + "minDateTime": { "type": { "name": "object" } }, + "minTime": { "type": { "name": "object" } }, "minutesStep": { "type": { "name": "number" }, "default": "1" }, "name": { "type": { "name": "string" } }, "onChange": { @@ -70,7 +70,7 @@ }, "readOnly": { "type": { "name": "bool" }, "default": "false" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date using the validation props, except callbacks such as `shouldDisableDate`. Value is rounded to the most granular section used." }, "required": { "type": { "name": "bool" }, "default": "false" }, @@ -122,7 +122,7 @@ "unstableFieldRef": { "type": { "name": "union", "description": "func
| object" } }, - "value": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "value": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "variant": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/single-input-time-range-field.json b/docs/pages/x/api/date-pickers/single-input-time-range-field.json index 4e6f7c5e11346..3c00fc18fb75d 100644 --- a/docs/pages/x/api/date-pickers/single-input-time-range-field.json +++ b/docs/pages/x/api/date-pickers/single-input-time-range-field.json @@ -10,7 +10,7 @@ }, "default": "'primary'" }, - "defaultValue": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "defaultValue": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableFuture": { "type": { "name": "bool" }, "default": "false" }, "disableIgnoringDatePartForTimeValidation": { "type": { "name": "bool" }, "default": "false" }, @@ -38,8 +38,8 @@ }, "default": "'none'" }, - "maxTime": { "type": { "name": "any" } }, - "minTime": { "type": { "name": "any" } }, + "maxTime": { "type": { "name": "object" } }, + "minTime": { "type": { "name": "object" } }, "minutesStep": { "type": { "name": "number" }, "default": "1" }, "name": { "type": { "name": "string" } }, "onChange": { @@ -66,7 +66,7 @@ }, "readOnly": { "type": { "name": "bool" }, "default": "false" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date using the validation props, except callbacks such as `shouldDisableDate`. Value is rounded to the most granular section used." }, "required": { "type": { "name": "bool" }, "default": "false" }, @@ -110,7 +110,7 @@ "unstableFieldRef": { "type": { "name": "union", "description": "func
| object" } }, - "value": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "value": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "variant": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/static-date-picker.json b/docs/pages/x/api/date-pickers/static-date-picker.json index a4e52d0e23ad3..f45df7ade6899 100644 --- a/docs/pages/x/api/date-pickers/static-date-picker.json +++ b/docs/pages/x/api/date-pickers/static-date-picker.json @@ -10,7 +10,7 @@ "returned": "string" } }, - "defaultValue": { "type": { "name": "any" } }, + "defaultValue": { "type": { "name": "object" } }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableFuture": { "type": { "name": "bool" }, "default": "false" }, "disableHighlightToday": { "type": { "name": "bool" }, "default": "false" }, @@ -23,8 +23,8 @@ "fixedWeekNumber": { "type": { "name": "number" }, "default": "undefined" }, "loading": { "type": { "name": "bool" }, "default": "false" }, "localeText": { "type": { "name": "object" } }, - "maxDate": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, "monthsPerRow": { "type": { "name": "enum", "description": "3
| 4" }, "default": "3" @@ -78,7 +78,7 @@ "default": "`@media(prefers-reduced-motion: reduce)` || `navigator.userAgent` matches Android <10 or iOS <13" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`." }, "renderLoading": { @@ -136,7 +136,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "any" } }, + "value": { "type": { "name": "object" } }, "view": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/static-date-range-picker.json b/docs/pages/x/api/date-pickers/static-date-range-picker.json index 13df18576c7c3..7147a6a57dd4b 100644 --- a/docs/pages/x/api/date-pickers/static-date-range-picker.json +++ b/docs/pages/x/api/date-pickers/static-date-range-picker.json @@ -22,7 +22,7 @@ "type": { "name": "enum", "description": "'end'
| 'start'" }, "default": "'start'" }, - "defaultValue": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "defaultValue": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "disableAutoMonthSwitching": { "type": { "name": "bool" }, "default": "false" }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableDragEditing": { "type": { "name": "bool" }, "default": "false" }, @@ -37,8 +37,8 @@ "fixedWeekNumber": { "type": { "name": "number" }, "default": "undefined" }, "loading": { "type": { "name": "bool" }, "default": "false" }, "localeText": { "type": { "name": "object" } }, - "maxDate": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, "onAccept": { "type": { "name": "func" }, "signature": { "type": "function(value: TValue) => void", "describedArgs": ["value"] } @@ -79,7 +79,7 @@ "default": "`@media(prefers-reduced-motion: reduce)` || `navigator.userAgent` matches Android <10 or iOS <13" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`." }, "renderLoading": { @@ -121,7 +121,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "arrayOf", "description": "Array<any>" } }, + "value": { "type": { "name": "arrayOf", "description": "Array<object>" } }, "viewRenderers": { "type": { "name": "shape", "description": "{ day?: func }" } } }, "name": "StaticDateRangePicker", diff --git a/docs/pages/x/api/date-pickers/static-date-time-picker.json b/docs/pages/x/api/date-pickers/static-date-time-picker.json index 75b6493b71992..198a432056387 100644 --- a/docs/pages/x/api/date-pickers/static-date-time-picker.json +++ b/docs/pages/x/api/date-pickers/static-date-time-picker.json @@ -12,7 +12,7 @@ "returned": "string" } }, - "defaultValue": { "type": { "name": "any" } }, + "defaultValue": { "type": { "name": "object" } }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableFuture": { "type": { "name": "bool" }, "default": "false" }, "disableHighlightToday": { "type": { "name": "bool" }, "default": "false" }, @@ -26,12 +26,12 @@ "fixedWeekNumber": { "type": { "name": "number" }, "default": "undefined" }, "loading": { "type": { "name": "bool" }, "default": "false" }, "localeText": { "type": { "name": "object" } }, - "maxDate": { "type": { "name": "any" } }, - "maxDateTime": { "type": { "name": "any" } }, - "maxTime": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, - "minDateTime": { "type": { "name": "any" } }, - "minTime": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "maxDateTime": { "type": { "name": "object" } }, + "maxTime": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, + "minDateTime": { "type": { "name": "object" } }, + "minTime": { "type": { "name": "object" } }, "minutesStep": { "type": { "name": "number" }, "default": "1" }, "monthsPerRow": { "type": { "name": "enum", "description": "3
| 4" }, @@ -86,7 +86,7 @@ "default": "`@media(prefers-reduced-motion: reduce)` || `navigator.userAgent` matches Android <10 or iOS <13" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`." }, "renderLoading": { @@ -152,7 +152,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "any" } }, + "value": { "type": { "name": "object" } }, "view": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/static-time-picker.json b/docs/pages/x/api/date-pickers/static-time-picker.json index d0995c15ec712..5cf72df9cbf49 100644 --- a/docs/pages/x/api/date-pickers/static-time-picker.json +++ b/docs/pages/x/api/date-pickers/static-time-picker.json @@ -3,7 +3,7 @@ "ampm": { "type": { "name": "bool" }, "default": "`utils.is12HourCycleInCurrentLocale()`" }, "ampmInClock": { "type": { "name": "bool" }, "default": "true on desktop, false on mobile" }, "autoFocus": { "type": { "name": "bool" } }, - "defaultValue": { "type": { "name": "any" } }, + "defaultValue": { "type": { "name": "object" } }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableFuture": { "type": { "name": "bool" }, "default": "false" }, "disableIgnoringDatePartForTimeValidation": { "type": { "name": "bool" }, "default": "false" }, @@ -13,8 +13,8 @@ "default": "\"mobile\"" }, "localeText": { "type": { "name": "object" } }, - "maxTime": { "type": { "name": "any" } }, - "minTime": { "type": { "name": "any" } }, + "maxTime": { "type": { "name": "object" } }, + "minTime": { "type": { "name": "object" } }, "minutesStep": { "type": { "name": "number" }, "default": "1" }, "onAccept": { "type": { "name": "func" }, @@ -57,7 +57,7 @@ "default": "`@media(prefers-reduced-motion: reduce)` || `navigator.userAgent` matches Android <10 or iOS <13" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`." }, "shouldDisableTime": { @@ -89,7 +89,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "any" } }, + "value": { "type": { "name": "object" } }, "view": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/time-clock.json b/docs/pages/x/api/date-pickers/time-clock.json index 86d8ec9214f7c..f569a5c964f98 100644 --- a/docs/pages/x/api/date-pickers/time-clock.json +++ b/docs/pages/x/api/date-pickers/time-clock.json @@ -4,7 +4,7 @@ "ampmInClock": { "type": { "name": "bool" }, "default": "false" }, "autoFocus": { "type": { "name": "bool" } }, "classes": { "type": { "name": "object" }, "additionalInfo": { "cssApi": true } }, - "defaultValue": { "type": { "name": "any" } }, + "defaultValue": { "type": { "name": "object" } }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableFuture": { "type": { "name": "bool" }, "default": "false" }, "disableIgnoringDatePartForTimeValidation": { "type": { "name": "bool" }, "default": "false" }, @@ -15,8 +15,8 @@ "description": "'hours'
| 'minutes'
| 'seconds'" } }, - "maxTime": { "type": { "name": "any" } }, - "minTime": { "type": { "name": "any" } }, + "maxTime": { "type": { "name": "object" } }, + "minTime": { "type": { "name": "object" } }, "minutesStep": { "type": { "name": "number" }, "default": "1" }, "onChange": { "type": { "name": "func" }, @@ -44,7 +44,7 @@ }, "readOnly": { "type": { "name": "bool" }, "default": "false" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid time using the validation props, except callbacks such as `shouldDisableTime`." }, "shouldDisableTime": { @@ -76,7 +76,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "any" } }, + "value": { "type": { "name": "object" } }, "view": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/time-field.json b/docs/pages/x/api/date-pickers/time-field.json index ad24b2bd2a52c..8f87d61b8c3ad 100644 --- a/docs/pages/x/api/date-pickers/time-field.json +++ b/docs/pages/x/api/date-pickers/time-field.json @@ -10,7 +10,7 @@ }, "default": "'primary'" }, - "defaultValue": { "type": { "name": "any" } }, + "defaultValue": { "type": { "name": "object" } }, "disabled": { "type": { "name": "bool" }, "default": "false" }, "disableFuture": { "type": { "name": "bool" }, "default": "false" }, "disableIgnoringDatePartForTimeValidation": { "type": { "name": "bool" }, "default": "false" }, @@ -38,8 +38,8 @@ }, "default": "'none'" }, - "maxTime": { "type": { "name": "any" } }, - "minTime": { "type": { "name": "any" } }, + "maxTime": { "type": { "name": "object" } }, + "minTime": { "type": { "name": "object" } }, "minutesStep": { "type": { "name": "number" }, "default": "1" }, "name": { "type": { "name": "string" } }, "onChange": { @@ -66,7 +66,7 @@ }, "readOnly": { "type": { "name": "bool" }, "default": "false" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date using the validation props, except callbacks such as `shouldDisableDate`. Value is rounded to the most granular section used." }, "required": { "type": { "name": "bool" }, "default": "false" }, @@ -110,7 +110,7 @@ "unstableFieldRef": { "type": { "name": "union", "description": "func
| object" } }, - "value": { "type": { "name": "any" } }, + "value": { "type": { "name": "object" } }, "variant": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/time-picker.json b/docs/pages/x/api/date-pickers/time-picker.json index 071c5ad8f4c25..d3386734875f2 100644 --- a/docs/pages/x/api/date-pickers/time-picker.json +++ b/docs/pages/x/api/date-pickers/time-picker.json @@ -7,7 +7,7 @@ "type": { "name": "bool" }, "default": "`true` for desktop, `false` for mobile (based on the chosen wrapper and `desktopModeMediaQuery` prop)." }, - "defaultValue": { "type": { "name": "any" } }, + "defaultValue": { "type": { "name": "object" } }, "desktopModeMediaQuery": { "type": { "name": "string" }, "default": "'@media (pointer: fine)'" @@ -25,8 +25,8 @@ "inputRef": { "type": { "name": "custom", "description": "ref" } }, "label": { "type": { "name": "node" } }, "localeText": { "type": { "name": "object" } }, - "maxTime": { "type": { "name": "any" } }, - "minTime": { "type": { "name": "any" } }, + "maxTime": { "type": { "name": "object" } }, + "minTime": { "type": { "name": "object" } }, "minutesStep": { "type": { "name": "number" }, "default": "1" }, "name": { "type": { "name": "string" } }, "onAccept": { @@ -75,7 +75,7 @@ "default": "`@media(prefers-reduced-motion: reduce)` || `navigator.userAgent` matches Android <10 or iOS <13" }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`." }, "selectedSections": { @@ -122,7 +122,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "any" } }, + "value": { "type": { "name": "object" } }, "view": { "type": { "name": "enum", diff --git a/docs/pages/x/api/date-pickers/year-calendar.json b/docs/pages/x/api/date-pickers/year-calendar.json index 3ae813c5290bc..8db2317d589f9 100644 --- a/docs/pages/x/api/date-pickers/year-calendar.json +++ b/docs/pages/x/api/date-pickers/year-calendar.json @@ -1,20 +1,20 @@ { "props": { "classes": { "type": { "name": "object" }, "additionalInfo": { "cssApi": true } }, - "defaultValue": { "type": { "name": "any" } }, + "defaultValue": { "type": { "name": "object" } }, "disabled": { "type": { "name": "bool" } }, "disableFuture": { "type": { "name": "bool" }, "default": "false" }, "disableHighlightToday": { "type": { "name": "bool" }, "default": "false" }, "disablePast": { "type": { "name": "bool" }, "default": "false" }, - "maxDate": { "type": { "name": "any" } }, - "minDate": { "type": { "name": "any" } }, + "maxDate": { "type": { "name": "object" } }, + "minDate": { "type": { "name": "object" } }, "onChange": { "type": { "name": "func" }, "signature": { "type": "function(value: TDate) => void", "describedArgs": ["value"] } }, "readOnly": { "type": { "name": "bool" } }, "referenceDate": { - "type": { "name": "any" }, + "type": { "name": "object" }, "default": "The closest valid year using the validation props, except callbacks such as `shouldDisableYear`." }, "shouldDisableYear": { @@ -40,7 +40,7 @@ "text": "timezones documentation" } }, - "value": { "type": { "name": "any" } }, + "value": { "type": { "name": "object" } }, "yearsPerRow": { "type": { "name": "enum", "description": "3
| 4" }, "default": "3" diff --git a/docs/scripts/generateProptypes.ts b/docs/scripts/generateProptypes.ts index 63620878303cb..4a4473dad12b6 100644 --- a/docs/scripts/generateProptypes.ts +++ b/docs/scripts/generateProptypes.ts @@ -7,6 +7,30 @@ import { fixBabelGeneratorIssues, fixLineEndings } from '@mui-internal/docs-util import { createXTypeScriptProjects, XTypeScriptProject } from './createXTypeScriptProjects'; async function generateProptypes(project: XTypeScriptProject, sourceFile: string) { + const isTDate = (name: string) => { + if (['x-date-pickers', 'x-date-pickers-pro'].includes(project.name)) { + const T_DATE_PROPS = [ + 'value', + 'defaultValue', + 'minDate', + 'maxDate', + 'minDateTime', + 'maxDateTime', + 'minTime', + 'maxTime', + 'referenceDate', + 'day', + 'currentMonth', + ]; + + if (T_DATE_PROPS.includes(name)) { + return true; + } + } + + return false; + }; + const components = getPropTypesFromFile({ filePath: sourceFile, project, @@ -44,8 +68,13 @@ async function generateProptypes(project: XTypeScriptProject, sourceFile: string return false; } + if (isTDate(name)) { + return false; + } + return undefined; }, + shouldUseObjectForDate: ({ name }) => isTDate(name), }); if (components.length === 0) { diff --git a/packages/x-date-pickers-pro/src/DateRangeCalendar/DateRangeCalendar.tsx b/packages/x-date-pickers-pro/src/DateRangeCalendar/DateRangeCalendar.tsx index f0a2b77125434..bd573303ca85b 100644 --- a/packages/x-date-pickers-pro/src/DateRangeCalendar/DateRangeCalendar.tsx +++ b/packages/x-date-pickers-pro/src/DateRangeCalendar/DateRangeCalendar.tsx @@ -32,6 +32,7 @@ import { useControlledValueWithTimezone, useViews, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { getReleaseInfo } from '../internals/utils/releaseInfo'; import { dateRangeCalendarClasses, @@ -114,7 +115,7 @@ const DayCalendarForRange = styled(DayCalendar)(({ theme }) => ({ }, })) as typeof DayCalendar; -function useDateRangeCalendarDefaultizedProps( +function useDateRangeCalendarDefaultizedProps( props: DateRangeCalendarProps, name: string, ): DateRangeCalendarDefaultizedProps { @@ -155,7 +156,7 @@ const useUtilityClasses = (ownerState: DateRangeCalendarOwnerState) => { return composeClasses(slots, getDateRangeCalendarUtilityClass, classes); }; -type DateRangeCalendarComponent = (( +type DateRangeCalendarComponent = (( props: DateRangeCalendarProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -169,10 +170,9 @@ type DateRangeCalendarComponent = (( * * - [DateRangeCalendar API](https://mui.com/x/api/date-pickers/date-range-calendar/) */ -const DateRangeCalendar = React.forwardRef(function DateRangeCalendar( - inProps: DateRangeCalendarProps, - ref: React.Ref, -) { +const DateRangeCalendar = React.forwardRef(function DateRangeCalendar< + TDate extends PickerValidDate, +>(inProps: DateRangeCalendarProps, ref: React.Ref) { const props = useDateRangeCalendarDefaultizedProps(inProps, 'MuiDateRangeCalendar'); const shouldHavePreview = useMediaQuery(DEFAULT_DESKTOP_MODE_MEDIA_QUERY, { defaultMatches: false, @@ -683,7 +683,7 @@ DateRangeCalendar.propTypes = { * The default selected value. * Used when the component is not controlled. */ - defaultValue: PropTypes.arrayOf(PropTypes.any), + defaultValue: PropTypes.arrayOf(PropTypes.object), /** * If `true`, after selecting `start` date calendar will not automatically switch to the month of `end` date. * @default false @@ -737,11 +737,11 @@ DateRangeCalendar.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Callback fired when the value changes. * @template TValue The value type. Will be either the same type as `value` or `null`. Can be in `[start, end]` format in case of range value. @@ -800,7 +800,7 @@ DateRangeCalendar.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid date using the validation props, except callbacks such as `shouldDisableDate`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * Component rendered on the "day" view when `props.loading` is true. * @returns {React.ReactNode} The node to render when loading. @@ -859,7 +859,7 @@ DateRangeCalendar.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.arrayOf(PropTypes.any), + value: PropTypes.arrayOf(PropTypes.object), /** * The visible view. * Used when the component view is controlled. diff --git a/packages/x-date-pickers-pro/src/DateRangeCalendar/DateRangeCalendar.types.ts b/packages/x-date-pickers-pro/src/DateRangeCalendar/DateRangeCalendar.types.ts index 3752678575acb..b79cbe3a8a570 100644 --- a/packages/x-date-pickers-pro/src/DateRangeCalendar/DateRangeCalendar.types.ts +++ b/packages/x-date-pickers-pro/src/DateRangeCalendar/DateRangeCalendar.types.ts @@ -2,7 +2,7 @@ import * as React from 'react'; import { SxProps } from '@mui/system'; import { SlotComponentProps } from '@mui/base/utils'; import { Theme } from '@mui/material/styles'; -import { TimezoneProps } from '@mui/x-date-pickers/models'; +import { PickerValidDate, TimezoneProps } from '@mui/x-date-pickers/models'; import { PickersCalendarHeader, PickersCalendarHeaderProps, @@ -28,7 +28,7 @@ import { UseRangePositionProps } from '../internals/hooks/useRangePosition'; export type DateRangePosition = 'start' | 'end'; -export interface DateRangeCalendarSlots +export interface DateRangeCalendarSlots extends PickersArrowSwitcherSlots, Omit, 'day'>, PickersCalendarHeaderSlots { @@ -46,7 +46,7 @@ export interface DateRangeCalendarSlots day?: React.ElementType>; } -export interface DateRangeCalendarSlotProps +export interface DateRangeCalendarSlotProps extends PickersArrowSwitcherSlotProps, Omit, 'day'>, PickersCalendarHeaderSlotProps { @@ -62,7 +62,7 @@ export interface DateRangeCalendarSlotProps >; } -export interface ExportedDateRangeCalendarProps +export interface ExportedDateRangeCalendarProps extends ExportedDayCalendarProps, BaseDateValidationProps, DayRangeValidationProps, @@ -105,7 +105,7 @@ export interface ExportedDateRangeCalendarProps disableDragEditing?: boolean; } -export interface DateRangeCalendarProps +export interface DateRangeCalendarProps extends ExportedDateRangeCalendarProps, UseRangePositionProps, ExportedUseViewsOptions<'day'> { @@ -155,11 +155,12 @@ export interface DateRangeCalendarProps availableRangePositions?: DateRangePosition[]; } -export interface DateRangeCalendarOwnerState extends DateRangeCalendarProps { +export interface DateRangeCalendarOwnerState + extends DateRangeCalendarProps { isDragging: boolean; } -export type DateRangeCalendarDefaultizedProps = DefaultizedProps< +export type DateRangeCalendarDefaultizedProps = DefaultizedProps< DateRangeCalendarProps, | 'views' | 'openTo' diff --git a/packages/x-date-pickers-pro/src/DateRangeCalendar/useDragRange.ts b/packages/x-date-pickers-pro/src/DateRangeCalendar/useDragRange.ts index 32a85ed3aeef8..5ac9cdc668000 100644 --- a/packages/x-date-pickers-pro/src/DateRangeCalendar/useDragRange.ts +++ b/packages/x-date-pickers-pro/src/DateRangeCalendar/useDragRange.ts @@ -1,11 +1,11 @@ import * as React from 'react'; import useEventCallback from '@mui/utils/useEventCallback'; -import { MuiPickersAdapter, PickersTimezone } from '@mui/x-date-pickers/models'; +import { MuiPickersAdapter, PickersTimezone, PickerValidDate } from '@mui/x-date-pickers/models'; import { DateRangePosition } from './DateRangeCalendar.types'; import { DateRange } from '../models'; import { isEndOfRange, isStartOfRange } from '../internals/utils/date-utils'; -interface UseDragRangeParams { +interface UseDragRangeParams { disableDragEditing?: boolean; utils: MuiPickersAdapter; setRangeDragDay: (value: TDate | null) => void; @@ -29,13 +29,13 @@ interface UseDragRangeEvents { onTouchEnd?: React.TouchEventHandler; } -interface UseDragRangeResponse extends UseDragRangeEvents { +interface UseDragRangeResponse extends UseDragRangeEvents { isDragging: boolean; rangeDragDay: TDate | null; draggingDatePosition: DateRangePosition | null; } -const resolveDateFromTarget = ( +const resolveDateFromTarget = ( target: EventTarget, utils: MuiPickersAdapter, timezone: PickersTimezone, @@ -87,7 +87,7 @@ const resolveElementFromTouch = ( return null; }; -const useDragRangeEvents = ({ +const useDragRangeEvents = ({ utils, setRangeDragDay, setIsDragging, @@ -276,7 +276,7 @@ const useDragRangeEvents = ({ }; }; -export const useDragRange = ({ +export const useDragRange = ({ disableDragEditing, utils, onDatePositionChange, diff --git a/packages/x-date-pickers-pro/src/DateRangePicker/DateRangePicker.tsx b/packages/x-date-pickers-pro/src/DateRangePicker/DateRangePicker.tsx index d05c30cdbde64..221f24079569b 100644 --- a/packages/x-date-pickers-pro/src/DateRangePicker/DateRangePicker.tsx +++ b/packages/x-date-pickers-pro/src/DateRangePicker/DateRangePicker.tsx @@ -3,11 +3,12 @@ import PropTypes from 'prop-types'; import useMediaQuery from '@mui/material/useMediaQuery'; import { useThemeProps } from '@mui/material/styles'; import { refType } from '@mui/utils'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { DesktopDateRangePicker } from '../DesktopDateRangePicker'; import { MobileDateRangePicker } from '../MobileDateRangePicker'; import { DateRangePickerProps } from './DateRangePicker.types'; -type DatePickerComponent = (( +type DatePickerComponent = (( props: DateRangePickerProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -21,7 +22,7 @@ type DatePickerComponent = (( * * - [DateRangePicker API](https://mui.com/x/api/date-pickers/date-range-picker/) */ -const DateRangePicker = React.forwardRef(function DateRangePicker( +const DateRangePicker = React.forwardRef(function DateRangePicker( inProps: DateRangePickerProps, ref: React.Ref, ) { @@ -84,7 +85,7 @@ DateRangePicker.propTypes = { * The default value. * Used when the component is not controlled. */ - defaultValue: PropTypes.arrayOf(PropTypes.any), + defaultValue: PropTypes.arrayOf(PropTypes.object), /** * CSS media query when `Mobile` mode will be changed to `Desktop`. * @default '@media (pointer: fine)' @@ -171,11 +172,11 @@ DateRangePicker.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Name attribute used by the `input` element in the Field. * Ignored if the field has several inputs. @@ -251,7 +252,7 @@ DateRangePicker.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * Component rendered on the "day" view when `props.loading` is true. * @returns {React.ReactNode} The node to render when loading. @@ -338,7 +339,7 @@ DateRangePicker.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.arrayOf(PropTypes.any), + value: PropTypes.arrayOf(PropTypes.object), /** * Define custom view renderers for each section. * If `null`, the section will only have field editing. diff --git a/packages/x-date-pickers-pro/src/DateRangePicker/DateRangePicker.types.ts b/packages/x-date-pickers-pro/src/DateRangePicker/DateRangePicker.types.ts index 7b1bfae34e522..619d929549386 100644 --- a/packages/x-date-pickers-pro/src/DateRangePicker/DateRangePicker.types.ts +++ b/packages/x-date-pickers-pro/src/DateRangePicker/DateRangePicker.types.ts @@ -1,3 +1,4 @@ +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { DesktopDateRangePickerProps, DesktopDateRangePickerSlots, @@ -9,15 +10,15 @@ import { MobileDateRangePickerSlotProps, } from '../MobileDateRangePicker'; -export interface DateRangePickerSlots +export interface DateRangePickerSlots extends DesktopDateRangePickerSlots, MobileDateRangePickerSlots {} -export interface DateRangePickerSlotProps +export interface DateRangePickerSlotProps extends DesktopDateRangePickerSlotProps, MobileDateRangePickerSlotProps {} -export interface DateRangePickerProps +export interface DateRangePickerProps extends DesktopDateRangePickerProps, MobileDateRangePickerProps { /** diff --git a/packages/x-date-pickers-pro/src/DateRangePicker/DateRangePickerToolbar.tsx b/packages/x-date-pickers-pro/src/DateRangePicker/DateRangePickerToolbar.tsx index 7e83059f084b1..149bc4c9bf069 100644 --- a/packages/x-date-pickers-pro/src/DateRangePicker/DateRangePickerToolbar.tsx +++ b/packages/x-date-pickers-pro/src/DateRangePicker/DateRangePickerToolbar.tsx @@ -12,6 +12,7 @@ import { useLocaleText, ExportedBaseToolbarProps, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { DateRange } from '../models'; import { UseRangePositionResponse } from '../internals/hooks/useRangePosition'; import { @@ -29,7 +30,7 @@ const useUtilityClasses = (ownerState: DateRangePickerToolbarProps) => { return composeClasses(slots, getDateRangePickerToolbarUtilityClass, classes); }; -export interface DateRangePickerToolbarProps +export interface DateRangePickerToolbarProps extends Omit< BaseToolbarProps, 'day'>, 'views' | 'view' | 'onViewChange' | 'onChange' | 'isLandscape' @@ -67,7 +68,7 @@ const DateRangePickerToolbarContainer = styled('div', { * - [DateRangePickerToolbar API](https://mui.com/x/api/date-pickers/date-range-picker-toolbar/) */ const DateRangePickerToolbar = React.forwardRef(function DateRangePickerToolbar< - TDate extends unknown, + TDate extends PickerValidDate, >(inProps: DateRangePickerToolbarProps, ref: React.Ref) { const utils = useUtils(); const props = useThemeProps({ props: inProps, name: 'MuiDateRangePickerToolbar' }); @@ -153,7 +154,7 @@ DateRangePickerToolbar.propTypes = { * @default "––" */ toolbarPlaceholder: PropTypes.node, - value: PropTypes.arrayOf(PropTypes.any).isRequired, + value: PropTypes.arrayOf(PropTypes.object).isRequired, } as any; export { DateRangePickerToolbar }; diff --git a/packages/x-date-pickers-pro/src/DateRangePicker/shared.tsx b/packages/x-date-pickers-pro/src/DateRangePicker/shared.tsx index 652ad32094229..5a0b72b9bdd09 100644 --- a/packages/x-date-pickers-pro/src/DateRangePicker/shared.tsx +++ b/packages/x-date-pickers-pro/src/DateRangePicker/shared.tsx @@ -10,6 +10,7 @@ import { BasePickerInputProps, PickerViewRendererLookup, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { DateRangeValidationError, DateRange } from '../models'; import { DateRangeCalendarSlots, @@ -23,7 +24,8 @@ import { } from './DateRangePickerToolbar'; import { DateRangeViewRendererProps } from '../dateRangeViewRenderers'; -export interface BaseDateRangePickerSlots extends DateRangeCalendarSlots { +export interface BaseDateRangePickerSlots + extends DateRangeCalendarSlots { /** * Custom component for the toolbar rendered above the views. * @default DateTimePickerToolbar @@ -31,11 +33,12 @@ export interface BaseDateRangePickerSlots extends DateRangeCalendarSlots< toolbar?: React.JSXElementConstructor>; } -export interface BaseDateRangePickerSlotProps extends DateRangeCalendarSlotProps { +export interface BaseDateRangePickerSlotProps + extends DateRangeCalendarSlotProps { toolbar?: ExportedDateRangePickerToolbarProps; } -export interface BaseDateRangePickerProps +export interface BaseDateRangePickerProps extends Omit< BasePickerInputProps, TDate, 'day', DateRangeValidationError>, 'view' | 'views' | 'openTo' | 'onViewChange' | 'orientation' @@ -63,12 +66,12 @@ export interface BaseDateRangePickerProps } type UseDateRangePickerDefaultizedProps< - TDate, + TDate extends PickerValidDate, Props extends BaseDateRangePickerProps, > = LocalizedComponent>>; export function useDateRangePickerDefaultizedProps< - TDate, + TDate extends PickerValidDate, Props extends BaseDateRangePickerProps, >(props: Props, name: string): UseDateRangePickerDefaultizedProps { const utils = useUtils(); diff --git a/packages/x-date-pickers-pro/src/DateRangePickerDay/DateRangePickerDay.tsx b/packages/x-date-pickers-pro/src/DateRangePickerDay/DateRangePickerDay.tsx index 9647c304b1628..a7609833e7466 100644 --- a/packages/x-date-pickers-pro/src/DateRangePickerDay/DateRangePickerDay.tsx +++ b/packages/x-date-pickers-pro/src/DateRangePickerDay/DateRangePickerDay.tsx @@ -5,6 +5,7 @@ import { useLicenseVerifier } from '@mui/x-license-pro'; import { alpha, styled, useThemeProps } from '@mui/material/styles'; import { unstable_composeClasses as composeClasses } from '@mui/utils'; import { useUtils } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { PickersDay, PickersDayProps } from '@mui/x-date-pickers/PickersDay'; import { DateRangePickerDayClasses, @@ -15,7 +16,7 @@ import { getReleaseInfo } from '../internals/utils/releaseInfo'; const releaseInfo = getReleaseInfo(); -export interface DateRangePickerDayProps +export interface DateRangePickerDayProps extends Omit, 'classes' | 'onBlur' | 'onFocus' | 'onKeyDown'> { /** * Set to `true` if the `day` is in a highlighted date range. @@ -259,18 +260,17 @@ const DateRangePickerDayDay = styled(PickersDay, { ...(ownerState.draggable && { touchAction: 'none', }), -})) as unknown as ( +})) as unknown as ( props: PickersDayProps & { ownerState: OwnerState }, ) => React.JSX.Element; -type DateRangePickerDayComponent = ( +type DateRangePickerDayComponent = ( props: DateRangePickerDayProps & React.RefAttributes, ) => React.JSX.Element; -const DateRangePickerDayRaw = React.forwardRef(function DateRangePickerDay( - inProps: DateRangePickerDayProps, - ref: React.Ref, -) { +const DateRangePickerDayRaw = React.forwardRef(function DateRangePickerDay< + TDate extends PickerValidDate, +>(inProps: DateRangePickerDayProps, ref: React.Ref) { const props = useThemeProps({ props: inProps, name: 'MuiDateRangePickerDay' }); const { className, @@ -376,7 +376,7 @@ DateRangePickerDayRaw.propTypes = { /** * The date to show. */ - day: PropTypes.any.isRequired, + day: PropTypes.object.isRequired, /** * If `true`, renders as disabled. * @default false diff --git a/packages/x-date-pickers-pro/src/DateTimeRangePicker/DateTimeRangePicker.tsx b/packages/x-date-pickers-pro/src/DateTimeRangePicker/DateTimeRangePicker.tsx index 63d70c656b7c9..7b55b94cca536 100644 --- a/packages/x-date-pickers-pro/src/DateTimeRangePicker/DateTimeRangePicker.tsx +++ b/packages/x-date-pickers-pro/src/DateTimeRangePicker/DateTimeRangePicker.tsx @@ -2,18 +2,18 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import useMediaQuery from '@mui/material/useMediaQuery'; import { useThemeProps } from '@mui/material/styles'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { DateTimeRangePickerProps } from './DateTimeRangePicker.types'; import { DesktopDateTimeRangePicker } from '../DesktopDateTimeRangePicker'; import { MobileDateTimeRangePicker } from '../MobileDateTimeRangePicker'; -type DateTimeRangePickerComponent = (( +type DateTimeRangePickerComponent = (( props: DateTimeRangePickerProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; -const DateTimeRangePicker = React.forwardRef(function DateTimeRangePicker( - inProps: DateTimeRangePickerProps, - ref: React.Ref, -) { +const DateTimeRangePicker = React.forwardRef(function DateTimeRangePicker< + TDate extends PickerValidDate, +>(inProps: DateTimeRangePickerProps, ref: React.Ref) { const props = useThemeProps({ props: inProps, name: 'MuiDateTimeRangePicker' }); const { desktopModeMediaQuery = '@media (pointer: fine)', ...other } = props; @@ -78,7 +78,7 @@ DateTimeRangePicker.propTypes = { * The default value. * Used when the component is not controlled. */ - defaultValue: PropTypes.arrayOf(PropTypes.any), + defaultValue: PropTypes.arrayOf(PropTypes.object), /** * CSS media query when `Mobile` mode will be changed to `Desktop`. * @default '@media (pointer: fine)' @@ -175,29 +175,29 @@ DateTimeRangePicker.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Maximal selectable moment of time with binding to date, to set max time in each day use `maxTime`. */ - maxDateTime: PropTypes.any, + maxDateTime: PropTypes.object, /** * Maximal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - maxTime: PropTypes.any, + maxTime: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Minimal selectable moment of time with binding to date, to set min time in each day use `minTime`. */ - minDateTime: PropTypes.any, + minDateTime: PropTypes.object, /** * Minimal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - minTime: PropTypes.any, + minTime: PropTypes.object, /** * Step over minutes. * @default 1 @@ -290,7 +290,7 @@ DateTimeRangePicker.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * Component rendered on the "day" view when `props.loading` is true. * @returns {React.ReactNode} The node to render when loading. @@ -406,7 +406,7 @@ DateTimeRangePicker.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.arrayOf(PropTypes.any), + value: PropTypes.arrayOf(PropTypes.object), /** * The visible view. * Used when the component view is controlled. diff --git a/packages/x-date-pickers-pro/src/DateTimeRangePicker/DateTimeRangePicker.types.ts b/packages/x-date-pickers-pro/src/DateTimeRangePicker/DateTimeRangePicker.types.ts index 1e755b824bda2..ef4308ee99016 100644 --- a/packages/x-date-pickers-pro/src/DateTimeRangePicker/DateTimeRangePicker.types.ts +++ b/packages/x-date-pickers-pro/src/DateTimeRangePicker/DateTimeRangePicker.types.ts @@ -1,3 +1,4 @@ +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { DesktopDateTimeRangePickerProps, DesktopDateTimeRangePickerSlots, @@ -9,15 +10,15 @@ import { MobileDateTimeRangePickerSlotProps, } from '../MobileDateTimeRangePicker'; -export interface DateTimeRangePickerSlots +export interface DateTimeRangePickerSlots extends DesktopDateTimeRangePickerSlots, MobileDateTimeRangePickerSlots {} -export interface DateTimeRangePickerSlotProps +export interface DateTimeRangePickerSlotProps extends DesktopDateTimeRangePickerSlotProps, MobileDateTimeRangePickerSlotProps {} -export interface DateTimeRangePickerProps +export interface DateTimeRangePickerProps extends DesktopDateTimeRangePickerProps, MobileDateTimeRangePickerProps { /** diff --git a/packages/x-date-pickers-pro/src/DateTimeRangePicker/DateTimeRangePickerTimeWrapper.tsx b/packages/x-date-pickers-pro/src/DateTimeRangePicker/DateTimeRangePickerTimeWrapper.tsx index 465bcc3f6e1de..9bc3597b7927e 100644 --- a/packages/x-date-pickers-pro/src/DateTimeRangePicker/DateTimeRangePickerTimeWrapper.tsx +++ b/packages/x-date-pickers-pro/src/DateTimeRangePicker/DateTimeRangePickerTimeWrapper.tsx @@ -7,6 +7,7 @@ import { TimeViewWithMeridiem, BaseClockProps, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { DateTimeRangePickerView } from '../internals/models'; import { DateRange } from '../models'; import { UseRangePositionResponse } from '../internals/hooks/useRangePosition'; @@ -14,7 +15,7 @@ import { isRangeValid } from '../internals/utils/date-utils'; import { calculateRangeChange } from '../internals/utils/date-range-manager'; export type DateTimeRangePickerTimeWrapperProps< - TDate, + TDate extends PickerValidDate, TView extends DateTimeRangePickerView, TComponentProps extends Omit< BaseClockProps, @@ -43,7 +44,7 @@ export type DateTimeRangePickerTimeWrapperProps< * @ignore - internal component. */ function DateTimeRangePickerTimeWrapper< - TDate, + TDate extends PickerValidDate, TView extends DateTimeRangePickerView, TComponentProps extends Omit< BaseClockProps, diff --git a/packages/x-date-pickers-pro/src/DateTimeRangePicker/DateTimeRangePickerToolbar.tsx b/packages/x-date-pickers-pro/src/DateTimeRangePicker/DateTimeRangePickerToolbar.tsx index 5b384ac900ab6..1af69fa551241 100644 --- a/packages/x-date-pickers-pro/src/DateTimeRangePicker/DateTimeRangePickerToolbar.tsx +++ b/packages/x-date-pickers-pro/src/DateTimeRangePicker/DateTimeRangePickerToolbar.tsx @@ -11,6 +11,7 @@ import { DateOrTimeViewWithMeridiem, WrapperVariant, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { DateTimePickerToolbarProps, DateTimePickerToolbar, @@ -36,7 +37,7 @@ const useUtilityClasses = (ownerState: DateTimeRangePickerToolbarProps) => type DateTimeRangeViews = Exclude; -export interface DateTimeRangePickerToolbarProps +export interface DateTimeRangePickerToolbarProps extends BaseToolbarProps, DateTimeRangeViews>, Pick, ExportedDateTimeRangePickerToolbarProps { @@ -59,11 +60,12 @@ const DateTimeRangePickerToolbarRoot = styled('div', { flexDirection: 'column', }); -type DateTimeRangePickerStartOrEndToolbarProps = DateTimePickerToolbarProps & { - ownerState?: DateTimeRangePickerToolbarProps; -}; +type DateTimeRangePickerStartOrEndToolbarProps = + DateTimePickerToolbarProps & { + ownerState?: DateTimeRangePickerToolbarProps; + }; -type DateTimeRangePickerStartOrEndToolbarComponent = ( +type DateTimeRangePickerStartOrEndToolbarComponent = ( props: DateTimeRangePickerStartOrEndToolbarProps, ) => React.JSX.Element; @@ -91,7 +93,7 @@ const DateTimeRangePickerToolbarEnd = styled(DateTimePickerToolbar, { })) as DateTimeRangePickerStartOrEndToolbarComponent; const DateTimeRangePickerToolbar = React.forwardRef(function DateTimeRangePickerToolbar< - TDate extends unknown, + TDate extends PickerValidDate, >(inProps: DateTimeRangePickerToolbarProps, ref: React.Ref) { const props = useThemeProps({ props: inProps, name: 'MuiDateTimeRangePickerToolbar' }); const utils = useUtils(); @@ -228,7 +230,7 @@ DateTimeRangePickerToolbar.propTypes = { */ toolbarPlaceholder: PropTypes.node, toolbarVariant: PropTypes.oneOf(['desktop', 'mobile']), - value: PropTypes.arrayOf(PropTypes.any).isRequired, + value: PropTypes.arrayOf(PropTypes.object).isRequired, /** * Currently visible picker view. */ diff --git a/packages/x-date-pickers-pro/src/DateTimeRangePicker/shared.tsx b/packages/x-date-pickers-pro/src/DateTimeRangePicker/shared.tsx index d893dbe01b40d..cba6a59a1aa25 100644 --- a/packages/x-date-pickers-pro/src/DateTimeRangePicker/shared.tsx +++ b/packages/x-date-pickers-pro/src/DateTimeRangePicker/shared.tsx @@ -17,6 +17,7 @@ import { UseViewsOptions, DateTimeValidationProps, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { TimeViewRendererProps } from '@mui/x-date-pickers/timeViewRenderers'; import { DigitalClockSlots, DigitalClockSlotProps } from '@mui/x-date-pickers/DigitalClock'; import { @@ -42,7 +43,7 @@ import { ExportedDateTimeRangePickerTabsProps, } from './DateTimeRangePickerTabs'; -export interface BaseDateTimeRangePickerSlots +export interface BaseDateTimeRangePickerSlots extends DateRangeCalendarSlots, DigitalClockSlots, MultiSectionDigitalClockSlots { @@ -58,7 +59,7 @@ export interface BaseDateTimeRangePickerSlots toolbar?: React.JSXElementConstructor>; } -export interface BaseDateTimeRangePickerSlotProps +export interface BaseDateTimeRangePickerSlotProps extends DateRangeCalendarSlotProps, DigitalClockSlotProps, MultiSectionDigitalClockSlotProps { @@ -72,7 +73,7 @@ export interface BaseDateTimeRangePickerSlotProps toolbar?: ExportedDateTimeRangePickerToolbarProps; } -export interface BaseDateTimeRangePickerProps +export interface BaseDateTimeRangePickerProps extends Omit< BasePickerInputProps< DateRange, @@ -119,7 +120,7 @@ export interface BaseDateTimeRangePickerProps } type UseDateTimeRangePickerDefaultizedProps< - TDate, + TDate extends PickerValidDate, Props extends BaseDateTimeRangePickerProps, > = LocalizedComponent< TDate, @@ -130,7 +131,7 @@ type UseDateTimeRangePickerDefaultizedProps< }; export function useDateTimeRangePickerDefaultizedProps< - TDate, + TDate extends PickerValidDate, Props extends BaseDateTimeRangePickerProps, >(props: Props, name: string): UseDateTimeRangePickerDefaultizedProps { const utils = useUtils(); diff --git a/packages/x-date-pickers-pro/src/DesktopDateRangePicker/DesktopDateRangePicker.tsx b/packages/x-date-pickers-pro/src/DesktopDateRangePicker/DesktopDateRangePicker.tsx index 09532eee819d3..fd25ff438f808 100644 --- a/packages/x-date-pickers-pro/src/DesktopDateRangePicker/DesktopDateRangePicker.tsx +++ b/packages/x-date-pickers-pro/src/DesktopDateRangePicker/DesktopDateRangePicker.tsx @@ -1,6 +1,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import { extractValidationProps, PickerViewRendererLookup } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { resolveComponentProps } from '@mui/base/utils'; import { refType } from '@mui/utils'; import { rangeValueManager } from '../internals/utils/valueManagers'; @@ -12,7 +13,7 @@ import { useDesktopRangePicker } from '../internals/hooks/useDesktopRangePicker' import { validateDateRange } from '../internals/utils/validation/validateDateRange'; import { DateRange } from '../models'; -type DesktopDateRangePickerComponent = (( +type DesktopDateRangePickerComponent = (( props: DesktopDateRangePickerProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -26,10 +27,9 @@ type DesktopDateRangePickerComponent = (( * * - [DesktopDateRangePicker API](https://mui.com/x/api/date-pickers/desktop-date-range-picker/) */ -const DesktopDateRangePicker = React.forwardRef(function DesktopDateRangePicker( - inProps: DesktopDateRangePickerProps, - ref: React.Ref, -) { +const DesktopDateRangePicker = React.forwardRef(function DesktopDateRangePicker< + TDate extends PickerValidDate, +>(inProps: DesktopDateRangePickerProps, ref: React.Ref) { // Props with the default values common to all date time pickers const defaultizedProps = useDateRangePickerDefaultizedProps< TDate, @@ -120,7 +120,7 @@ DesktopDateRangePicker.propTypes = { * The default value. * Used when the component is not controlled. */ - defaultValue: PropTypes.arrayOf(PropTypes.any), + defaultValue: PropTypes.arrayOf(PropTypes.object), /** * If `true`, after selecting `start` date calendar will not automatically switch to the month of `end` date. * @default false @@ -201,11 +201,11 @@ DesktopDateRangePicker.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Name attribute used by the `input` element in the Field. * Ignored if the field has several inputs. @@ -281,7 +281,7 @@ DesktopDateRangePicker.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * Component rendered on the "day" view when `props.loading` is true. * @returns {React.ReactNode} The node to render when loading. @@ -368,7 +368,7 @@ DesktopDateRangePicker.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.arrayOf(PropTypes.any), + value: PropTypes.arrayOf(PropTypes.object), /** * Define custom view renderers for each section. * If `null`, the section will only have field editing. diff --git a/packages/x-date-pickers-pro/src/DesktopDateRangePicker/DesktopDateRangePicker.types.ts b/packages/x-date-pickers-pro/src/DesktopDateRangePicker/DesktopDateRangePicker.types.ts index 4f83197bad5ca..364776776e06d 100644 --- a/packages/x-date-pickers-pro/src/DesktopDateRangePicker/DesktopDateRangePicker.types.ts +++ b/packages/x-date-pickers-pro/src/DesktopDateRangePicker/DesktopDateRangePicker.types.ts @@ -1,4 +1,5 @@ import { MakeOptional } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { UseDesktopRangePickerSlots, UseDesktopRangePickerSlotProps, @@ -10,15 +11,15 @@ import { BaseDateRangePickerSlotProps, } from '../DateRangePicker/shared'; -export interface DesktopDateRangePickerSlots +export interface DesktopDateRangePickerSlots extends BaseDateRangePickerSlots, MakeOptional, 'field'> {} -export interface DesktopDateRangePickerSlotProps +export interface DesktopDateRangePickerSlotProps extends BaseDateRangePickerSlotProps, Omit, 'tabs'> {} -export interface DesktopDateRangePickerProps +export interface DesktopDateRangePickerProps extends BaseDateRangePickerProps, DesktopRangeOnlyPickerProps { /** diff --git a/packages/x-date-pickers-pro/src/DesktopDateTimeRangePicker/DesktopDateTimeRangePicker.tsx b/packages/x-date-pickers-pro/src/DesktopDateTimeRangePicker/DesktopDateTimeRangePicker.tsx index b0c6b36d18cd2..74f358cae9dce 100644 --- a/packages/x-date-pickers-pro/src/DesktopDateTimeRangePicker/DesktopDateTimeRangePicker.tsx +++ b/packages/x-date-pickers-pro/src/DesktopDateTimeRangePicker/DesktopDateTimeRangePicker.tsx @@ -8,6 +8,7 @@ import { PickerViewRenderer, PickerViewRendererLookup, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { resolveComponentProps } from '@mui/base/utils'; import { renderDigitalClockTimeView, @@ -36,7 +37,7 @@ import { DateTimeRangePickerTimeWrapper } from '../DateTimeRangePicker/DateTimeR import { RANGE_VIEW_HEIGHT } from '../internals/constants/dimensions'; import { DesktopDateTimeRangePickerLayout } from './DesktopDateTimeRangePickerLayout'; -const rendererInterceptor = function rendererInterceptor( +const rendererInterceptor = function rendererInterceptor( inViewRenderers: PickerViewRendererLookup, DateTimeRangePickerView, any, any>, popperView: DateTimeRangePickerView, rendererProps: DefaultizedProps< @@ -88,14 +89,13 @@ const rendererInterceptor = function rendererInterceptor( ); }; -type DesktopDateRangePickerComponent = (( +type DesktopDateRangePickerComponent = (( props: DesktopDateTimeRangePickerProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; -const DesktopDateTimeRangePicker = React.forwardRef(function DesktopDateTimeRangePicker( - inProps: DesktopDateTimeRangePickerProps, - ref: React.Ref, -) { +const DesktopDateTimeRangePicker = React.forwardRef(function DesktopDateTimeRangePicker< + TDate extends PickerValidDate, +>(inProps: DesktopDateTimeRangePickerProps, ref: React.Ref) { // Props with the default values common to all date time range pickers const defaultizedProps = useDateTimeRangePickerDefaultizedProps< TDate, @@ -225,7 +225,7 @@ DesktopDateTimeRangePicker.propTypes = { * The default value. * Used when the component is not controlled. */ - defaultValue: PropTypes.arrayOf(PropTypes.any), + defaultValue: PropTypes.arrayOf(PropTypes.object), /** * If `true`, after selecting `start` date calendar will not automatically switch to the month of `end` date. * @default false @@ -316,29 +316,29 @@ DesktopDateTimeRangePicker.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Maximal selectable moment of time with binding to date, to set max time in each day use `maxTime`. */ - maxDateTime: PropTypes.any, + maxDateTime: PropTypes.object, /** * Maximal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - maxTime: PropTypes.any, + maxTime: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Minimal selectable moment of time with binding to date, to set min time in each day use `minTime`. */ - minDateTime: PropTypes.any, + minDateTime: PropTypes.object, /** * Minimal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - minTime: PropTypes.any, + minTime: PropTypes.object, /** * Step over minutes. * @default 1 @@ -431,7 +431,7 @@ DesktopDateTimeRangePicker.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * Component rendered on the "day" view when `props.loading` is true. * @returns {React.ReactNode} The node to render when loading. @@ -547,7 +547,7 @@ DesktopDateTimeRangePicker.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.arrayOf(PropTypes.any), + value: PropTypes.arrayOf(PropTypes.object), /** * The visible view. * Used when the component view is controlled. diff --git a/packages/x-date-pickers-pro/src/DesktopDateTimeRangePicker/DesktopDateTimeRangePicker.types.ts b/packages/x-date-pickers-pro/src/DesktopDateTimeRangePicker/DesktopDateTimeRangePicker.types.ts index 3f956449fba72..a692b4307fe44 100644 --- a/packages/x-date-pickers-pro/src/DesktopDateTimeRangePicker/DesktopDateTimeRangePicker.types.ts +++ b/packages/x-date-pickers-pro/src/DesktopDateTimeRangePicker/DesktopDateTimeRangePicker.types.ts @@ -1,4 +1,5 @@ import { MakeOptional } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { UseDesktopRangePickerSlots, UseDesktopRangePickerSlotProps, @@ -11,15 +12,15 @@ import { } from '../DateTimeRangePicker/shared'; import { DateTimeRangePickerView } from '../internals/models'; -export interface DesktopDateTimeRangePickerSlots +export interface DesktopDateTimeRangePickerSlots extends BaseDateTimeRangePickerSlots, MakeOptional, 'field'> {} -export interface DesktopDateTimeRangePickerSlotProps +export interface DesktopDateTimeRangePickerSlotProps extends BaseDateTimeRangePickerSlotProps, Omit, 'tabs' | 'toolbar'> {} -export interface DesktopDateTimeRangePickerProps +export interface DesktopDateTimeRangePickerProps extends BaseDateTimeRangePickerProps, DesktopRangeOnlyPickerProps { /** diff --git a/packages/x-date-pickers-pro/src/DesktopDateTimeRangePicker/DesktopDateTimeRangePickerLayout.tsx b/packages/x-date-pickers-pro/src/DesktopDateTimeRangePicker/DesktopDateTimeRangePickerLayout.tsx index 3bb22d7026339..37d9dc97df208 100644 --- a/packages/x-date-pickers-pro/src/DesktopDateTimeRangePicker/DesktopDateTimeRangePickerLayout.tsx +++ b/packages/x-date-pickers-pro/src/DesktopDateTimeRangePicker/DesktopDateTimeRangePickerLayout.tsx @@ -8,13 +8,14 @@ import { pickersLayoutClasses, usePickerLayout, } from '@mui/x-date-pickers/PickersLayout'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { DateRange } from '../models'; import { DateTimeRangePickerView } from '../internals/models/dateTimeRange'; /** * @ignore - internal component. */ -export function DesktopDateTimeRangePickerLayout( +export function DesktopDateTimeRangePickerLayout( props: PickersLayoutProps, TDate, DateTimeRangePickerView>, ) { const { toolbar, tabs, content, actionBar, shortcuts } = usePickerLayout(props); diff --git a/packages/x-date-pickers-pro/src/MobileDateRangePicker/MobileDateRangePicker.tsx b/packages/x-date-pickers-pro/src/MobileDateRangePicker/MobileDateRangePicker.tsx index c4464ff216a80..bd01168d00536 100644 --- a/packages/x-date-pickers-pro/src/MobileDateRangePicker/MobileDateRangePicker.tsx +++ b/packages/x-date-pickers-pro/src/MobileDateRangePicker/MobileDateRangePicker.tsx @@ -1,6 +1,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import { extractValidationProps, PickerViewRendererLookup } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { resolveComponentProps } from '@mui/base/utils'; import { refType } from '@mui/utils'; import { rangeValueManager } from '../internals/utils/valueManagers'; @@ -12,7 +13,7 @@ import { useMobileRangePicker } from '../internals/hooks/useMobileRangePicker'; import { validateDateRange } from '../internals/utils/validation/validateDateRange'; import { DateRange } from '../models'; -type MobileDateRangePickerComponent = (( +type MobileDateRangePickerComponent = (( props: MobileDateRangePickerProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -26,10 +27,9 @@ type MobileDateRangePickerComponent = (( * * - [MobileDateRangePicker API](https://mui.com/x/api/date-pickers/mobile-date-range-picker/) */ -const MobileDateRangePicker = React.forwardRef(function MobileDateRangePicker( - inProps: MobileDateRangePickerProps, - ref: React.Ref, -) { +const MobileDateRangePicker = React.forwardRef(function MobileDateRangePicker< + TDate extends PickerValidDate, +>(inProps: MobileDateRangePickerProps, ref: React.Ref) { // Props with the default values common to all date time pickers const defaultizedProps = useDateRangePickerDefaultizedProps< TDate, @@ -116,7 +116,7 @@ MobileDateRangePicker.propTypes = { * The default value. * Used when the component is not controlled. */ - defaultValue: PropTypes.arrayOf(PropTypes.any), + defaultValue: PropTypes.arrayOf(PropTypes.object), /** * If `true`, after selecting `start` date calendar will not automatically switch to the month of `end` date. * @default false @@ -197,11 +197,11 @@ MobileDateRangePicker.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Name attribute used by the `input` element in the Field. * Ignored if the field has several inputs. @@ -277,7 +277,7 @@ MobileDateRangePicker.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * Component rendered on the "day" view when `props.loading` is true. * @returns {React.ReactNode} The node to render when loading. @@ -364,7 +364,7 @@ MobileDateRangePicker.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.arrayOf(PropTypes.any), + value: PropTypes.arrayOf(PropTypes.object), /** * Define custom view renderers for each section. * If `null`, the section will only have field editing. diff --git a/packages/x-date-pickers-pro/src/MobileDateRangePicker/MobileDateRangePicker.types.ts b/packages/x-date-pickers-pro/src/MobileDateRangePicker/MobileDateRangePicker.types.ts index a5e6cc05419cd..9bb677638253b 100644 --- a/packages/x-date-pickers-pro/src/MobileDateRangePicker/MobileDateRangePicker.types.ts +++ b/packages/x-date-pickers-pro/src/MobileDateRangePicker/MobileDateRangePicker.types.ts @@ -1,4 +1,5 @@ import { MakeOptional } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { UseMobileRangePickerSlots, UseMobileRangePickerSlotProps, @@ -10,15 +11,15 @@ import { BaseDateRangePickerSlotProps, } from '../DateRangePicker/shared'; -export interface MobileDateRangePickerSlots +export interface MobileDateRangePickerSlots extends BaseDateRangePickerSlots, MakeOptional, 'field'> {} -export interface MobileDateRangePickerSlotProps +export interface MobileDateRangePickerSlotProps extends BaseDateRangePickerSlotProps, Omit, 'tabs'> {} -export interface MobileDateRangePickerProps +export interface MobileDateRangePickerProps extends BaseDateRangePickerProps, MobileRangeOnlyPickerProps { /** diff --git a/packages/x-date-pickers-pro/src/MobileDateTimeRangePicker/MobileDateTimeRangePicker.tsx b/packages/x-date-pickers-pro/src/MobileDateTimeRangePicker/MobileDateTimeRangePicker.tsx index 5799916f98367..3a1878ce53655 100644 --- a/packages/x-date-pickers-pro/src/MobileDateTimeRangePicker/MobileDateTimeRangePicker.tsx +++ b/packages/x-date-pickers-pro/src/MobileDateTimeRangePicker/MobileDateTimeRangePicker.tsx @@ -10,6 +10,7 @@ import { PickerViewRenderer, DefaultizedProps, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { resolveComponentProps } from '@mui/base/utils'; import { renderDigitalClockTimeView, @@ -35,7 +36,7 @@ import { MultiInputDateTimeRangeField } from '../MultiInputDateTimeRangeField'; import { DateTimeRangePickerTimeWrapper } from '../DateTimeRangePicker/DateTimeRangePickerTimeWrapper'; import { RANGE_VIEW_HEIGHT } from '../internals/constants/dimensions'; -const rendererInterceptor = function rendererInterceptor( +const rendererInterceptor = function rendererInterceptor( inViewRenderers: PickerViewRendererLookup, DateTimeRangePickerView, any, any>, popperView: DateTimeRangePickerView, rendererProps: DefaultizedProps< @@ -102,14 +103,13 @@ const rendererInterceptor = function rendererInterceptor( }); }; -type MobileDateRangePickerComponent = (( +type MobileDateRangePickerComponent = (( props: MobileDateTimeRangePickerProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; -const MobileDateTimeRangePicker = React.forwardRef(function MobileDateTimeRangePicker( - inProps: MobileDateTimeRangePickerProps, - ref: React.Ref, -) { +const MobileDateTimeRangePicker = React.forwardRef(function MobileDateTimeRangePicker< + TDate extends PickerValidDate, +>(inProps: MobileDateTimeRangePickerProps, ref: React.Ref) { // Props with the default values common to all date time range pickers const defaultizedProps = useDateTimeRangePickerDefaultizedProps< TDate, @@ -220,7 +220,7 @@ MobileDateTimeRangePicker.propTypes = { * The default value. * Used when the component is not controlled. */ - defaultValue: PropTypes.arrayOf(PropTypes.any), + defaultValue: PropTypes.arrayOf(PropTypes.object), /** * If `true`, after selecting `start` date calendar will not automatically switch to the month of `end` date. * @default false @@ -311,29 +311,29 @@ MobileDateTimeRangePicker.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Maximal selectable moment of time with binding to date, to set max time in each day use `maxTime`. */ - maxDateTime: PropTypes.any, + maxDateTime: PropTypes.object, /** * Maximal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - maxTime: PropTypes.any, + maxTime: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Minimal selectable moment of time with binding to date, to set min time in each day use `minTime`. */ - minDateTime: PropTypes.any, + minDateTime: PropTypes.object, /** * Minimal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - minTime: PropTypes.any, + minTime: PropTypes.object, /** * Step over minutes. * @default 1 @@ -426,7 +426,7 @@ MobileDateTimeRangePicker.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * Component rendered on the "day" view when `props.loading` is true. * @returns {React.ReactNode} The node to render when loading. @@ -542,7 +542,7 @@ MobileDateTimeRangePicker.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.arrayOf(PropTypes.any), + value: PropTypes.arrayOf(PropTypes.object), /** * The visible view. * Used when the component view is controlled. diff --git a/packages/x-date-pickers-pro/src/MobileDateTimeRangePicker/MobileDateTimeRangePicker.types.ts b/packages/x-date-pickers-pro/src/MobileDateTimeRangePicker/MobileDateTimeRangePicker.types.ts index e7d18f3c649b9..de00d8476319d 100644 --- a/packages/x-date-pickers-pro/src/MobileDateTimeRangePicker/MobileDateTimeRangePicker.types.ts +++ b/packages/x-date-pickers-pro/src/MobileDateTimeRangePicker/MobileDateTimeRangePicker.types.ts @@ -1,4 +1,5 @@ import { MakeOptional } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { UseMobileRangePickerSlots, UseMobileRangePickerSlotProps, @@ -11,15 +12,15 @@ import { } from '../DateTimeRangePicker/shared'; import { DateTimeRangePickerView } from '../internals/models'; -export interface MobileDateTimeRangePickerSlots +export interface MobileDateTimeRangePickerSlots extends BaseDateTimeRangePickerSlots, MakeOptional, 'field'> {} -export interface MobileDateTimeRangePickerSlotProps +export interface MobileDateTimeRangePickerSlotProps extends BaseDateTimeRangePickerSlotProps, Omit, 'tabs' | 'toolbar'> {} -export interface MobileDateTimeRangePickerProps +export interface MobileDateTimeRangePickerProps extends BaseDateTimeRangePickerProps, MobileRangeOnlyPickerProps { /** diff --git a/packages/x-date-pickers-pro/src/MultiInputDateRangeField/MultiInputDateRangeField.tsx b/packages/x-date-pickers-pro/src/MultiInputDateRangeField/MultiInputDateRangeField.tsx index 31242ffb5927a..6cc3b8d20e970 100644 --- a/packages/x-date-pickers-pro/src/MultiInputDateRangeField/MultiInputDateRangeField.tsx +++ b/packages/x-date-pickers-pro/src/MultiInputDateRangeField/MultiInputDateRangeField.tsx @@ -16,6 +16,7 @@ import { FieldsTextFieldProps, convertFieldResponseIntoMuiTextFieldProps, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { MultiInputDateRangeFieldProps } from './MultiInputDateRangeField.types'; import { useMultiInputDateRangeField } from '../internals/hooks/useMultiInputRangeField/useMultiInputDateRangeField'; import { UseDateRangeFieldProps } from '../internals/models/dateRange'; @@ -59,7 +60,7 @@ const MultiInputDateRangeFieldSeparator = styled( }, )({}); -type MultiInputDateRangeFieldComponent = (( +type MultiInputDateRangeFieldComponent = (( props: MultiInputDateRangeFieldProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -73,10 +74,9 @@ type MultiInputDateRangeFieldComponent = (( * * - [MultiInputDateRangeField API](https://mui.com/x/api/multi-input-date-range-field/) */ -const MultiInputDateRangeField = React.forwardRef(function MultiInputDateRangeField( - inProps: MultiInputDateRangeFieldProps, - ref: React.Ref, -) { +const MultiInputDateRangeField = React.forwardRef(function MultiInputDateRangeField< + TDate extends PickerValidDate, +>(inProps: MultiInputDateRangeFieldProps, ref: React.Ref) { const themeProps = useThemeProps({ props: inProps, name: 'MuiMultiInputDateRangeField', @@ -173,7 +173,7 @@ MultiInputDateRangeField.propTypes = { /** * The default value. Use when the component is not controlled. */ - defaultValue: PropTypes.arrayOf(PropTypes.any), + defaultValue: PropTypes.arrayOf(PropTypes.object), /** * Defines the `flex-direction` style property. * It is applied for all screen sizes. @@ -216,11 +216,11 @@ MultiInputDateRangeField.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Callback fired when the value changes. * @template TValue The value type. Will be either the same type as `value` or `null`. Can be in `[start, end]` format in case of range value. @@ -253,7 +253,7 @@ MultiInputDateRangeField.propTypes = { * For example, on time fields it will be used to determine the date to set. * @default The closest valid date using the validation props, except callbacks such as `shouldDisableDate`. Value is rounded to the most granular section used. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * The currently selected sections. * This prop accept four formats: @@ -361,7 +361,7 @@ MultiInputDateRangeField.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.arrayOf(PropTypes.any), + value: PropTypes.arrayOf(PropTypes.object), } as any; export { MultiInputDateRangeField }; diff --git a/packages/x-date-pickers-pro/src/MultiInputDateRangeField/MultiInputDateRangeField.types.ts b/packages/x-date-pickers-pro/src/MultiInputDateRangeField/MultiInputDateRangeField.types.ts index 9638f73727ac5..8b741a80e9201 100644 --- a/packages/x-date-pickers-pro/src/MultiInputDateRangeField/MultiInputDateRangeField.types.ts +++ b/packages/x-date-pickers-pro/src/MultiInputDateRangeField/MultiInputDateRangeField.types.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { SlotComponentProps } from '@mui/base/utils'; import Typography from '@mui/material/Typography'; import Stack, { StackProps } from '@mui/material/Stack'; @@ -9,21 +10,21 @@ import { MultiInputFieldRefs } from '../internals/models/fields'; import { MultiInputRangeFieldClasses, RangePosition } from '../models'; export type UseMultiInputDateRangeFieldParams< - TDate, + TDate extends PickerValidDate, TTextFieldSlotProps extends {}, > = UseMultiInputRangeFieldParams, TTextFieldSlotProps>; -export interface UseMultiInputDateRangeFieldProps +export interface UseMultiInputDateRangeFieldProps extends Omit, 'unstableFieldRef' | 'clearable' | 'onClear'>, MultiInputFieldRefs {} -export type UseMultiInputDateRangeFieldComponentProps = Omit< - TChildProps, - keyof UseMultiInputDateRangeFieldProps -> & +export type UseMultiInputDateRangeFieldComponentProps< + TDate extends PickerValidDate, + TChildProps extends {}, +> = Omit> & UseMultiInputDateRangeFieldProps; -export interface MultiInputDateRangeFieldProps +export interface MultiInputDateRangeFieldProps extends UseMultiInputDateRangeFieldComponentProps> { autoFocus?: boolean; /** @@ -42,7 +43,8 @@ export interface MultiInputDateRangeFieldProps slotProps?: MultiInputDateRangeFieldSlotProps; } -export type MultiInputDateRangeFieldOwnerState = MultiInputDateRangeFieldProps; +export type MultiInputDateRangeFieldOwnerState = + MultiInputDateRangeFieldProps; export interface MultiInputDateRangeFieldSlots { /** @@ -64,7 +66,7 @@ export interface MultiInputDateRangeFieldSlots { separator?: React.ElementType; } -export interface MultiInputDateRangeFieldSlotProps { +export interface MultiInputDateRangeFieldSlotProps { root?: SlotComponentProps>; textField?: SlotComponentProps< typeof TextField, diff --git a/packages/x-date-pickers-pro/src/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.tsx b/packages/x-date-pickers-pro/src/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.tsx index 3820e3f57814c..64ec39d23c327 100644 --- a/packages/x-date-pickers-pro/src/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.tsx +++ b/packages/x-date-pickers-pro/src/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.tsx @@ -16,6 +16,7 @@ import { FieldsTextFieldProps, convertFieldResponseIntoMuiTextFieldProps, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { MultiInputDateTimeRangeFieldProps } from './MultiInputDateTimeRangeField.types'; import { useMultiInputDateTimeRangeField } from '../internals/hooks/useMultiInputRangeField/useMultiInputDateTimeRangeField'; import { UseDateTimeRangeFieldProps } from '../internals/models/dateTimeRange'; @@ -57,7 +58,7 @@ const MultiInputDateTimeRangeFieldSeparator = styled( }, )({}); -type MultiInputDateTimeRangeFieldComponent = (( +type MultiInputDateTimeRangeFieldComponent = (( props: MultiInputDateTimeRangeFieldProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -71,10 +72,9 @@ type MultiInputDateTimeRangeFieldComponent = (( * * - [MultiInputDateTimeRangeField API](https://mui.com/x/api/multi-input-date-time-range-field/) */ -const MultiInputDateTimeRangeField = React.forwardRef(function MultiInputDateTimeRangeField( - inProps: MultiInputDateTimeRangeFieldProps, - ref: React.Ref, -) { +const MultiInputDateTimeRangeField = React.forwardRef(function MultiInputDateTimeRangeField< + TDate extends PickerValidDate, +>(inProps: MultiInputDateTimeRangeFieldProps, ref: React.Ref) { const themeProps = useThemeProps({ props: inProps, name: 'MuiMultiInputDateTimeRangeField', @@ -176,7 +176,7 @@ MultiInputDateTimeRangeField.propTypes = { /** * The default value. Use when the component is not controlled. */ - defaultValue: PropTypes.arrayOf(PropTypes.any), + defaultValue: PropTypes.arrayOf(PropTypes.object), /** * Defines the `flex-direction` style property. * It is applied for all screen sizes. @@ -224,29 +224,29 @@ MultiInputDateTimeRangeField.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Maximal selectable moment of time with binding to date, to set max time in each day use `maxTime`. */ - maxDateTime: PropTypes.any, + maxDateTime: PropTypes.object, /** * Maximal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - maxTime: PropTypes.any, + maxTime: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Minimal selectable moment of time with binding to date, to set min time in each day use `minTime`. */ - minDateTime: PropTypes.any, + minDateTime: PropTypes.object, /** * Minimal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - minTime: PropTypes.any, + minTime: PropTypes.object, /** * Step over minutes. * @default 1 @@ -284,7 +284,7 @@ MultiInputDateTimeRangeField.propTypes = { * For example, on time fields it will be used to determine the date to set. * @default The closest valid date using the validation props, except callbacks such as `shouldDisableDate`. Value is rounded to the most granular section used. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * The currently selected sections. * This prop accept four formats: @@ -400,7 +400,7 @@ MultiInputDateTimeRangeField.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.arrayOf(PropTypes.any), + value: PropTypes.arrayOf(PropTypes.object), } as any; export { MultiInputDateTimeRangeField }; diff --git a/packages/x-date-pickers-pro/src/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.types.ts b/packages/x-date-pickers-pro/src/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.types.ts index 3189bf67c2b7c..f83594e58fb1f 100644 --- a/packages/x-date-pickers-pro/src/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.types.ts +++ b/packages/x-date-pickers-pro/src/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.types.ts @@ -3,6 +3,7 @@ import { SlotComponentProps } from '@mui/base/utils'; import Typography from '@mui/material/Typography'; import Stack, { StackProps } from '@mui/material/Stack'; import TextField from '@mui/material/TextField'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { UseDateTimeRangeFieldDefaultizedProps, UseDateTimeRangeFieldProps, @@ -12,21 +13,21 @@ import { UseMultiInputRangeFieldParams } from '../internals/hooks/useMultiInputR import { MultiInputRangeFieldClasses, RangePosition } from '../models'; export type UseMultiInputDateTimeRangeFieldParams< - TDate, + TDate extends PickerValidDate, TTextFieldSlotProps extends {}, > = UseMultiInputRangeFieldParams, TTextFieldSlotProps>; -export interface UseMultiInputDateTimeRangeFieldProps +export interface UseMultiInputDateTimeRangeFieldProps extends Omit, 'unstableFieldRef' | 'clearable' | 'onClear'>, MultiInputFieldRefs {} -export type UseMultiInputDateTimeRangeFieldComponentProps = Omit< - TChildProps, - keyof UseMultiInputDateTimeRangeFieldProps -> & +export type UseMultiInputDateTimeRangeFieldComponentProps< + TDate extends PickerValidDate, + TChildProps extends {}, +> = Omit> & UseMultiInputDateTimeRangeFieldProps; -export interface MultiInputDateTimeRangeFieldProps +export interface MultiInputDateTimeRangeFieldProps extends UseMultiInputDateTimeRangeFieldComponentProps> { autoFocus?: boolean; /** @@ -45,7 +46,7 @@ export interface MultiInputDateTimeRangeFieldProps slotProps?: MultiInputDateTimeRangeFieldSlotProps; } -export type MultiInputDateTimeRangeFieldOwnerState = +export type MultiInputDateTimeRangeFieldOwnerState = MultiInputDateTimeRangeFieldProps; export interface MultiInputDateTimeRangeFieldSlots { @@ -68,7 +69,7 @@ export interface MultiInputDateTimeRangeFieldSlots { separator?: React.ElementType; } -export interface MultiInputDateTimeRangeFieldSlotProps { +export interface MultiInputDateTimeRangeFieldSlotProps { root?: SlotComponentProps>; textField?: SlotComponentProps< typeof TextField, @@ -83,7 +84,7 @@ export interface MultiInputDateTimeRangeFieldSlotProps { } export type UseMultiInputDateTimeRangeFieldDefaultizedProps< - TDate, + TDate extends PickerValidDate, AdditionalProps extends {}, > = UseDateTimeRangeFieldDefaultizedProps & Omit; diff --git a/packages/x-date-pickers-pro/src/MultiInputTimeRangeField/MultiInputTimeRangeField.tsx b/packages/x-date-pickers-pro/src/MultiInputTimeRangeField/MultiInputTimeRangeField.tsx index 0cc0564271325..03ad3860bce26 100644 --- a/packages/x-date-pickers-pro/src/MultiInputTimeRangeField/MultiInputTimeRangeField.tsx +++ b/packages/x-date-pickers-pro/src/MultiInputTimeRangeField/MultiInputTimeRangeField.tsx @@ -16,6 +16,7 @@ import { FieldsTextFieldProps, convertFieldResponseIntoMuiTextFieldProps, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { MultiInputTimeRangeFieldProps } from './MultiInputTimeRangeField.types'; import { useMultiInputTimeRangeField } from '../internals/hooks/useMultiInputRangeField/useMultiInputTimeRangeField'; import { UseTimeRangeFieldProps } from '../internals/models/timeRange'; @@ -59,7 +60,7 @@ const MultiInputTimeRangeFieldSeparator = styled( }, )({}); -type MultiInputTimeRangeFieldComponent = (( +type MultiInputTimeRangeFieldComponent = (( props: MultiInputTimeRangeFieldProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -73,10 +74,9 @@ type MultiInputTimeRangeFieldComponent = (( * * - [MultiInputTimeRangeField API](https://mui.com/x/api/multi-input-time-range-field/) */ -const MultiInputTimeRangeField = React.forwardRef(function MultiInputTimeRangeField( - inProps: MultiInputTimeRangeFieldProps, - ref: React.Ref, -) { +const MultiInputTimeRangeField = React.forwardRef(function MultiInputTimeRangeField< + TDate extends PickerValidDate, +>(inProps: MultiInputTimeRangeFieldProps, ref: React.Ref) { const themeProps = useThemeProps({ props: inProps, name: 'MuiMultiInputTimeRangeField', @@ -179,7 +179,7 @@ MultiInputTimeRangeField.propTypes = { /** * The default value. Use when the component is not controlled. */ - defaultValue: PropTypes.arrayOf(PropTypes.any), + defaultValue: PropTypes.arrayOf(PropTypes.object), /** * Defines the `flex-direction` style property. * It is applied for all screen sizes. @@ -228,12 +228,12 @@ MultiInputTimeRangeField.propTypes = { * Maximal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - maxTime: PropTypes.any, + maxTime: PropTypes.object, /** * Minimal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - minTime: PropTypes.any, + minTime: PropTypes.object, /** * Step over minutes. * @default 1 @@ -271,7 +271,7 @@ MultiInputTimeRangeField.propTypes = { * For example, on time fields it will be used to determine the date to set. * @default The closest valid date using the validation props, except callbacks such as `shouldDisableDate`. Value is rounded to the most granular section used. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * The currently selected sections. * This prop accept four formats: @@ -376,7 +376,7 @@ MultiInputTimeRangeField.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.arrayOf(PropTypes.any), + value: PropTypes.arrayOf(PropTypes.object), } as any; export { MultiInputTimeRangeField }; diff --git a/packages/x-date-pickers-pro/src/MultiInputTimeRangeField/MultiInputTimeRangeField.types.ts b/packages/x-date-pickers-pro/src/MultiInputTimeRangeField/MultiInputTimeRangeField.types.ts index 8cd1cb9682d5e..3dde1f4009337 100644 --- a/packages/x-date-pickers-pro/src/MultiInputTimeRangeField/MultiInputTimeRangeField.types.ts +++ b/packages/x-date-pickers-pro/src/MultiInputTimeRangeField/MultiInputTimeRangeField.types.ts @@ -3,6 +3,7 @@ import { SlotComponentProps } from '@mui/base/utils'; import Typography from '@mui/material/Typography'; import Stack, { StackProps } from '@mui/material/Stack'; import TextField from '@mui/material/TextField'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { UseTimeRangeFieldDefaultizedProps, UseTimeRangeFieldProps, @@ -12,21 +13,21 @@ import { MultiInputFieldRefs } from '../internals/models/fields'; import { MultiInputRangeFieldClasses, RangePosition } from '../models'; export type UseMultiInputTimeRangeFieldParams< - TDate, + TDate extends PickerValidDate, TTextFieldSlotProps extends {}, > = UseMultiInputRangeFieldParams, TTextFieldSlotProps>; -export interface UseMultiInputTimeRangeFieldProps +export interface UseMultiInputTimeRangeFieldProps extends Omit, 'unstableFieldRef' | 'clearable' | 'onClear'>, MultiInputFieldRefs {} -export type UseMultiInputTimeRangeFieldComponentProps = Omit< - TChildProps, - keyof UseMultiInputTimeRangeFieldProps -> & +export type UseMultiInputTimeRangeFieldComponentProps< + TDate extends PickerValidDate, + TChildProps extends {}, +> = Omit> & UseMultiInputTimeRangeFieldProps; -export interface MultiInputTimeRangeFieldProps +export interface MultiInputTimeRangeFieldProps extends UseMultiInputTimeRangeFieldComponentProps> { autoFocus?: boolean; /** @@ -45,7 +46,8 @@ export interface MultiInputTimeRangeFieldProps slotProps?: MultiInputTimeRangeFieldSlotProps; } -export type MultiInputTimeRangeFieldOwnerState = MultiInputTimeRangeFieldProps; +export type MultiInputTimeRangeFieldOwnerState = + MultiInputTimeRangeFieldProps; export interface MultiInputTimeRangeFieldSlots { /** @@ -67,7 +69,7 @@ export interface MultiInputTimeRangeFieldSlots { separator?: React.ElementType; } -export interface MultiInputTimeRangeFieldSlotProps { +export interface MultiInputTimeRangeFieldSlotProps { root?: SlotComponentProps>; textField?: SlotComponentProps< typeof TextField, @@ -78,7 +80,7 @@ export interface MultiInputTimeRangeFieldSlotProps { } export type UseMultiInputTimeRangeFieldDefaultizedProps< - TDate, + TDate extends PickerValidDate, AdditionalProps extends {}, > = UseTimeRangeFieldDefaultizedProps & Omit; diff --git a/packages/x-date-pickers-pro/src/SingleInputDateRangeField/SingleInputDateRangeField.tsx b/packages/x-date-pickers-pro/src/SingleInputDateRangeField/SingleInputDateRangeField.tsx index 79fdcbfcb1ff8..ca3db91f8151f 100644 --- a/packages/x-date-pickers-pro/src/SingleInputDateRangeField/SingleInputDateRangeField.tsx +++ b/packages/x-date-pickers-pro/src/SingleInputDateRangeField/SingleInputDateRangeField.tsx @@ -5,6 +5,7 @@ import { useThemeProps } from '@mui/material/styles'; import { useSlotProps } from '@mui/base/utils'; import { useClearableField } from '@mui/x-date-pickers/hooks'; import { convertFieldResponseIntoMuiTextFieldProps } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { refType } from '@mui/utils'; import { SingleInputDateRangeFieldProps, @@ -13,7 +14,7 @@ import { import { useSingleInputDateRangeField } from './useSingleInputDateRangeField'; import { FieldType } from '../internals/models'; -type DateRangeFieldComponent = (( +type DateRangeFieldComponent = (( props: SingleInputDateRangeFieldProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any; fieldType?: FieldType }; @@ -27,10 +28,9 @@ type DateRangeFieldComponent = (( * * - [SingleInputDateRangeField API](https://mui.com/x/api/single-input-date-range-field/) */ -const SingleInputDateRangeField = React.forwardRef(function SingleInputDateRangeField( - inProps: SingleInputDateRangeFieldProps, - inRef: React.Ref, -) { +const SingleInputDateRangeField = React.forwardRef(function SingleInputDateRangeField< + TDate extends PickerValidDate, +>(inProps: SingleInputDateRangeFieldProps, inRef: React.Ref) { const themeProps = useThemeProps({ props: inProps, name: 'MuiSingleInputDateRangeField', @@ -101,7 +101,7 @@ SingleInputDateRangeField.propTypes = { /** * The default value. Use when the component is not controlled. */ - defaultValue: PropTypes.arrayOf(PropTypes.any), + defaultValue: PropTypes.arrayOf(PropTypes.object), /** * If `true`, the component is disabled. * @default false @@ -188,11 +188,11 @@ SingleInputDateRangeField.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Name attribute of the `input` element. */ @@ -235,7 +235,7 @@ SingleInputDateRangeField.propTypes = { * For example, on time fields it will be used to determine the date to set. * @default The closest valid date using the validation props, except callbacks such as `shouldDisableDate`. Value is rounded to the most granular section used. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * If `true`, the label is displayed as required and the `input` element is required. * @default false @@ -334,7 +334,7 @@ SingleInputDateRangeField.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.arrayOf(PropTypes.any), + value: PropTypes.arrayOf(PropTypes.object), /** * The variant to use. * @default 'outlined' diff --git a/packages/x-date-pickers-pro/src/SingleInputDateRangeField/SingleInputDateRangeField.types.ts b/packages/x-date-pickers-pro/src/SingleInputDateRangeField/SingleInputDateRangeField.types.ts index 82aab457b364c..8e022305bf596 100644 --- a/packages/x-date-pickers-pro/src/SingleInputDateRangeField/SingleInputDateRangeField.types.ts +++ b/packages/x-date-pickers-pro/src/SingleInputDateRangeField/SingleInputDateRangeField.types.ts @@ -2,25 +2,27 @@ import * as React from 'react'; import { SlotComponentProps } from '@mui/base/utils'; import TextField from '@mui/material/TextField'; import { FieldsTextFieldProps } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { UseClearableFieldSlots, UseClearableFieldSlotProps } from '@mui/x-date-pickers/hooks'; import { UseDateRangeFieldDefaultizedProps, UseDateRangeFieldProps } from '../internals/models'; -export interface UseSingleInputDateRangeFieldProps extends UseDateRangeFieldProps {} +export interface UseSingleInputDateRangeFieldProps + extends UseDateRangeFieldProps {} export type UseSingleInputDateRangeFieldDefaultizedProps< - TDate, + TDate extends PickerValidDate, AdditionalProps extends {}, > = UseDateRangeFieldDefaultizedProps & Omit; -export type UseSingleInputDateRangeFieldComponentProps = Omit< - TChildProps, - keyof UseSingleInputDateRangeFieldProps -> & +export type UseSingleInputDateRangeFieldComponentProps< + TDate extends PickerValidDate, + TChildProps extends {}, +> = Omit> & UseSingleInputDateRangeFieldProps; export type SingleInputDateRangeFieldProps< - TDate, + TDate extends PickerValidDate, TChildProps extends {} = FieldsTextFieldProps, > = UseSingleInputDateRangeFieldComponentProps & { /** @@ -35,7 +37,8 @@ export type SingleInputDateRangeFieldProps< slotProps?: SingleInputDateRangeFieldSlotProps; }; -export type SingleInputDateRangeFieldOwnerState = SingleInputDateRangeFieldProps; +export type SingleInputDateRangeFieldOwnerState = + SingleInputDateRangeFieldProps; export interface SingleInputDateRangeFieldSlots extends UseClearableFieldSlots { /** @@ -46,6 +49,7 @@ export interface SingleInputDateRangeFieldSlots extends UseClearableFieldSlots { textField?: React.ElementType; } -export interface SingleInputDateRangeFieldSlotProps extends UseClearableFieldSlotProps { +export interface SingleInputDateRangeFieldSlotProps + extends UseClearableFieldSlotProps { textField?: SlotComponentProps>; } diff --git a/packages/x-date-pickers-pro/src/SingleInputDateRangeField/useSingleInputDateRangeField.ts b/packages/x-date-pickers-pro/src/SingleInputDateRangeField/useSingleInputDateRangeField.ts index e4fd9f760d11a..267533708dcb5 100644 --- a/packages/x-date-pickers-pro/src/SingleInputDateRangeField/useSingleInputDateRangeField.ts +++ b/packages/x-date-pickers-pro/src/SingleInputDateRangeField/useSingleInputDateRangeField.ts @@ -5,6 +5,7 @@ import { useField, splitFieldInternalAndForwardedProps, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { UseSingleInputDateRangeFieldComponentProps, UseSingleInputDateRangeFieldDefaultizedProps, @@ -13,7 +14,10 @@ import { import { rangeValueManager, rangeFieldValueManager } from '../internals/utils/valueManagers'; import { validateDateRange } from '../internals/utils/validation/validateDateRange'; -export const useDefaultizedDateRangeFieldProps = ( +export const useDefaultizedDateRangeFieldProps = < + TDate extends PickerValidDate, + AdditionalProps extends {}, +>( props: UseSingleInputDateRangeFieldProps, ): UseSingleInputDateRangeFieldDefaultizedProps => { const utils = useUtils(); @@ -29,7 +33,7 @@ export const useDefaultizedDateRangeFieldProps = ( +export const useSingleInputDateRangeField = ( inProps: UseSingleInputDateRangeFieldComponentProps, ) => { const props = useDefaultizedDateRangeFieldProps(inProps); diff --git a/packages/x-date-pickers-pro/src/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.tsx b/packages/x-date-pickers-pro/src/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.tsx index 1afa9c2ddc87d..f2635d79d128a 100644 --- a/packages/x-date-pickers-pro/src/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.tsx +++ b/packages/x-date-pickers-pro/src/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.tsx @@ -5,6 +5,7 @@ import { convertFieldResponseIntoMuiTextFieldProps } from '@mui/x-date-pickers/i import { useThemeProps } from '@mui/material/styles'; import { useSlotProps } from '@mui/base/utils'; import { useClearableField } from '@mui/x-date-pickers/hooks'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { refType } from '@mui/utils'; import { SingleInputDateTimeRangeFieldProps, @@ -13,7 +14,7 @@ import { import { useSingleInputDateTimeRangeField } from './useSingleInputDateTimeRangeField'; import { FieldType } from '../internals/models'; -type DateRangeFieldComponent = (( +type DateRangeFieldComponent = (( props: SingleInputDateTimeRangeFieldProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any; fieldType?: FieldType }; @@ -28,7 +29,7 @@ type DateRangeFieldComponent = (( * - [SingleInputDateTimeRangeField API](https://mui.com/x/api/single-input-date-time-range-field/) */ const SingleInputDateTimeRangeField = React.forwardRef(function SingleInputDateTimeRangeField< - TDate, + TDate extends PickerValidDate, >(inProps: SingleInputDateTimeRangeFieldProps, inRef: React.Ref) { const themeProps = useThemeProps({ props: inProps, @@ -107,7 +108,7 @@ SingleInputDateTimeRangeField.propTypes = { /** * The default value. Use when the component is not controlled. */ - defaultValue: PropTypes.arrayOf(PropTypes.any), + defaultValue: PropTypes.arrayOf(PropTypes.object), /** * If `true`, the component is disabled. * @default false @@ -199,29 +200,29 @@ SingleInputDateTimeRangeField.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Maximal selectable moment of time with binding to date, to set max time in each day use `maxTime`. */ - maxDateTime: PropTypes.any, + maxDateTime: PropTypes.object, /** * Maximal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - maxTime: PropTypes.any, + maxTime: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Minimal selectable moment of time with binding to date, to set min time in each day use `minTime`. */ - minDateTime: PropTypes.any, + minDateTime: PropTypes.object, /** * Minimal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - minTime: PropTypes.any, + minTime: PropTypes.object, /** * Step over minutes. * @default 1 @@ -269,7 +270,7 @@ SingleInputDateTimeRangeField.propTypes = { * For example, on time fields it will be used to determine the date to set. * @default The closest valid date using the validation props, except callbacks such as `shouldDisableDate`. Value is rounded to the most granular section used. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * If `true`, the label is displayed as required and the `input` element is required. * @default false @@ -376,7 +377,7 @@ SingleInputDateTimeRangeField.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.arrayOf(PropTypes.any), + value: PropTypes.arrayOf(PropTypes.object), /** * The variant to use. * @default 'outlined' diff --git a/packages/x-date-pickers-pro/src/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.types.ts b/packages/x-date-pickers-pro/src/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.types.ts index 1dfb93aeeec09..9a6b6b88d7fc0 100644 --- a/packages/x-date-pickers-pro/src/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.types.ts +++ b/packages/x-date-pickers-pro/src/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.types.ts @@ -3,26 +3,27 @@ import { SlotComponentProps } from '@mui/base/utils'; import TextField from '@mui/material/TextField'; import { FieldsTextFieldProps } from '@mui/x-date-pickers/internals'; import { UseClearableFieldSlots, UseClearableFieldSlotProps } from '@mui/x-date-pickers/hooks'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { UseDateTimeRangeFieldDefaultizedProps, UseDateTimeRangeFieldProps, } from '../internals/models'; -export interface UseSingleInputDateTimeRangeFieldProps +export interface UseSingleInputDateTimeRangeFieldProps extends UseDateTimeRangeFieldProps {} export type UseSingleInputDateTimeRangeFieldDefaultizedProps< - TDate, + TDate extends PickerValidDate, AdditionalProps extends {}, > = UseDateTimeRangeFieldDefaultizedProps & AdditionalProps; -export type UseSingleInputDateTimeRangeFieldComponentProps = Omit< - TChildProps, - keyof UseSingleInputDateTimeRangeFieldProps -> & +export type UseSingleInputDateTimeRangeFieldComponentProps< + TDate extends PickerValidDate, + TChildProps extends {}, +> = Omit> & UseSingleInputDateTimeRangeFieldProps; -export interface SingleInputDateTimeRangeFieldProps +export interface SingleInputDateTimeRangeFieldProps extends UseSingleInputDateTimeRangeFieldComponentProps { /** * Overridable component slots. @@ -36,7 +37,7 @@ export interface SingleInputDateTimeRangeFieldProps slotProps?: SingleInputDateTimeRangeFieldSlotProps; } -export type SingleInputDateTimeRangeFieldOwnerState = +export type SingleInputDateTimeRangeFieldOwnerState = SingleInputDateTimeRangeFieldProps; export interface SingleInputDateTimeRangeFieldSlots extends UseClearableFieldSlots { @@ -48,7 +49,8 @@ export interface SingleInputDateTimeRangeFieldSlots extends UseClearableFieldSlo textField?: React.ElementType; } -export interface SingleInputDateTimeRangeFieldSlotProps extends UseClearableFieldSlotProps { +export interface SingleInputDateTimeRangeFieldSlotProps + extends UseClearableFieldSlotProps { textField?: SlotComponentProps< typeof TextField, {}, diff --git a/packages/x-date-pickers-pro/src/SingleInputDateTimeRangeField/useSingleInputDateTimeRangeField.ts b/packages/x-date-pickers-pro/src/SingleInputDateTimeRangeField/useSingleInputDateTimeRangeField.ts index 815b8f7ae74f0..d6afd05119409 100644 --- a/packages/x-date-pickers-pro/src/SingleInputDateTimeRangeField/useSingleInputDateTimeRangeField.ts +++ b/packages/x-date-pickers-pro/src/SingleInputDateTimeRangeField/useSingleInputDateTimeRangeField.ts @@ -5,6 +5,7 @@ import { useDefaultDates, splitFieldInternalAndForwardedProps, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { UseSingleInputDateTimeRangeFieldComponentProps, UseSingleInputDateTimeRangeFieldDefaultizedProps, @@ -13,7 +14,10 @@ import { import { rangeValueManager, rangeFieldValueManager } from '../internals/utils/valueManagers'; import { validateDateTimeRange } from '../internals/utils/validation/validateDateTimeRange'; -export const useDefaultizedTimeRangeFieldProps = ( +export const useDefaultizedTimeRangeFieldProps = < + TDate extends PickerValidDate, + AdditionalProps extends {}, +>( props: UseSingleInputDateTimeRangeFieldProps, ): UseSingleInputDateTimeRangeFieldDefaultizedProps => { const utils = useUtils(); @@ -37,7 +41,10 @@ export const useDefaultizedTimeRangeFieldProps = ( +export const useSingleInputDateTimeRangeField = < + TDate extends PickerValidDate, + TChildProps extends {}, +>( inProps: UseSingleInputDateTimeRangeFieldComponentProps, ) => { const props = useDefaultizedTimeRangeFieldProps(inProps); diff --git a/packages/x-date-pickers-pro/src/SingleInputTimeRangeField/SingleInputTimeRangeField.tsx b/packages/x-date-pickers-pro/src/SingleInputTimeRangeField/SingleInputTimeRangeField.tsx index 64050ad98d9a9..c719820f233f7 100644 --- a/packages/x-date-pickers-pro/src/SingleInputTimeRangeField/SingleInputTimeRangeField.tsx +++ b/packages/x-date-pickers-pro/src/SingleInputTimeRangeField/SingleInputTimeRangeField.tsx @@ -3,6 +3,7 @@ import PropTypes from 'prop-types'; import MuiTextField from '@mui/material/TextField'; import { useClearableField } from '@mui/x-date-pickers/hooks'; import { convertFieldResponseIntoMuiTextFieldProps } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { useThemeProps } from '@mui/material/styles'; import { useSlotProps } from '@mui/base/utils'; import { refType } from '@mui/utils'; @@ -13,7 +14,7 @@ import { import { useSingleInputTimeRangeField } from './useSingleInputTimeRangeField'; import { FieldType } from '../internals/models'; -type DateRangeFieldComponent = (( +type DateRangeFieldComponent = (( props: SingleInputTimeRangeFieldProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any; fieldType?: FieldType }; @@ -27,10 +28,9 @@ type DateRangeFieldComponent = (( * * - [SingleInputTimeRangeField API](https://mui.com/x/api/single-input-time-range-field/) */ -const SingleInputTimeRangeField = React.forwardRef(function SingleInputTimeRangeField( - inProps: SingleInputTimeRangeFieldProps, - inRef: React.Ref, -) { +const SingleInputTimeRangeField = React.forwardRef(function SingleInputTimeRangeField< + TDate extends PickerValidDate, +>(inProps: SingleInputTimeRangeFieldProps, inRef: React.Ref) { const themeProps = useThemeProps({ props: inProps, name: 'MuiSingleInputTimeRangeField', @@ -106,7 +106,7 @@ SingleInputTimeRangeField.propTypes = { /** * The default value. Use when the component is not controlled. */ - defaultValue: PropTypes.arrayOf(PropTypes.any), + defaultValue: PropTypes.arrayOf(PropTypes.object), /** * If `true`, the component is disabled. * @default false @@ -199,12 +199,12 @@ SingleInputTimeRangeField.propTypes = { * Maximal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - maxTime: PropTypes.any, + maxTime: PropTypes.object, /** * Minimal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - minTime: PropTypes.any, + minTime: PropTypes.object, /** * Step over minutes. * @default 1 @@ -252,7 +252,7 @@ SingleInputTimeRangeField.propTypes = { * For example, on time fields it will be used to determine the date to set. * @default The closest valid date using the validation props, except callbacks such as `shouldDisableDate`. Value is rounded to the most granular section used. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * If `true`, the label is displayed as required and the `input` element is required. * @default false @@ -348,7 +348,7 @@ SingleInputTimeRangeField.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.arrayOf(PropTypes.any), + value: PropTypes.arrayOf(PropTypes.object), /** * The variant to use. * @default 'outlined' diff --git a/packages/x-date-pickers-pro/src/SingleInputTimeRangeField/SingleInputTimeRangeField.types.ts b/packages/x-date-pickers-pro/src/SingleInputTimeRangeField/SingleInputTimeRangeField.types.ts index aee8a1558ebcc..2145337104a91 100644 --- a/packages/x-date-pickers-pro/src/SingleInputTimeRangeField/SingleInputTimeRangeField.types.ts +++ b/packages/x-date-pickers-pro/src/SingleInputTimeRangeField/SingleInputTimeRangeField.types.ts @@ -2,23 +2,25 @@ import * as React from 'react'; import { SlotComponentProps } from '@mui/base/utils'; import TextField from '@mui/material/TextField'; import { FieldsTextFieldProps } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { UseClearableFieldSlots, UseClearableFieldSlotProps } from '@mui/x-date-pickers/hooks'; import { UseTimeRangeFieldDefaultizedProps, UseTimeRangeFieldProps } from '../internals/models'; -export interface UseSingleInputTimeRangeFieldProps extends UseTimeRangeFieldProps {} +export interface UseSingleInputTimeRangeFieldProps + extends UseTimeRangeFieldProps {} export type UseSingleInputTimeRangeFieldDefaultizedProps< - TDate, + TDate extends PickerValidDate, AdditionalProps extends {}, > = UseTimeRangeFieldDefaultizedProps & AdditionalProps; -export type UseSingleInputTimeRangeFieldComponentProps = Omit< - TChildProps, - keyof UseSingleInputTimeRangeFieldProps -> & +export type UseSingleInputTimeRangeFieldComponentProps< + TDate extends PickerValidDate, + TChildProps extends {}, +> = Omit> & UseSingleInputTimeRangeFieldProps; -export interface SingleInputTimeRangeFieldProps +export interface SingleInputTimeRangeFieldProps extends UseSingleInputTimeRangeFieldComponentProps { /** * Overridable component slots. @@ -32,7 +34,8 @@ export interface SingleInputTimeRangeFieldProps slotProps?: SingleInputTimeRangeFieldSlotProps; } -export type SingleInputTimeRangeFieldOwnerState = SingleInputTimeRangeFieldProps; +export type SingleInputTimeRangeFieldOwnerState = + SingleInputTimeRangeFieldProps; export interface SingleInputTimeRangeFieldSlots extends UseClearableFieldSlots { /** @@ -43,6 +46,7 @@ export interface SingleInputTimeRangeFieldSlots extends UseClearableFieldSlots { textField?: React.ElementType; } -export interface SingleInputTimeRangeFieldSlotProps extends UseClearableFieldSlotProps { +export interface SingleInputTimeRangeFieldSlotProps + extends UseClearableFieldSlotProps { textField?: SlotComponentProps>; } diff --git a/packages/x-date-pickers-pro/src/SingleInputTimeRangeField/useSingleInputTimeRangeField.ts b/packages/x-date-pickers-pro/src/SingleInputTimeRangeField/useSingleInputTimeRangeField.ts index dc016b777afe6..92de900e89e66 100644 --- a/packages/x-date-pickers-pro/src/SingleInputTimeRangeField/useSingleInputTimeRangeField.ts +++ b/packages/x-date-pickers-pro/src/SingleInputTimeRangeField/useSingleInputTimeRangeField.ts @@ -3,6 +3,7 @@ import { useField, splitFieldInternalAndForwardedProps, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { UseSingleInputTimeRangeFieldComponentProps, UseSingleInputTimeRangeFieldDefaultizedProps, @@ -11,7 +12,10 @@ import { import { rangeValueManager, rangeFieldValueManager } from '../internals/utils/valueManagers'; import { validateTimeRange } from '../internals/utils/validation/validateTimeRange'; -export const useDefaultizedTimeRangeFieldProps = ( +export const useDefaultizedTimeRangeFieldProps = < + TDate extends PickerValidDate, + AdditionalProps extends {}, +>( props: UseSingleInputTimeRangeFieldProps, ): UseSingleInputTimeRangeFieldDefaultizedProps => { const utils = useUtils(); @@ -27,7 +31,7 @@ export const useDefaultizedTimeRangeFieldProps = ( +export const useSingleInputTimeRangeField = ( inProps: UseSingleInputTimeRangeFieldComponentProps, ) => { const props = useDefaultizedTimeRangeFieldProps(inProps); diff --git a/packages/x-date-pickers-pro/src/StaticDateRangePicker/StaticDateRangePicker.tsx b/packages/x-date-pickers-pro/src/StaticDateRangePicker/StaticDateRangePicker.tsx index a77cd758fdd81..58ac192fe5c84 100644 --- a/packages/x-date-pickers-pro/src/StaticDateRangePicker/StaticDateRangePicker.tsx +++ b/packages/x-date-pickers-pro/src/StaticDateRangePicker/StaticDateRangePicker.tsx @@ -1,6 +1,7 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import { PickerViewRendererLookup } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { useStaticRangePicker } from '../internals/hooks/useStaticRangePicker'; import { StaticDateRangePickerProps } from './StaticDateRangePicker.types'; import { useDateRangePickerDefaultizedProps } from '../DateRangePicker/shared'; @@ -9,7 +10,7 @@ import { rangeValueManager } from '../internals/utils/valueManagers'; import { validateDateRange } from '../internals/utils/validation/validateDateRange'; import { DateRange } from '../models'; -type StaticDateRangePickerComponent = (( +type StaticDateRangePickerComponent = (( props: StaticDateRangePickerProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -23,10 +24,9 @@ type StaticDateRangePickerComponent = (( * * - [StaticDateRangePicker API](https://mui.com/x/api/date-pickers/static-date-range-picker/) */ -const StaticDateRangePicker = React.forwardRef(function StaticDateRangePicker( - inProps: StaticDateRangePickerProps, - ref: React.Ref, -) { +const StaticDateRangePicker = React.forwardRef(function StaticDateRangePicker< + TDate extends PickerValidDate, +>(inProps: StaticDateRangePickerProps, ref: React.Ref) { const defaultizedProps = useDateRangePickerDefaultizedProps< TDate, StaticDateRangePickerProps @@ -107,7 +107,7 @@ StaticDateRangePicker.propTypes = { * The default value. * Used when the component is not controlled. */ - defaultValue: PropTypes.arrayOf(PropTypes.any), + defaultValue: PropTypes.arrayOf(PropTypes.object), /** * If `true`, after selecting `start` date calendar will not automatically switch to the month of `end` date. * @default false @@ -167,11 +167,11 @@ StaticDateRangePicker.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Callback fired when the value is accepted. * @template TValue The value type. Will be either the same type as `value` or `null`. Can be in `[start, end]` format in case of range value. @@ -228,7 +228,7 @@ StaticDateRangePicker.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * Component rendered on the "day" view when `props.loading` is true. * @returns {React.ReactNode} The node to render when loading. @@ -287,7 +287,7 @@ StaticDateRangePicker.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.arrayOf(PropTypes.any), + value: PropTypes.arrayOf(PropTypes.object), /** * Define custom view renderers for each section. * If `null`, the section will only have field editing. diff --git a/packages/x-date-pickers-pro/src/StaticDateRangePicker/StaticDateRangePicker.types.ts b/packages/x-date-pickers-pro/src/StaticDateRangePicker/StaticDateRangePicker.types.ts index 1f4c529a9ac1e..78406f30dc31c 100644 --- a/packages/x-date-pickers-pro/src/StaticDateRangePicker/StaticDateRangePicker.types.ts +++ b/packages/x-date-pickers-pro/src/StaticDateRangePicker/StaticDateRangePicker.types.ts @@ -1,4 +1,5 @@ import { MakeOptional } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { StaticRangeOnlyPickerProps, UseStaticRangePickerSlots, @@ -10,15 +11,15 @@ import { BaseDateRangePickerSlotProps, } from '../DateRangePicker/shared'; -export interface StaticDateRangePickerSlots +export interface StaticDateRangePickerSlots extends BaseDateRangePickerSlots, UseStaticRangePickerSlots {} -export interface StaticDateRangePickerSlotProps +export interface StaticDateRangePickerSlotProps extends BaseDateRangePickerSlotProps, UseStaticRangePickerSlotProps {} -export interface StaticDateRangePickerProps +export interface StaticDateRangePickerProps extends BaseDateRangePickerProps, MakeOptional { /** diff --git a/packages/x-date-pickers-pro/src/dateRangeViewRenderers/dateRangeViewRenderers.tsx b/packages/x-date-pickers-pro/src/dateRangeViewRenderers/dateRangeViewRenderers.tsx index 5f557b87785ee..7253a0cd14c85 100644 --- a/packages/x-date-pickers-pro/src/dateRangeViewRenderers/dateRangeViewRenderers.tsx +++ b/packages/x-date-pickers-pro/src/dateRangeViewRenderers/dateRangeViewRenderers.tsx @@ -1,9 +1,12 @@ import * as React from 'react'; import { DateOrTimeViewWithMeridiem } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { DateRangeCalendar, DateRangeCalendarProps } from '../DateRangeCalendar'; -export interface DateRangeViewRendererProps - extends Omit, 'views'> { +export interface DateRangeViewRendererProps< + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +> extends Omit, 'views'> { views: readonly TView[]; } @@ -11,7 +14,7 @@ export interface DateRangeViewRendererProps({ +export const renderDateRangeViewCalendar = ({ value, defaultValue, referenceDate, diff --git a/packages/x-date-pickers-pro/src/internals/hooks/models/useRangePicker.ts b/packages/x-date-pickers-pro/src/internals/hooks/models/useRangePicker.ts index a4239295a40e2..9c78331a02851 100644 --- a/packages/x-date-pickers-pro/src/internals/hooks/models/useRangePicker.ts +++ b/packages/x-date-pickers-pro/src/internals/hooks/models/useRangePicker.ts @@ -9,6 +9,7 @@ import { DateOrTimeViewWithMeridiem, ExportedBaseTabsProps, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { ExportedPickersLayoutSlots, ExportedPickersLayoutSlotProps, @@ -21,26 +22,30 @@ import { } from '../useEnrichedRangePickerFieldProps'; import { DateRange } from '../../../models'; -export interface UseRangePickerSlots - extends ExportedPickersLayoutSlots, TDate, TView>, +export interface UseRangePickerSlots< + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +> extends ExportedPickersLayoutSlots, TDate, TView>, RangePickerFieldSlots {} -export interface UseRangePickerSlotProps - extends ExportedPickersLayoutSlotProps, TDate, TView>, +export interface UseRangePickerSlotProps< + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +> extends ExportedPickersLayoutSlotProps, TDate, TView>, RangePickerFieldSlotProps { tabs?: ExportedBaseTabsProps; toolbar?: ExportedBaseToolbarProps; } -export interface RangeOnlyPickerProps +export interface RangeOnlyPickerProps extends BaseNonStaticPickerProps, - UsePickerValueNonStaticProps, + UsePickerValueNonStaticProps, RangeFieldSection>, UsePickerViewsNonStaticProps, BaseRangeNonStaticPickerProps, UseRangePositionProps {} export interface UseRangePickerProps< - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TError, TExternalProps extends UsePickerViewsProps, @@ -52,7 +57,7 @@ export interface RangePickerAdditionalViewProps extends Pick {} export interface UseRangePickerParams< - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TExternalProps extends UseRangePickerProps< TDate, diff --git a/packages/x-date-pickers-pro/src/internals/hooks/useDesktopRangePicker/useDesktopRangePicker.tsx b/packages/x-date-pickers-pro/src/internals/hooks/useDesktopRangePicker/useDesktopRangePicker.tsx index d52fe387b6e7e..b7f2c73c90729 100644 --- a/packages/x-date-pickers-pro/src/internals/hooks/useDesktopRangePicker/useDesktopRangePicker.tsx +++ b/packages/x-date-pickers-pro/src/internals/hooks/useDesktopRangePicker/useDesktopRangePicker.tsx @@ -15,6 +15,7 @@ import { UsePickerValueFieldResponse, ExportedBaseTabsProps, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { DesktopRangePickerAdditionalViewProps, UseDesktopRangePickerParams, @@ -30,7 +31,7 @@ import { useRangePosition } from '../useRangePosition'; const releaseInfo = getReleaseInfo(); export const useDesktopRangePicker = < - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TExternalProps extends UseDesktopRangePickerProps, >({ diff --git a/packages/x-date-pickers-pro/src/internals/hooks/useDesktopRangePicker/useDesktopRangePicker.types.ts b/packages/x-date-pickers-pro/src/internals/hooks/useDesktopRangePicker/useDesktopRangePicker.types.ts index b2fa4f0681e0c..a98872b25d9eb 100644 --- a/packages/x-date-pickers-pro/src/internals/hooks/useDesktopRangePicker/useDesktopRangePicker.types.ts +++ b/packages/x-date-pickers-pro/src/internals/hooks/useDesktopRangePicker/useDesktopRangePicker.types.ts @@ -4,6 +4,7 @@ import { UsePickerViewsProps, DateOrTimeViewWithMeridiem, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { RangeOnlyPickerProps, RangePickerAdditionalViewProps, @@ -13,15 +14,20 @@ import { UseRangePickerSlots, } from '../models/useRangePicker'; -export interface UseDesktopRangePickerSlots - extends UseRangePickerSlots, +export interface UseDesktopRangePickerSlots< + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +> extends UseRangePickerSlots, PickersPopperSlots {} -export interface UseDesktopRangePickerSlotProps - extends UseRangePickerSlotProps, +export interface UseDesktopRangePickerSlotProps< + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +> extends UseRangePickerSlotProps, PickersPopperSlotProps {} -export interface DesktopRangeOnlyPickerProps extends RangeOnlyPickerProps { +export interface DesktopRangeOnlyPickerProps + extends RangeOnlyPickerProps { /** * If `true`, the start `input` element is focused during the first mount. */ @@ -29,7 +35,7 @@ export interface DesktopRangeOnlyPickerProps extends RangeOnlyPickerProps } export interface UseDesktopRangePickerProps< - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TError, TExternalProps extends UsePickerViewsProps, @@ -55,7 +61,7 @@ export interface UseDesktopRangePickerProps< export interface DesktopRangePickerAdditionalViewProps extends RangePickerAdditionalViewProps {} export interface UseDesktopRangePickerParams< - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TExternalProps extends UseDesktopRangePickerProps, > extends UseRangePickerParams< 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 b0b28d35faf27..9fb579a2e3af9 100644 --- a/packages/x-date-pickers-pro/src/internals/hooks/useEnrichedRangePickerFieldProps.ts +++ b/packages/x-date-pickers-pro/src/internals/hooks/useEnrichedRangePickerFieldProps.ts @@ -9,6 +9,7 @@ import { BaseSingleInputFieldProps, FieldSelectedSections, FieldRef, + PickerValidDate, } from '@mui/x-date-pickers/models'; import { UseClearableFieldSlots, UseClearableFieldSlotProps } from '@mui/x-date-pickers/hooks'; import { PickersInputLocaleText } from '@mui/x-date-pickers/locales'; @@ -54,7 +55,8 @@ export interface RangePickerFieldSlots extends UseClearableFieldSlots { textField?: React.ElementType; } -export interface RangePickerFieldSlotProps extends UseClearableFieldSlotProps { +export interface RangePickerFieldSlotProps + extends UseClearableFieldSlotProps { field?: SlotComponentProps< React.ElementType< BaseMultiInputFieldProps, TDate, RangeFieldSection, unknown> @@ -73,7 +75,7 @@ export interface RangePickerFieldSlotProps extends UseClearableFieldSlotP } export interface UseEnrichedRangePickerFieldPropsParams< - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TError, FieldProps extends BaseFieldProps< @@ -105,7 +107,11 @@ export interface UseEnrichedRangePickerFieldPropsParams< onViewChange?: (view: TView) => void; } -const useMultiInputFieldSlotProps = ({ +const useMultiInputFieldSlotProps = < + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, + TError, +>({ wrapperVariant, open, actions, @@ -281,7 +287,11 @@ const useMultiInputFieldSlotProps = ({ +const useSingleInputFieldSlotProps = < + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, + TError, +>({ wrapperVariant, open, actions, @@ -398,7 +408,7 @@ const useSingleInputFieldSlotProps = ( diff --git a/packages/x-date-pickers-pro/src/internals/hooks/useMobileRangePicker/useMobileRangePicker.tsx b/packages/x-date-pickers-pro/src/internals/hooks/useMobileRangePicker/useMobileRangePicker.tsx index 7bb0d98f26d12..7db23cf2c4a4d 100644 --- a/packages/x-date-pickers-pro/src/internals/hooks/useMobileRangePicker/useMobileRangePicker.tsx +++ b/packages/x-date-pickers-pro/src/internals/hooks/useMobileRangePicker/useMobileRangePicker.tsx @@ -13,6 +13,7 @@ import { UsePickerValueFieldResponse, ExportedBaseTabsProps, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import useId from '@mui/utils/useId'; import { MobileRangePickerAdditionalViewProps, @@ -29,7 +30,7 @@ import { useRangePosition } from '../useRangePosition'; const releaseInfo = getReleaseInfo(); export const useMobileRangePicker = < - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TExternalProps extends UseMobileRangePickerProps, >({ diff --git a/packages/x-date-pickers-pro/src/internals/hooks/useMobileRangePicker/useMobileRangePicker.types.ts b/packages/x-date-pickers-pro/src/internals/hooks/useMobileRangePicker/useMobileRangePicker.types.ts index b89b4733e2e26..39235ce0b0d5a 100644 --- a/packages/x-date-pickers-pro/src/internals/hooks/useMobileRangePicker/useMobileRangePicker.types.ts +++ b/packages/x-date-pickers-pro/src/internals/hooks/useMobileRangePicker/useMobileRangePicker.types.ts @@ -4,6 +4,7 @@ import { UsePickerViewsProps, DateOrTimeViewWithMeridiem, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { RangeOnlyPickerProps, RangePickerAdditionalViewProps, @@ -13,18 +14,23 @@ import { UseRangePickerSlots, } from '../models/useRangePicker'; -export interface UseMobileRangePickerSlots - extends UseRangePickerSlots, +export interface UseMobileRangePickerSlots< + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +> extends UseRangePickerSlots, PickersModalDialogSlots {} -export interface UseMobileRangePickerSlotProps - extends UseRangePickerSlotProps, +export interface UseMobileRangePickerSlotProps< + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +> extends UseRangePickerSlotProps, PickersModalDialogSlotProps {} -export interface MobileRangeOnlyPickerProps extends RangeOnlyPickerProps {} +export interface MobileRangeOnlyPickerProps + extends RangeOnlyPickerProps {} export interface UseMobileRangePickerProps< - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TError, TExternalProps extends UsePickerViewsProps, @@ -50,7 +56,7 @@ export interface UseMobileRangePickerProps< export interface MobileRangePickerAdditionalViewProps extends RangePickerAdditionalViewProps {} export interface UseMobileRangePickerParams< - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TExternalProps extends UseMobileRangePickerProps, > extends UseRangePickerParams< diff --git a/packages/x-date-pickers-pro/src/internals/hooks/useMultiInputRangeField/useMultiInputDateRangeField.ts b/packages/x-date-pickers-pro/src/internals/hooks/useMultiInputRangeField/useMultiInputDateRangeField.ts index 082676318eb8b..47088f346682e 100644 --- a/packages/x-date-pickers-pro/src/internals/hooks/useMultiInputRangeField/useMultiInputDateRangeField.ts +++ b/packages/x-date-pickers-pro/src/internals/hooks/useMultiInputRangeField/useMultiInputDateRangeField.ts @@ -13,7 +13,7 @@ import { UseFieldResponse, useControlledValueWithTimezone, } from '@mui/x-date-pickers/internals'; -import { DateValidationError } from '@mui/x-date-pickers/models'; +import { DateValidationError, PickerValidDate } from '@mui/x-date-pickers/models'; import { useDefaultizedDateRangeFieldProps } from '../../../SingleInputDateRangeField/useSingleInputDateRangeField'; import { UseMultiInputDateRangeFieldParams } from '../../../MultiInputDateRangeField/MultiInputDateRangeField.types'; import { @@ -25,7 +25,10 @@ import type { UseMultiInputRangeFieldResponse } from './useMultiInputRangeField. import { DateRangeValidationError, DateRange } from '../../../models'; import { excludeProps } from './shared'; -export const useMultiInputDateRangeField = ({ +export const useMultiInputDateRangeField = < + TDate extends PickerValidDate, + TTextFieldSlotProps extends {}, +>({ sharedProps: inSharedProps, startTextFieldProps, unstableStartFieldRef, @@ -99,10 +102,7 @@ export const useMultiInputDateRangeField = - > = { + const startFieldProps: UseDateFieldComponentProps> = { error: !!validationError[0], ...startTextFieldProps, disabled, @@ -119,10 +119,7 @@ export const useMultiInputDateRangeField = - > = { + const endFieldProps: UseDateFieldComponentProps> = { error: !!validationError[1], ...endTextFieldProps, format, diff --git a/packages/x-date-pickers-pro/src/internals/hooks/useMultiInputRangeField/useMultiInputDateTimeRangeField.ts b/packages/x-date-pickers-pro/src/internals/hooks/useMultiInputRangeField/useMultiInputDateTimeRangeField.ts index 9c182c1d2523d..d398a8b5e1ab5 100644 --- a/packages/x-date-pickers-pro/src/internals/hooks/useMultiInputRangeField/useMultiInputDateTimeRangeField.ts +++ b/packages/x-date-pickers-pro/src/internals/hooks/useMultiInputRangeField/useMultiInputDateTimeRangeField.ts @@ -16,7 +16,7 @@ import { UseFieldResponse, useControlledValueWithTimezone, } from '@mui/x-date-pickers/internals'; -import { DateTimeValidationError } from '@mui/x-date-pickers/models'; +import { DateTimeValidationError, PickerValidDate } from '@mui/x-date-pickers/models'; import type { UseMultiInputDateTimeRangeFieldDefaultizedProps, UseMultiInputDateTimeRangeFieldParams, @@ -31,7 +31,10 @@ import { rangeValueManager } from '../../utils/valueManagers'; import type { UseMultiInputRangeFieldResponse } from './useMultiInputRangeField.types'; import { excludeProps } from './shared'; -export const useDefaultizedDateTimeRangeFieldProps = ( +export const useDefaultizedDateTimeRangeFieldProps = < + TDate extends PickerValidDate, + AdditionalProps extends {}, +>( props: UseMultiInputDateTimeRangeFieldProps, ): UseMultiInputDateTimeRangeFieldDefaultizedProps => { const utils = useUtils(); @@ -55,7 +58,10 @@ export const useDefaultizedDateTimeRangeFieldProps = ({ +export const useMultiInputDateTimeRangeField = < + TDate extends PickerValidDate, + TTextFieldSlotProps extends {}, +>({ sharedProps: inSharedProps, startTextFieldProps, unstableStartFieldRef, @@ -130,7 +136,7 @@ export const useMultiInputDateTimeRangeField = + UseDateTimeFieldDefaultizedProps > = { error: !!validationError[0], ...startTextFieldProps, @@ -149,7 +155,7 @@ export const useMultiInputDateTimeRangeField = + UseDateTimeFieldDefaultizedProps > = { error: !!validationError[1], ...endTextFieldProps, diff --git a/packages/x-date-pickers-pro/src/internals/hooks/useMultiInputRangeField/useMultiInputTimeRangeField.ts b/packages/x-date-pickers-pro/src/internals/hooks/useMultiInputRangeField/useMultiInputTimeRangeField.ts index eab2cd035f40a..8656009ce3f2e 100644 --- a/packages/x-date-pickers-pro/src/internals/hooks/useMultiInputRangeField/useMultiInputTimeRangeField.ts +++ b/packages/x-date-pickers-pro/src/internals/hooks/useMultiInputRangeField/useMultiInputTimeRangeField.ts @@ -14,7 +14,7 @@ import { UseFieldResponse, useControlledValueWithTimezone, } from '@mui/x-date-pickers/internals'; -import { TimeValidationError } from '@mui/x-date-pickers/models'; +import { PickerValidDate, TimeValidationError } from '@mui/x-date-pickers/models'; import { validateTimeRange, TimeRangeComponentValidationProps, @@ -29,7 +29,10 @@ import { rangeValueManager } from '../../utils/valueManagers'; import type { UseMultiInputRangeFieldResponse } from './useMultiInputRangeField.types'; import { excludeProps } from './shared'; -export const useDefaultizedTimeRangeFieldProps = ( +export const useDefaultizedTimeRangeFieldProps = < + TDate extends PickerValidDate, + AdditionalProps extends {}, +>( props: UseMultiInputTimeRangeFieldProps, ): UseMultiInputTimeRangeFieldDefaultizedProps => { const utils = useUtils(); @@ -45,7 +48,10 @@ export const useDefaultizedTimeRangeFieldProps = ({ +export const useMultiInputTimeRangeField = < + TDate extends PickerValidDate, + TTextFieldSlotProps extends {}, +>({ sharedProps: inSharedProps, startTextFieldProps, unstableStartFieldRef, @@ -118,10 +124,7 @@ export const useMultiInputTimeRangeField = - > = { + const startFieldProps: UseTimeFieldComponentProps> = { error: !!validationError[0], ...startTextFieldProps, format, @@ -137,10 +140,7 @@ export const useMultiInputTimeRangeField = - > = { + const endFieldProps: UseTimeFieldComponentProps> = { error: !!validationError[1], ...endTextFieldProps, format, diff --git a/packages/x-date-pickers-pro/src/internals/hooks/useStaticRangePicker/useStaticRangePicker.tsx b/packages/x-date-pickers-pro/src/internals/hooks/useStaticRangePicker/useStaticRangePicker.tsx index f947943079791..75b4ec220d76b 100644 --- a/packages/x-date-pickers-pro/src/internals/hooks/useStaticRangePicker/useStaticRangePicker.tsx +++ b/packages/x-date-pickers-pro/src/internals/hooks/useStaticRangePicker/useStaticRangePicker.tsx @@ -9,6 +9,7 @@ import { ExportedBaseToolbarProps, DateOrTimeViewWithMeridiem, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { UseStaticRangePickerParams, UseStaticRangePickerProps, @@ -28,7 +29,7 @@ const PickerStaticLayout = styled(PickersLayout)(({ theme }) => ({ * - StaticDateRangePicker */ export const useStaticRangePicker = < - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TExternalProps extends UseStaticRangePickerProps, >({ diff --git a/packages/x-date-pickers-pro/src/internals/hooks/useStaticRangePicker/useStaticRangePicker.types.ts b/packages/x-date-pickers-pro/src/internals/hooks/useStaticRangePicker/useStaticRangePicker.types.ts index 51b5459780883..2ff34eabfa9ca 100644 --- a/packages/x-date-pickers-pro/src/internals/hooks/useStaticRangePicker/useStaticRangePicker.types.ts +++ b/packages/x-date-pickers-pro/src/internals/hooks/useStaticRangePicker/useStaticRangePicker.types.ts @@ -6,6 +6,7 @@ import { StaticOnlyPickerProps, DateOrTimeViewWithMeridiem, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { ExportedPickersLayoutSlots, ExportedPickersLayoutSlotProps, @@ -14,18 +15,22 @@ import { DateRange } from '../../../models'; import { UseRangePositionProps } from '../useRangePosition'; import { RangeFieldSection } from '../../models/fields'; -export interface UseStaticRangePickerSlots - extends ExportedPickersLayoutSlots, TDate, TView> {} +export interface UseStaticRangePickerSlots< + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +> extends ExportedPickersLayoutSlots, TDate, TView> {} -export interface UseStaticRangePickerSlotProps - extends ExportedPickersLayoutSlotProps, TDate, TView> { +export interface UseStaticRangePickerSlotProps< + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +> extends ExportedPickersLayoutSlotProps, TDate, TView> { toolbar?: ExportedBaseToolbarProps; } export interface StaticRangeOnlyPickerProps extends StaticOnlyPickerProps, UseRangePositionProps {} export interface UseStaticRangePickerProps< - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TError, TExternalProps extends UseStaticRangePickerProps, @@ -44,7 +49,7 @@ export interface UseStaticRangePickerProps< } export interface UseStaticRangePickerParams< - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TExternalProps extends UseStaticRangePickerProps, > extends Pick< diff --git a/packages/x-date-pickers-pro/src/internals/models/dateRange.ts b/packages/x-date-pickers-pro/src/internals/models/dateRange.ts index 1a31e90846619..422d777db1251 100644 --- a/packages/x-date-pickers-pro/src/internals/models/dateRange.ts +++ b/packages/x-date-pickers-pro/src/internals/models/dateRange.ts @@ -4,13 +4,14 @@ import { MakeOptional, UseFieldInternalProps, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import type { DateRangeValidationError, DateRange } from '../../models'; import { RangeFieldSection } from './fields'; /** * Props used to validate a day value in range pickers. */ -export interface DayRangeValidationProps { +export interface DayRangeValidationProps { /** * Disable specific date. * @@ -35,7 +36,7 @@ export interface BaseRangeProps { disabled?: boolean; } -export interface UseDateRangeFieldProps +export interface UseDateRangeFieldProps extends MakeOptional< UseFieldInternalProps, TDate, RangeFieldSection, DateRangeValidationError>, 'format' @@ -44,7 +45,7 @@ export interface UseDateRangeFieldProps BaseDateValidationProps, BaseRangeProps {} -export type UseDateRangeFieldDefaultizedProps = DefaultizedProps< +export type UseDateRangeFieldDefaultizedProps = DefaultizedProps< UseDateRangeFieldProps, keyof BaseDateValidationProps | 'format' >; diff --git a/packages/x-date-pickers-pro/src/internals/models/dateTimeRange.ts b/packages/x-date-pickers-pro/src/internals/models/dateTimeRange.ts index 25903be03bd72..3ed96dab9e6bd 100644 --- a/packages/x-date-pickers-pro/src/internals/models/dateTimeRange.ts +++ b/packages/x-date-pickers-pro/src/internals/models/dateTimeRange.ts @@ -7,11 +7,12 @@ import { DateTimeValidationProps, DateOrTimeViewWithMeridiem, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { BaseRangeProps, DayRangeValidationProps } from './dateRange'; import { DateTimeRangeValidationError, DateRange } from '../../models'; import { RangeFieldSection } from './fields'; -export interface UseDateTimeRangeFieldProps +export interface UseDateTimeRangeFieldProps extends MakeOptional< UseFieldInternalProps< DateRange, @@ -33,7 +34,7 @@ export interface UseDateTimeRangeFieldProps ampm?: boolean; } -export type UseDateTimeRangeFieldDefaultizedProps = DefaultizedProps< +export type UseDateTimeRangeFieldDefaultizedProps = DefaultizedProps< UseDateTimeRangeFieldProps, keyof BaseDateValidationProps | 'format' | 'disableIgnoringDatePartForTimeValidation' >; diff --git a/packages/x-date-pickers-pro/src/internals/models/fields.ts b/packages/x-date-pickers-pro/src/internals/models/fields.ts index 2810560c95174..893c4484c6da9 100644 --- a/packages/x-date-pickers-pro/src/internals/models/fields.ts +++ b/packages/x-date-pickers-pro/src/internals/models/fields.ts @@ -1,7 +1,7 @@ import * as React from 'react'; import { SlotComponentProps } from '@mui/base/utils'; import { BaseFieldProps, FieldsTextFieldProps } from '@mui/x-date-pickers/internals'; -import { FieldSection, FieldRef } from '@mui/x-date-pickers/models'; +import { FieldSection, FieldRef, PickerValidDate } from '@mui/x-date-pickers/models'; export interface RangeFieldSection extends FieldSection { dateName: 'start' | 'end'; @@ -40,8 +40,12 @@ export interface MultiInputFieldRefs { * Props the multi input field can receive when used inside a picker. * Only contains what the MUI component are passing to the field, not what users can pass using the `props.slotProps.field`. */ -export interface BaseMultiInputFieldProps - extends BaseFieldProps, +export interface BaseMultiInputFieldProps< + TValue, + TDate extends PickerValidDate, + TSection extends FieldSection, + TError, +> extends BaseFieldProps, MultiInputFieldRefs { slots?: { root?: React.ElementType; diff --git a/packages/x-date-pickers-pro/src/internals/models/timeRange.ts b/packages/x-date-pickers-pro/src/internals/models/timeRange.ts index fa99290d503a3..9ec9db5c39232 100644 --- a/packages/x-date-pickers-pro/src/internals/models/timeRange.ts +++ b/packages/x-date-pickers-pro/src/internals/models/timeRange.ts @@ -5,11 +5,12 @@ import { MakeOptional, UseFieldInternalProps, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { TimeRangeValidationError, DateRange } from '../../models'; import { BaseRangeProps } from './dateRange'; import { RangeFieldSection } from './fields'; -export interface UseTimeRangeFieldProps +export interface UseTimeRangeFieldProps extends MakeOptional< UseFieldInternalProps, TDate, RangeFieldSection, TimeRangeValidationError>, 'format' @@ -24,7 +25,7 @@ export interface UseTimeRangeFieldProps ampm?: boolean; } -export type UseTimeRangeFieldDefaultizedProps = DefaultizedProps< +export type UseTimeRangeFieldDefaultizedProps = DefaultizedProps< UseTimeRangeFieldProps, keyof BaseTimeValidationProps | 'format' >; diff --git a/packages/x-date-pickers-pro/src/internals/utils/date-range-manager.ts b/packages/x-date-pickers-pro/src/internals/utils/date-range-manager.ts index 8470c59ccb44d..bc3eb99ca75cc 100644 --- a/packages/x-date-pickers-pro/src/internals/utils/date-range-manager.ts +++ b/packages/x-date-pickers-pro/src/internals/utils/date-range-manager.ts @@ -1,8 +1,8 @@ -import { MuiPickersAdapter } from '@mui/x-date-pickers/models'; +import { MuiPickersAdapter, PickerValidDate } from '@mui/x-date-pickers/models'; import { mergeDateAndTime } from '@mui/x-date-pickers/internals'; import { DateRange, RangePosition } from '../../models'; -interface CalculateRangeChangeOptions { +interface CalculateRangeChangeOptions { utils: MuiPickersAdapter; range: DateRange; newDate: TDate | null; @@ -16,12 +16,12 @@ interface CalculateRangeChangeOptions { shouldMergeDateAndTime?: boolean; } -interface CalculateRangeChangeResponse { +interface CalculateRangeChangeResponse { nextSelection: RangePosition; newRange: DateRange; } -export function calculateRangeChange({ +export function calculateRangeChange({ utils, range, newDate: selectedDate, @@ -58,7 +58,7 @@ export function calculateRangeChange({ : { nextSelection: 'start', newRange: [start, selectedDate] }; } -export function calculateRangePreview( +export function calculateRangePreview( options: CalculateRangeChangeOptions, ): DateRange { if (options.newDate == null) { diff --git a/packages/x-date-pickers-pro/src/internals/utils/date-utils.ts b/packages/x-date-pickers-pro/src/internals/utils/date-utils.ts index e69cea142837b..1d35d15cf6676 100644 --- a/packages/x-date-pickers-pro/src/internals/utils/date-utils.ts +++ b/packages/x-date-pickers-pro/src/internals/utils/date-utils.ts @@ -1,14 +1,14 @@ -import { MuiPickersAdapter } from '@mui/x-date-pickers/models'; +import { MuiPickersAdapter, PickerValidDate } from '@mui/x-date-pickers/models'; import { DateRange, NonEmptyDateRange } from '../../models'; -export const isRangeValid = ( +export const isRangeValid = ( utils: MuiPickersAdapter, range: DateRange | null, ): range is NonEmptyDateRange => { return Boolean(range && range[0] && range[1] && !utils.isBefore(range[1], range[0])); }; -export const isWithinRange = ( +export const isWithinRange = ( utils: MuiPickersAdapter, day: TDate, range: DateRange | null, @@ -16,7 +16,7 @@ export const isWithinRange = ( return isRangeValid(utils, range) && utils.isWithinRange(day, range); }; -export const isStartOfRange = ( +export const isStartOfRange = ( utils: MuiPickersAdapter, day: TDate, range: DateRange | null, @@ -24,7 +24,7 @@ export const isStartOfRange = ( return isRangeValid(utils, range) && utils.isSameDay(day, range[0]!); }; -export const isEndOfRange = ( +export const isEndOfRange = ( utils: MuiPickersAdapter, day: TDate, range: DateRange | null, diff --git a/packages/x-date-pickers-pro/src/internals/utils/validation/validateDateRange.ts b/packages/x-date-pickers-pro/src/internals/utils/validation/validateDateRange.ts index 6609ced6e8bfb..c0304ff0b9de8 100644 --- a/packages/x-date-pickers-pro/src/internals/utils/validation/validateDateRange.ts +++ b/packages/x-date-pickers-pro/src/internals/utils/validation/validateDateRange.ts @@ -1,4 +1,4 @@ -import { TimezoneProps } from '@mui/x-date-pickers/models'; +import { PickerValidDate, TimezoneProps } from '@mui/x-date-pickers/models'; import { Validator, validateDate, @@ -9,7 +9,7 @@ import { isRangeValid } from '../date-utils'; import { DayRangeValidationProps } from '../../models'; import { DateRangeValidationError, DateRange } from '../../../models'; -export interface DateRangeComponentValidationProps +export interface DateRangeComponentValidationProps extends DayRangeValidationProps, Required>, DefaultizedProps {} diff --git a/packages/x-date-pickers-pro/src/internals/utils/validation/validateDateTimeRange.ts b/packages/x-date-pickers-pro/src/internals/utils/validation/validateDateTimeRange.ts index ec00ad04da6d9..2eae3041a2e4a 100644 --- a/packages/x-date-pickers-pro/src/internals/utils/validation/validateDateTimeRange.ts +++ b/packages/x-date-pickers-pro/src/internals/utils/validation/validateDateTimeRange.ts @@ -1,4 +1,4 @@ -import { TimezoneProps } from '@mui/x-date-pickers/models'; +import { PickerValidDate, TimezoneProps } from '@mui/x-date-pickers/models'; import { Validator, validateDateTime, @@ -10,7 +10,7 @@ import { isRangeValid } from '../date-utils'; import { DayRangeValidationProps } from '../../models/dateRange'; import { DateTimeRangeValidationError, DateRange } from '../../../models'; -export interface DateTimeRangeComponentValidationProps +export interface DateTimeRangeComponentValidationProps extends DayRangeValidationProps, TimeValidationProps, Required>, diff --git a/packages/x-date-pickers-pro/src/internals/utils/valueManagers.ts b/packages/x-date-pickers-pro/src/internals/utils/valueManagers.ts index daddcdee38e91..82649345b5d47 100644 --- a/packages/x-date-pickers-pro/src/internals/utils/valueManagers.ts +++ b/packages/x-date-pickers-pro/src/internals/utils/valueManagers.ts @@ -8,6 +8,7 @@ import { getTodayDate, getDefaultReferenceDate, } from '@mui/x-date-pickers/internals'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { splitDateRangeSections, removeLastSeparator } from './date-fields-utils'; import type { DateRangeValidationError, @@ -20,7 +21,7 @@ import { RangeFieldSection } from '../models/fields'; export type RangePickerValueManager< TValue = [any, any], - TDate = any, + TDate extends PickerValidDate = any, TError extends | DateRangeValidationError | TimeRangeValidationError diff --git a/packages/x-date-pickers-pro/src/models/range.ts b/packages/x-date-pickers-pro/src/models/range.ts index 3fefdb333b221..92bbff21e1d17 100644 --- a/packages/x-date-pickers-pro/src/models/range.ts +++ b/packages/x-date-pickers-pro/src/models/range.ts @@ -1,5 +1,7 @@ -export type DateRange = [TDate | null, TDate | null]; +import { PickerValidDate } from '@mui/x-date-pickers/models'; -export type NonEmptyDateRange = [TDate, TDate]; +export type DateRange = [TDate | null, TDate | null]; + +export type NonEmptyDateRange = [TDate, TDate]; export type RangePosition = 'start' | 'end'; diff --git a/packages/x-date-pickers-pro/src/themeAugmentation/props.d.ts b/packages/x-date-pickers-pro/src/themeAugmentation/props.d.ts index 00e1c345620b3..c43cf07e5baa0 100644 --- a/packages/x-date-pickers-pro/src/themeAugmentation/props.d.ts +++ b/packages/x-date-pickers-pro/src/themeAugmentation/props.d.ts @@ -1,8 +1,8 @@ +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { DateRangePickerDayProps } from '../DateRangePickerDay'; import { MultiInputDateRangeFieldProps } from '../MultiInputDateRangeField/MultiInputDateRangeField.types'; import { SingleInputDateRangeFieldProps } from '../SingleInputDateRangeField/SingleInputDateRangeField.types'; import { DateRangeCalendarProps } from '../DateRangeCalendar'; - import { DateRangePickerProps, DateRangePickerToolbarProps } from '../DateRangePicker'; import { DesktopDateRangePickerProps } from '../DesktopDateRangePicker'; import { MobileDateRangePickerProps } from '../MobileDateRangePicker'; @@ -18,32 +18,32 @@ import { ExportedDateTimeRangePickerTabsProps } from '../DateTimeRangePicker/Dat import { ExportedDateTimeRangePickerToolbarProps } from '../DateTimeRangePicker/DateTimeRangePickerToolbar'; export interface PickersProComponentsPropsList { - MuiDateRangeCalendar: DateRangeCalendarProps; - MuiDateRangePickerDay: DateRangePickerDayProps; + MuiDateRangeCalendar: DateRangeCalendarProps; + MuiDateRangePickerDay: DateRangePickerDayProps; MuiDateTimeRangePickerTabs: ExportedDateTimeRangePickerTabsProps; - MuiDateRangePickerToolbar: DateRangePickerToolbarProps; + MuiDateRangePickerToolbar: DateRangePickerToolbarProps; MuiDateTimeRangePickerToolbar: ExportedDateTimeRangePickerToolbarProps; // Multi input range fields - MuiMultiInputDateRangeField: MultiInputDateRangeFieldProps; - MuiMultiInputDateTimeRangeField: MultiInputDateTimeRangeFieldProps; - MuiMultiInputTimeRangeField: MultiInputTimeRangeFieldProps; + MuiMultiInputDateRangeField: MultiInputDateRangeFieldProps; + MuiMultiInputDateTimeRangeField: MultiInputDateTimeRangeFieldProps; + MuiMultiInputTimeRangeField: MultiInputTimeRangeFieldProps; // Single input range fields - MuiSingleInputDateRangeField: SingleInputDateRangeFieldProps; - MuiSingleInputDateTimeRangeField: SingleInputDateTimeRangeFieldProps; - MuiSingleInputTimeRangeField: SingleInputTimeRangeFieldProps; + MuiSingleInputDateRangeField: SingleInputDateRangeFieldProps; + MuiSingleInputDateTimeRangeField: SingleInputDateTimeRangeFieldProps; + MuiSingleInputTimeRangeField: SingleInputTimeRangeFieldProps; // Date Range Pickers - MuiDateRangePicker: DateRangePickerProps; - MuiDesktopDateRangePicker: DesktopDateRangePickerProps; - MuiMobileDateRangePicker: MobileDateRangePickerProps; - MuiStaticDateRangePicker: StaticDateRangePickerProps; + MuiDateRangePicker: DateRangePickerProps; + MuiDesktopDateRangePicker: DesktopDateRangePickerProps; + MuiMobileDateRangePicker: MobileDateRangePickerProps; + MuiStaticDateRangePicker: StaticDateRangePickerProps; // Date Time Range Pickers - MuiDateTimeRangePicker: DateTimeRangePickerProps; - MuiDesktopDateTimeRangePicker: DesktopDateTimeRangePickerProps; - MuiMobileDateTimeRangePicker: MobileDateTimeRangePickerProps; + MuiDateTimeRangePicker: DateTimeRangePickerProps; + MuiDesktopDateTimeRangePicker: DesktopDateTimeRangePickerProps; + MuiMobileDateTimeRangePicker: MobileDateTimeRangePickerProps; } declare module '@mui/material/styles' { diff --git a/packages/x-date-pickers/src/AdapterDateFnsBase/AdapterDateFnsBase.ts b/packages/x-date-pickers/src/AdapterDateFnsBase/AdapterDateFnsBase.ts index 2207845c9cf38..a24b3a69e7d14 100644 --- a/packages/x-date-pickers/src/AdapterDateFnsBase/AdapterDateFnsBase.ts +++ b/packages/x-date-pickers/src/AdapterDateFnsBase/AdapterDateFnsBase.ts @@ -117,6 +117,12 @@ type DateFnsAdapterBaseOptions = MakeRe longFormatters: Record<'p' | 'P', (token: string, formatLong: any) => string>; }; +declare module '@mui/x-date-pickers/models' { + interface PickerValidDateLookup { + 'date-fns': Date; + } +} + /** * Based on `@date-io/date-fns` * diff --git a/packages/x-date-pickers/src/AdapterDateFnsJalali/AdapterDateFnsJalali.ts b/packages/x-date-pickers/src/AdapterDateFnsJalali/AdapterDateFnsJalali.ts index c8526d7bfeaed..7b1e651d6c5d2 100644 --- a/packages/x-date-pickers/src/AdapterDateFnsJalali/AdapterDateFnsJalali.ts +++ b/packages/x-date-pickers/src/AdapterDateFnsJalali/AdapterDateFnsJalali.ts @@ -159,6 +159,12 @@ const NUMBER_SYMBOL_MAP = { '0': 'Û°', }; +declare module '@mui/x-date-pickers/models' { + interface PickerValidDateLookup { + 'date-fns-jalali': Date; + } +} + /** * Based on `@date-io/date-fns-jalali` * diff --git a/packages/x-date-pickers/src/AdapterDayjs/AdapterDayjs.ts b/packages/x-date-pickers/src/AdapterDayjs/AdapterDayjs.ts index 853b72d4edf1a..667b7eb3ea642 100644 --- a/packages/x-date-pickers/src/AdapterDayjs/AdapterDayjs.ts +++ b/packages/x-date-pickers/src/AdapterDayjs/AdapterDayjs.ts @@ -111,6 +111,12 @@ const MISSING_TIMEZONE_PLUGIN = [ const withLocale = (dayjs: any, locale?: string): Constructor => !locale ? dayjs : (...args) => dayjs(...args).locale(locale); +declare module '@mui/x-date-pickers/models' { + interface PickerValidDateLookup { + dayjs: Dayjs; + } +} + /** * Based on `@date-io/dayjs` * diff --git a/packages/x-date-pickers/src/AdapterLuxon/AdapterLuxon.ts b/packages/x-date-pickers/src/AdapterLuxon/AdapterLuxon.ts index ee8f9a56ac027..295db06c32f41 100644 --- a/packages/x-date-pickers/src/AdapterLuxon/AdapterLuxon.ts +++ b/packages/x-date-pickers/src/AdapterLuxon/AdapterLuxon.ts @@ -83,6 +83,12 @@ const defaultFormats: AdapterFormats = { keyboardDateTime24h: 'D T', }; +declare module '@mui/x-date-pickers/models' { + interface PickerValidDateLookup { + luxon: DateTime; + } +} + /** * Based on `@date-io/luxon` * diff --git a/packages/x-date-pickers/src/AdapterMoment/AdapterMoment.ts b/packages/x-date-pickers/src/AdapterMoment/AdapterMoment.ts index 0a1cca168e1d1..e7b610d466b65 100644 --- a/packages/x-date-pickers/src/AdapterMoment/AdapterMoment.ts +++ b/packages/x-date-pickers/src/AdapterMoment/AdapterMoment.ts @@ -88,6 +88,12 @@ const MISSING_TIMEZONE_PLUGIN = [ 'Find more information on https://mui.com/x/react-date-pickers/timezone/#moment-and-timezone', ].join('\n'); +declare module '@mui/x-date-pickers/models' { + interface PickerValidDateLookup { + moment: Moment; + } +} + /** * Based on `@date-io/moment` * diff --git a/packages/x-date-pickers/src/AdapterMomentHijri/AdapterMomentHijri.ts b/packages/x-date-pickers/src/AdapterMomentHijri/AdapterMomentHijri.ts index f11f166c6b104..a9f102f755b20 100644 --- a/packages/x-date-pickers/src/AdapterMomentHijri/AdapterMomentHijri.ts +++ b/packages/x-date-pickers/src/AdapterMomentHijri/AdapterMomentHijri.ts @@ -86,6 +86,12 @@ const NUMBER_SYMBOL_MAP = { '0': 'Ù ', }; +declare module '@mui/x-date-pickers/models' { + interface PickerValidDateLookup { + 'moment-hijri': Moment; + } +} + /** * Based on `@date-io/hijri` * diff --git a/packages/x-date-pickers/src/AdapterMomentJalaali/AdapterMomentJalaali.ts b/packages/x-date-pickers/src/AdapterMomentJalaali/AdapterMomentJalaali.ts index ca6cc0ed5301b..3ec4415dcb04f 100644 --- a/packages/x-date-pickers/src/AdapterMomentJalaali/AdapterMomentJalaali.ts +++ b/packages/x-date-pickers/src/AdapterMomentJalaali/AdapterMomentJalaali.ts @@ -85,6 +85,12 @@ const NUMBER_SYMBOL_MAP = { '0': 'Û°', }; +declare module '@mui/x-date-pickers/models' { + interface PickerValidDateLookup { + 'moment-jalaali': Moment; + } +} + /** * Based on `@date-io/jalaali` * diff --git a/packages/x-date-pickers/src/DateCalendar/DateCalendar.tsx b/packages/x-date-pickers/src/DateCalendar/DateCalendar.tsx index 03ae7b7622433..b708479f8f8cd 100644 --- a/packages/x-date-pickers/src/DateCalendar/DateCalendar.tsx +++ b/packages/x-date-pickers/src/DateCalendar/DateCalendar.tsx @@ -29,6 +29,7 @@ import { BaseDateValidationProps } from '../internals/models/validation'; import { useControlledValueWithTimezone } from '../internals/hooks/useValueWithTimezone'; import { singleItemValueManager } from '../internals/utils/valueManagers'; import { VIEW_HEIGHT } from '../internals/constants/dimensions'; +import { PickerValidDate } from '../models'; const useUtilityClasses = (ownerState: DateCalendarProps) => { const { classes } = ownerState; @@ -40,7 +41,7 @@ const useUtilityClasses = (ownerState: DateCalendarProps) => { return composeClasses(slots, getDateCalendarUtilityClass, classes); }; -function useDateCalendarDefaultizedProps( +function useDateCalendarDefaultizedProps( props: DateCalendarProps, name: string, ): DateCalendarDefaultizedProps { @@ -83,7 +84,7 @@ const DateCalendarViewTransitionContainer = styled(PickersFadeTransitionGroup, { overridesResolver: (props, styles) => styles.viewTransitionContainer, })<{ ownerState: DateCalendarProps }>({}); -type DateCalendarComponent = (( +type DateCalendarComponent = (( props: DateCalendarProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -98,7 +99,7 @@ type DateCalendarComponent = (( * * - [DateCalendar API](https://mui.com/x/api/date-pickers/date-calendar/) */ -export const DateCalendar = React.forwardRef(function DateCalendar( +export const DateCalendar = React.forwardRef(function DateCalendar( inProps: DateCalendarProps, ref: React.Ref, ) { @@ -430,7 +431,7 @@ DateCalendar.propTypes = { * The default selected value. * Used when the component is not controlled. */ - defaultValue: PropTypes.any, + defaultValue: PropTypes.object, /** * If `true`, the picker and text field are disabled. * @default false @@ -474,11 +475,11 @@ DateCalendar.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Months rendered per row. * @default 3 @@ -538,7 +539,7 @@ DateCalendar.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid date using the validation props, except callbacks such as `shouldDisableDate`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * Component displaying when passed `loading` true. * @returns {React.ReactNode} The node to render when loading. @@ -610,7 +611,7 @@ DateCalendar.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.any, + value: PropTypes.object, /** * The visible view. * Used when the component view is controlled. diff --git a/packages/x-date-pickers/src/DateCalendar/DateCalendar.types.ts b/packages/x-date-pickers/src/DateCalendar/DateCalendar.types.ts index b02d1ffc027b4..fec30c35f9302 100644 --- a/packages/x-date-pickers/src/DateCalendar/DateCalendar.types.ts +++ b/packages/x-date-pickers/src/DateCalendar/DateCalendar.types.ts @@ -17,12 +17,12 @@ import { DayValidationProps, } from '../internals/models/validation'; import { ExportedUseViewsOptions } from '../internals/hooks/useViews'; -import { DateView, TimezoneProps } from '../models'; +import { DateView, PickerValidDate, TimezoneProps } from '../models'; import { DefaultizedProps } from '../internals/models/helpers'; import { ExportedYearCalendarProps } from '../YearCalendar/YearCalendar.types'; import { ExportedMonthCalendarProps } from '../MonthCalendar/MonthCalendar.types'; -export interface DateCalendarSlots +export interface DateCalendarSlots extends PickersCalendarHeaderSlots, DayCalendarSlots { /** @@ -33,13 +33,13 @@ export interface DateCalendarSlots calendarHeader?: React.ElementType>; } -export interface DateCalendarSlotProps +export interface DateCalendarSlotProps extends PickersCalendarHeaderSlotProps, DayCalendarSlotProps { calendarHeader?: SlotComponentProps>; } -export interface ExportedDateCalendarProps +export interface ExportedDateCalendarProps extends ExportedDayCalendarProps, ExportedMonthCalendarProps, ExportedYearCalendarProps, @@ -83,7 +83,7 @@ export interface ExportedDateCalendarProps onMonthChange?: (month: TDate) => void; } -export interface DateCalendarProps +export interface DateCalendarProps extends ExportedDateCalendarProps, ExportedUseViewsOptions { /** @@ -119,7 +119,7 @@ export interface DateCalendarProps slotProps?: DateCalendarSlotProps; } -export type DateCalendarDefaultizedProps = DefaultizedProps< +export type DateCalendarDefaultizedProps = DefaultizedProps< DateCalendarProps, | 'views' | 'openTo' diff --git a/packages/x-date-pickers/src/DateCalendar/DayCalendar.tsx b/packages/x-date-pickers/src/DateCalendar/DayCalendar.tsx index 45b1a8fe727c3..e388c1590632b 100644 --- a/packages/x-date-pickers/src/DateCalendar/DayCalendar.tsx +++ b/packages/x-date-pickers/src/DateCalendar/DayCalendar.tsx @@ -26,10 +26,10 @@ import { import { useIsDateDisabled } from './useIsDateDisabled'; import { findClosestEnabledDate, getWeekdays } from '../internals/utils/date-utils'; import { DayCalendarClasses, getDayCalendarUtilityClass } from './dayCalendarClasses'; -import { TimezoneProps } from '../models'; +import { PickerValidDate, TimezoneProps } from '../models'; import { DefaultizedProps } from '../internals/models/helpers'; -export interface DayCalendarSlots { +export interface DayCalendarSlots { /** * Custom component for day. * Check the [PickersDay](https://mui.com/x/api/date-pickers/pickers-day/) component. @@ -38,7 +38,7 @@ export interface DayCalendarSlots { day?: React.ElementType>; } -export interface DayCalendarSlotProps { +export interface DayCalendarSlotProps { day?: SlotComponentProps< typeof PickersDay, {}, @@ -46,7 +46,8 @@ export interface DayCalendarSlotProps { >; } -export interface ExportedDayCalendarProps extends ExportedPickersDayProps { +export interface ExportedDayCalendarProps + extends ExportedPickersDayProps { /** * If `true`, calls `renderLoading` instead of rendering the day calendar. * Can be used to preload information and show it in calendar. @@ -78,7 +79,7 @@ export interface ExportedDayCalendarProps extends ExportedPickersDayProps fixedWeekNumber?: number; } -export interface DayCalendarProps +export interface DayCalendarProps extends ExportedDayCalendarProps, DayValidationProps, MonthValidationProps, @@ -232,7 +233,7 @@ const PickersCalendarWeek = styled('div', { justifyContent: 'center', }); -function WrappedDay({ +function WrappedDay({ parentProps, day, focusableDay, @@ -331,7 +332,7 @@ function WrappedDay({ /** * @ignore - do not document. */ -export function DayCalendar(inProps: DayCalendarProps) { +export function DayCalendar(inProps: DayCalendarProps) { const props = useThemeProps({ props: inProps, name: 'MuiDayCalendar' }); const utils = useUtils(); diff --git a/packages/x-date-pickers/src/DateCalendar/tests/validation.DateCalendar.test.tsx b/packages/x-date-pickers/src/DateCalendar/tests/validation.DateCalendar.test.tsx index 9940b97e3d9d4..74eaafe5cfaa3 100644 --- a/packages/x-date-pickers/src/DateCalendar/tests/validation.DateCalendar.test.tsx +++ b/packages/x-date-pickers/src/DateCalendar/tests/validation.DateCalendar.test.tsx @@ -2,9 +2,10 @@ import * as React from 'react'; import { expect } from 'chai'; import { screen, fireEvent } from '@mui-internal/test-utils'; import { DateCalendar, DateCalendarProps } from '@mui/x-date-pickers/DateCalendar'; +import { PickerValidDate } from '@mui/x-date-pickers/models'; import { createPickerRenderer, adapterToUse } from 'test/utils/pickers'; -function WrappedDateCalendar( +function WrappedDateCalendar( props: Omit, 'value' | 'onChange'> & { initialValue: TDate }, ) { const { initialValue, ...other } = props; diff --git a/packages/x-date-pickers/src/DateCalendar/useCalendarState.tsx b/packages/x-date-pickers/src/DateCalendar/useCalendarState.tsx index eebe2fede5ad9..5da5597f0f0c8 100644 --- a/packages/x-date-pickers/src/DateCalendar/useCalendarState.tsx +++ b/packages/x-date-pickers/src/DateCalendar/useCalendarState.tsx @@ -3,12 +3,12 @@ import useEventCallback from '@mui/utils/useEventCallback'; import { SlideDirection } from './PickersSlideTransition'; import { useIsDateDisabled } from './useIsDateDisabled'; import { useUtils } from '../internals/hooks/useUtils'; -import { MuiPickersAdapter, PickersTimezone } from '../models'; +import { MuiPickersAdapter, PickersTimezone, PickerValidDate } from '../models'; import { DateCalendarDefaultizedProps } from './DateCalendar.types'; import { singleItemValueManager } from '../internals/utils/valueManagers'; import { SECTION_TYPE_GRANULARITY } from '../internals/utils/getDefaultReferenceDate'; -interface CalendarState { +interface CalendarState { currentMonth: TDate; focusedDay: TDate | null; isMonthSwitchingAnimating: boolean; @@ -17,12 +17,12 @@ interface CalendarState { type ReducerAction = { type: TType } & TAdditional; -interface ChangeMonthPayload { +interface ChangeMonthPayload { direction: SlideDirection; newMonth: TDate; } -interface ChangeFocusedDayPayload { +interface ChangeFocusedDayPayload { focusedDay: TDate | null; /** * The update does not trigger month switching animation. @@ -32,7 +32,7 @@ interface ChangeFocusedDayPayload { } export const createCalendarStateReducer = - ( + ( reduceAnimations: boolean, disableSwitchToMonthOnDayFocus: boolean, utils: MuiPickersAdapter, @@ -93,7 +93,7 @@ export const createCalendarStateReducer = } }; -interface UseCalendarStateParams +interface UseCalendarStateParams extends Pick< DateCalendarDefaultizedProps, | 'value' @@ -110,7 +110,9 @@ interface UseCalendarStateParams timezone: PickersTimezone; } -export const useCalendarState = (params: UseCalendarStateParams) => { +export const useCalendarState = ( + params: UseCalendarStateParams, +) => { const { value, referenceDate: referenceDateProp, diff --git a/packages/x-date-pickers/src/DateCalendar/useIsDateDisabled.ts b/packages/x-date-pickers/src/DateCalendar/useIsDateDisabled.ts index 0375516f4e953..7fbde8e847724 100644 --- a/packages/x-date-pickers/src/DateCalendar/useIsDateDisabled.ts +++ b/packages/x-date-pickers/src/DateCalendar/useIsDateDisabled.ts @@ -4,8 +4,9 @@ import { validateDate, } from '../internals/utils/validation/validateDate'; import { useLocalizationContext } from '../internals/hooks/useUtils'; +import { PickerValidDate } from '../models'; -export const useIsDateDisabled = ({ +export const useIsDateDisabled = ({ shouldDisableDate, shouldDisableMonth, shouldDisableYear, diff --git a/packages/x-date-pickers/src/DateField/DateField.tsx b/packages/x-date-pickers/src/DateField/DateField.tsx index f654d9db925b1..cf4218512439d 100644 --- a/packages/x-date-pickers/src/DateField/DateField.tsx +++ b/packages/x-date-pickers/src/DateField/DateField.tsx @@ -8,8 +8,9 @@ import { DateFieldProps, DateFieldSlotProps } from './DateField.types'; import { useDateField } from './useDateField'; import { useClearableField } from '../hooks'; import { convertFieldResponseIntoMuiTextFieldProps } from '../internals/utils/convertFieldResponseIntoMuiTextFieldProps'; +import { PickerValidDate } from '../models'; -type DateFieldComponent = (( +type DateFieldComponent = (( props: DateFieldProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -23,7 +24,7 @@ type DateFieldComponent = (( * * - [DateField API](https://mui.com/x/api/date-pickers/date-field/) */ -const DateField = React.forwardRef(function DateField( +const DateField = React.forwardRef(function DateField( inProps: DateFieldProps, inRef: React.Ref, ) { @@ -95,7 +96,7 @@ DateField.propTypes = { /** * The default value. Use when the component is not controlled. */ - defaultValue: PropTypes.any, + defaultValue: PropTypes.object, /** * If `true`, the component is disabled. * @default false @@ -182,11 +183,11 @@ DateField.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Name attribute of the `input` element. */ @@ -229,7 +230,7 @@ DateField.propTypes = { * For example, on time fields it will be used to determine the date to set. * @default The closest valid date using the validation props, except callbacks such as `shouldDisableDate`. Value is rounded to the most granular section used. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * If `true`, the label is displayed as required and the `input` element is required. * @default false @@ -341,7 +342,7 @@ DateField.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.any, + value: PropTypes.object, /** * The variant to use. * @default 'outlined' diff --git a/packages/x-date-pickers/src/DateField/DateField.types.ts b/packages/x-date-pickers/src/DateField/DateField.types.ts index 2b358fd2cb153..51a00deb3a8ab 100644 --- a/packages/x-date-pickers/src/DateField/DateField.types.ts +++ b/packages/x-date-pickers/src/DateField/DateField.types.ts @@ -2,7 +2,7 @@ import * as React from 'react'; import { SlotComponentProps } from '@mui/base/utils'; import TextField from '@mui/material/TextField'; import { UseClearableFieldSlots, UseClearableFieldSlotProps } from '../hooks/useClearableField'; -import { DateValidationError, FieldSection } from '../models'; +import { DateValidationError, FieldSection, PickerValidDate } from '../models'; import { UseFieldInternalProps } from '../internals/hooks/useField'; import { DefaultizedProps, MakeOptional } from '../internals/models/helpers'; import { @@ -13,7 +13,7 @@ import { } from '../internals/models/validation'; import { FieldsTextFieldProps } from '../internals/models/fields'; -export interface UseDateFieldProps +export interface UseDateFieldProps extends MakeOptional< UseFieldInternalProps, 'format' @@ -23,18 +23,17 @@ export interface UseDateFieldProps YearValidationProps, BaseDateValidationProps {} -export type UseDateFieldDefaultizedProps = DefaultizedProps< +export type UseDateFieldDefaultizedProps = DefaultizedProps< UseDateFieldProps, keyof BaseDateValidationProps | 'format' >; -export type UseDateFieldComponentProps = Omit< - TChildProps, - keyof UseDateFieldProps -> & - UseDateFieldProps; +export type UseDateFieldComponentProps< + TDate extends PickerValidDate, + TChildProps extends {}, +> = Omit> & UseDateFieldProps; -export interface DateFieldProps +export interface DateFieldProps extends UseDateFieldComponentProps { /** * Overridable component slots. @@ -48,7 +47,7 @@ export interface DateFieldProps slotProps?: DateFieldSlotProps; } -export type DateFieldOwnerState = DateFieldProps; +export type DateFieldOwnerState = DateFieldProps; export interface DateFieldSlots extends UseClearableFieldSlots { /** @@ -59,6 +58,7 @@ export interface DateFieldSlots extends UseClearableFieldSlots { textField?: React.ElementType; } -export interface DateFieldSlotProps extends UseClearableFieldSlotProps { +export interface DateFieldSlotProps + extends UseClearableFieldSlotProps { textField?: SlotComponentProps>; } diff --git a/packages/x-date-pickers/src/DateField/useDateField.ts b/packages/x-date-pickers/src/DateField/useDateField.ts index 1a7e9c4795687..2d5b495c652d2 100644 --- a/packages/x-date-pickers/src/DateField/useDateField.ts +++ b/packages/x-date-pickers/src/DateField/useDateField.ts @@ -12,8 +12,9 @@ import { validateDate } from '../internals/utils/validation/validateDate'; import { applyDefaultDate } from '../internals/utils/date-utils'; import { useUtils, useDefaultDates } from '../internals/hooks/useUtils'; import { splitFieldInternalAndForwardedProps } from '../internals/utils/fields'; +import { PickerValidDate } from '../models'; -const useDefaultizedDateField = ( +const useDefaultizedDateField = ( props: UseDateFieldProps, ): AdditionalProps & UseDateFieldDefaultizedProps => { const utils = useUtils(); @@ -29,7 +30,7 @@ const useDefaultizedDateField = ( } as any; }; -export const useDateField = ( +export const useDateField = ( inProps: UseDateFieldComponentProps, ) => { const props = useDefaultizedDateField(inProps); diff --git a/packages/x-date-pickers/src/DatePicker/DatePicker.tsx b/packages/x-date-pickers/src/DatePicker/DatePicker.tsx index f077b6bfa5cb8..714a5ecb81b6a 100644 --- a/packages/x-date-pickers/src/DatePicker/DatePicker.tsx +++ b/packages/x-date-pickers/src/DatePicker/DatePicker.tsx @@ -7,8 +7,9 @@ import { DesktopDatePicker } from '../DesktopDatePicker'; import { MobileDatePicker } from '../MobileDatePicker'; import { DatePickerProps } from './DatePicker.types'; import { DEFAULT_DESKTOP_MODE_MEDIA_QUERY } from '../internals/utils/utils'; +import { PickerValidDate } from '../models'; -type DatePickerComponent = (( +type DatePickerComponent = (( props: DatePickerProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -22,7 +23,7 @@ type DatePickerComponent = (( * * - [DatePicker API](https://mui.com/x/api/date-pickers/date-picker/) */ -const DatePicker = React.forwardRef(function DatePicker( +const DatePicker = React.forwardRef(function DatePicker( inProps: DatePickerProps, ref: React.Ref, ) { @@ -69,7 +70,7 @@ DatePicker.propTypes = { * The default value. * Used when the component is not controlled. */ - defaultValue: PropTypes.any, + defaultValue: PropTypes.object, /** * CSS media query when `Mobile` mode will be changed to `Desktop`. * @default '@media (pointer: fine)' @@ -144,11 +145,11 @@ DatePicker.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Months rendered per row. * @default 3 @@ -240,7 +241,7 @@ DatePicker.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * Component displaying when passed `loading` true. * @returns {React.ReactNode} The node to render when loading. @@ -340,7 +341,7 @@ DatePicker.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.any, + value: PropTypes.object, /** * The visible view. * Used when the component view is controlled. diff --git a/packages/x-date-pickers/src/DatePicker/DatePicker.types.ts b/packages/x-date-pickers/src/DatePicker/DatePicker.types.ts index 9c3c09d712cea..a287263829adc 100644 --- a/packages/x-date-pickers/src/DatePicker/DatePicker.types.ts +++ b/packages/x-date-pickers/src/DatePicker/DatePicker.types.ts @@ -8,16 +8,17 @@ import { MobileDatePickerSlots, MobileDatePickerSlotProps, } from '../MobileDatePicker'; +import { PickerValidDate } from '../models'; -export interface DatePickerSlots +export interface DatePickerSlots extends DesktopDatePickerSlots, MobileDatePickerSlots {} -export interface DatePickerSlotProps +export interface DatePickerSlotProps extends DesktopDatePickerSlotProps, MobileDatePickerSlotProps {} -export interface DatePickerProps +export interface DatePickerProps extends DesktopDatePickerProps, MobileDatePickerProps { /** diff --git a/packages/x-date-pickers/src/DatePicker/DatePickerToolbar.tsx b/packages/x-date-pickers/src/DatePicker/DatePickerToolbar.tsx index 6ab7b05fbc5ee..aaaaeb64d01cc 100644 --- a/packages/x-date-pickers/src/DatePicker/DatePickerToolbar.tsx +++ b/packages/x-date-pickers/src/DatePicker/DatePickerToolbar.tsx @@ -6,14 +6,15 @@ import { unstable_composeClasses as composeClasses } from '@mui/utils'; import { PickersToolbar } from '../internals/components/PickersToolbar'; import { useLocaleText, useUtils } from '../internals/hooks/useUtils'; import { BaseToolbarProps, ExportedBaseToolbarProps } from '../internals/models/props/toolbar'; -import { DateView } from '../models'; +import { DateView, PickerValidDate } from '../models'; import { DatePickerToolbarClasses, getDatePickerToolbarUtilityClass, } from './datePickerToolbarClasses'; import { resolveDateFormat } from '../internals/utils/date-utils'; -export interface DatePickerToolbarProps extends BaseToolbarProps { +export interface DatePickerToolbarProps + extends BaseToolbarProps { classes?: Partial; sx?: SxProps; } @@ -46,7 +47,7 @@ const DatePickerToolbarTitle = styled(Typography, { }), })); -type DatePickerToolbarComponent = (( +type DatePickerToolbarComponent = (( props: DatePickerToolbarProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -60,10 +61,9 @@ type DatePickerToolbarComponent = (( * * - [DatePickerToolbar API](https://mui.com/x/api/date-pickers/date-picker-toolbar/) */ -export const DatePickerToolbar = React.forwardRef(function DatePickerToolbar( - inProps: DatePickerToolbarProps, - ref: React.Ref, -) { +export const DatePickerToolbar = React.forwardRef(function DatePickerToolbar< + TDate extends PickerValidDate, +>(inProps: DatePickerToolbarProps, ref: React.Ref) { const props = useThemeProps({ props: inProps, name: 'MuiDatePickerToolbar' }); const { value, @@ -148,7 +148,7 @@ DatePickerToolbar.propTypes = { * @default "––" */ toolbarPlaceholder: PropTypes.node, - value: PropTypes.any, + value: PropTypes.object, /** * Currently visible picker view. */ diff --git a/packages/x-date-pickers/src/DatePicker/shared.tsx b/packages/x-date-pickers/src/DatePicker/shared.tsx index f770435368dc4..6618e5b31c731 100644 --- a/packages/x-date-pickers/src/DatePicker/shared.tsx +++ b/packages/x-date-pickers/src/DatePicker/shared.tsx @@ -8,7 +8,7 @@ import { } from '../DateCalendar/DateCalendar.types'; import { useDefaultDates, useUtils } from '../internals/hooks/useUtils'; import { applyDefaultViewProps } from '../internals/utils/views'; -import { DateValidationError, DateView } from '../models'; +import { DateValidationError, DateView, PickerValidDate } from '../models'; import { BasePickerInputProps } from '../internals/models/props/basePickerProps'; import { applyDefaultDate } from '../internals/utils/date-utils'; import { BaseDateValidationProps } from '../internals/models/validation'; @@ -21,7 +21,8 @@ import { import { PickerViewRendererLookup } from '../internals/hooks/usePicker/usePickerViews'; import { DateViewRendererProps } from '../dateViewRenderers'; -export interface BaseDatePickerSlots extends DateCalendarSlots { +export interface BaseDatePickerSlots + extends DateCalendarSlots { /** * Custom component for the toolbar rendered above the views. * @default DatePickerToolbar @@ -29,11 +30,12 @@ export interface BaseDatePickerSlots extends DateCalendarSlots { toolbar?: React.JSXElementConstructor>; } -export interface BaseDatePickerSlotProps extends DateCalendarSlotProps { +export interface BaseDatePickerSlotProps + extends DateCalendarSlotProps { toolbar?: ExportedDatePickerToolbarProps; } -export interface BaseDatePickerProps +export interface BaseDatePickerProps extends BasePickerInputProps, ExportedDateCalendarProps { /** @@ -57,17 +59,17 @@ export interface BaseDatePickerProps } type UseDatePickerDefaultizedProps< - TDate, + TDate extends PickerValidDate, Props extends BaseDatePickerProps, > = LocalizedComponent< TDate, DefaultizedProps> >; -export function useDatePickerDefaultizedProps>( - props: Props, - name: string, -): UseDatePickerDefaultizedProps { +export function useDatePickerDefaultizedProps< + TDate extends PickerValidDate, + Props extends BaseDatePickerProps, +>(props: Props, name: string): UseDatePickerDefaultizedProps { const utils = useUtils(); const defaultDates = useDefaultDates(); const themeProps = useThemeProps({ diff --git a/packages/x-date-pickers/src/DateTimeField/DateTimeField.tsx b/packages/x-date-pickers/src/DateTimeField/DateTimeField.tsx index 21a90d5d8e238..118da3db5daf4 100644 --- a/packages/x-date-pickers/src/DateTimeField/DateTimeField.tsx +++ b/packages/x-date-pickers/src/DateTimeField/DateTimeField.tsx @@ -8,8 +8,9 @@ import { DateTimeFieldProps, DateTimeFieldSlotProps } from './DateTimeField.type import { useDateTimeField } from './useDateTimeField'; import { useClearableField } from '../hooks'; import { convertFieldResponseIntoMuiTextFieldProps } from '../internals/utils/convertFieldResponseIntoMuiTextFieldProps'; +import { PickerValidDate } from '../models'; -type DateTimeFieldComponent = (( +type DateTimeFieldComponent = (( props: DateTimeFieldProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -23,7 +24,7 @@ type DateTimeFieldComponent = (( * * - [DateTimeField API](https://mui.com/x/api/date-pickers/date-time-field/) */ -const DateTimeField = React.forwardRef(function DateTimeField( +const DateTimeField = React.forwardRef(function DateTimeField( inProps: DateTimeFieldProps, inRef: React.Ref, ) { @@ -100,7 +101,7 @@ DateTimeField.propTypes = { /** * The default value. Use when the component is not controlled. */ - defaultValue: PropTypes.any, + defaultValue: PropTypes.object, /** * If `true`, the component is disabled. * @default false @@ -192,29 +193,29 @@ DateTimeField.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Maximal selectable moment of time with binding to date, to set max time in each day use `maxTime`. */ - maxDateTime: PropTypes.any, + maxDateTime: PropTypes.object, /** * Maximal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - maxTime: PropTypes.any, + maxTime: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Minimal selectable moment of time with binding to date, to set min time in each day use `minTime`. */ - minDateTime: PropTypes.any, + minDateTime: PropTypes.object, /** * Minimal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - minTime: PropTypes.any, + minTime: PropTypes.object, /** * Step over minutes. * @default 1 @@ -262,7 +263,7 @@ DateTimeField.propTypes = { * For example, on time fields it will be used to determine the date to set. * @default The closest valid date using the validation props, except callbacks such as `shouldDisableDate`. Value is rounded to the most granular section used. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * If `true`, the label is displayed as required and the `input` element is required. * @default false @@ -382,7 +383,7 @@ DateTimeField.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.any, + value: PropTypes.object, /** * The variant to use. * @default 'outlined' diff --git a/packages/x-date-pickers/src/DateTimeField/DateTimeField.types.ts b/packages/x-date-pickers/src/DateTimeField/DateTimeField.types.ts index 98e0973d76514..984e6cf62b910 100644 --- a/packages/x-date-pickers/src/DateTimeField/DateTimeField.types.ts +++ b/packages/x-date-pickers/src/DateTimeField/DateTimeField.types.ts @@ -1,7 +1,7 @@ import * as React from 'react'; import { SlotComponentProps } from '@mui/base/utils'; import TextField from '@mui/material/TextField'; -import { DateTimeValidationError, FieldSection } from '../models'; +import { DateTimeValidationError, FieldSection, PickerValidDate } from '../models'; import { UseFieldInternalProps } from '../internals/hooks/useField'; import { DefaultizedProps, MakeOptional } from '../internals/models/helpers'; import { @@ -16,7 +16,7 @@ import { import { FieldsTextFieldProps } from '../internals/models/fields'; import { UseClearableFieldSlots, UseClearableFieldSlotProps } from '../hooks/useClearableField'; -export interface UseDateTimeFieldProps +export interface UseDateTimeFieldProps extends MakeOptional< UseFieldInternalProps, 'format' @@ -35,18 +35,17 @@ export interface UseDateTimeFieldProps ampm?: boolean; } -export type UseDateTimeFieldDefaultizedProps = DefaultizedProps< +export type UseDateTimeFieldDefaultizedProps = DefaultizedProps< UseDateTimeFieldProps, keyof BaseDateValidationProps | keyof BaseTimeValidationProps | 'format' >; -export type UseDateTimeFieldComponentProps = Omit< - TChildProps, - keyof UseDateTimeFieldProps -> & - UseDateTimeFieldProps; +export type UseDateTimeFieldComponentProps< + TDate extends PickerValidDate, + TChildProps extends {}, +> = Omit> & UseDateTimeFieldProps; -export interface DateTimeFieldProps +export interface DateTimeFieldProps extends UseDateTimeFieldComponentProps { /** * Overridable component slots. @@ -60,7 +59,7 @@ export interface DateTimeFieldProps slotProps?: DateTimeFieldSlotProps; } -export type DateTimeFieldOwnerState = DateTimeFieldProps; +export type DateTimeFieldOwnerState = DateTimeFieldProps; export interface DateTimeFieldSlots extends UseClearableFieldSlots { /** @@ -71,6 +70,7 @@ export interface DateTimeFieldSlots extends UseClearableFieldSlots { textField?: React.ElementType; } -export interface DateTimeFieldSlotProps extends UseClearableFieldSlotProps { +export interface DateTimeFieldSlotProps + extends UseClearableFieldSlotProps { textField?: SlotComponentProps>; } diff --git a/packages/x-date-pickers/src/DateTimeField/useDateTimeField.ts b/packages/x-date-pickers/src/DateTimeField/useDateTimeField.ts index 7e8236f12b3ab..021ea1cc3baa8 100644 --- a/packages/x-date-pickers/src/DateTimeField/useDateTimeField.ts +++ b/packages/x-date-pickers/src/DateTimeField/useDateTimeField.ts @@ -12,8 +12,9 @@ import { validateDateTime } from '../internals/utils/validation/validateDateTime import { applyDefaultDate } from '../internals/utils/date-utils'; import { useUtils, useDefaultDates } from '../internals/hooks/useUtils'; import { splitFieldInternalAndForwardedProps } from '../internals/utils/fields'; +import { PickerValidDate } from '../models'; -const useDefaultizedDateTimeField = ( +const useDefaultizedDateTimeField = ( props: UseDateTimeFieldProps, ): AdditionalProps & UseDateTimeFieldDefaultizedProps => { const utils = useUtils(); @@ -37,7 +38,7 @@ const useDefaultizedDateTimeField = ( } as any; }; -export const useDateTimeField = ( +export const useDateTimeField = ( inProps: UseDateTimeFieldComponentProps, ) => { const props = useDefaultizedDateTimeField(inProps); diff --git a/packages/x-date-pickers/src/DateTimePicker/DateTimePicker.tsx b/packages/x-date-pickers/src/DateTimePicker/DateTimePicker.tsx index a828c688676bf..1ad495a49fa73 100644 --- a/packages/x-date-pickers/src/DateTimePicker/DateTimePicker.tsx +++ b/packages/x-date-pickers/src/DateTimePicker/DateTimePicker.tsx @@ -7,8 +7,9 @@ import { DesktopDateTimePicker } from '../DesktopDateTimePicker'; import { MobileDateTimePicker, MobileDateTimePickerProps } from '../MobileDateTimePicker'; import { DateTimePickerProps } from './DateTimePicker.types'; import { DEFAULT_DESKTOP_MODE_MEDIA_QUERY } from '../internals/utils/utils'; +import { PickerValidDate } from '../models'; -type DateTimePickerComponent = (( +type DateTimePickerComponent = (( props: DateTimePickerProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -22,7 +23,7 @@ type DateTimePickerComponent = (( * * - [DateTimePicker API](https://mui.com/x/api/date-pickers/date-time-picker/) */ -const DateTimePicker = React.forwardRef(function DateTimePicker( +const DateTimePicker = React.forwardRef(function DateTimePicker( inProps: DateTimePickerProps, ref: React.Ref, ) { @@ -79,7 +80,7 @@ DateTimePicker.propTypes = { * The default value. * Used when the component is not controlled. */ - defaultValue: PropTypes.any, + defaultValue: PropTypes.object, /** * CSS media query when `Mobile` mode will be changed to `Desktop`. * @default '@media (pointer: fine)' @@ -159,29 +160,29 @@ DateTimePicker.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Maximal selectable moment of time with binding to date, to set max time in each day use `maxTime`. */ - maxDateTime: PropTypes.any, + maxDateTime: PropTypes.object, /** * Maximal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - maxTime: PropTypes.any, + maxTime: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Minimal selectable moment of time with binding to date, to set min time in each day use `minTime`. */ - minDateTime: PropTypes.any, + minDateTime: PropTypes.object, /** * Minimal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - minTime: PropTypes.any, + minTime: PropTypes.object, /** * Step over minutes. * @default 1 @@ -278,7 +279,7 @@ DateTimePicker.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * Component displaying when passed `loading` true. * @returns {React.ReactNode} The node to render when loading. @@ -407,7 +408,7 @@ DateTimePicker.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.any, + value: PropTypes.object, /** * The visible view. * Used when the component view is controlled. diff --git a/packages/x-date-pickers/src/DateTimePicker/DateTimePicker.types.ts b/packages/x-date-pickers/src/DateTimePicker/DateTimePicker.types.ts index 11c592b43e4fe..261c0907f258e 100644 --- a/packages/x-date-pickers/src/DateTimePicker/DateTimePicker.types.ts +++ b/packages/x-date-pickers/src/DateTimePicker/DateTimePicker.types.ts @@ -9,16 +9,17 @@ import { MobileDateTimePickerSlots, MobileDateTimePickerSlotProps, } from '../MobileDateTimePicker'; +import { PickerValidDate } from '../models'; -export interface DateTimePickerSlots +export interface DateTimePickerSlots extends DesktopDateTimePickerSlots, MobileDateTimePickerSlots {} -export interface DateTimePickerSlotProps +export interface DateTimePickerSlotProps extends DesktopDateTimePickerSlotProps, MobileDateTimePickerSlotProps {} -export interface DateTimePickerProps +export interface DateTimePickerProps extends DesktopDateTimePickerProps, Omit, 'views'> { /** diff --git a/packages/x-date-pickers/src/DateTimePicker/DateTimePickerToolbar.tsx b/packages/x-date-pickers/src/DateTimePicker/DateTimePickerToolbar.tsx index d817ba20003a7..b622fa791f990 100644 --- a/packages/x-date-pickers/src/DateTimePicker/DateTimePickerToolbar.tsx +++ b/packages/x-date-pickers/src/DateTimePicker/DateTimePickerToolbar.tsx @@ -20,13 +20,14 @@ import { formatMeridiem } from '../internals/utils/date-utils'; import { MakeOptional } from '../internals/models/helpers'; import { pickersToolbarTextClasses } from '../internals/components/pickersToolbarTextClasses'; import { pickersToolbarClasses } from '../internals'; +import { PickerValidDate } from '../models'; export interface ExportedDateTimePickerToolbarProps extends ExportedBaseToolbarProps { ampm?: boolean; ampmInClock?: boolean; } -export interface DateTimePickerToolbarProps +export interface DateTimePickerToolbarProps extends ExportedDateTimePickerToolbarProps, MakeOptional, 'view'> { /** @@ -209,7 +210,9 @@ const DateTimePickerToolbarAmPmSelection = styled('div', { * * - [DateTimePickerToolbar API](https://mui.com/x/api/date-pickers/date-time-picker-toolbar/) */ -function DateTimePickerToolbar(inProps: DateTimePickerToolbarProps) { +function DateTimePickerToolbar( + inProps: DateTimePickerToolbarProps, +) { const props = useThemeProps({ props: inProps, name: 'MuiDateTimePickerToolbar' }); const { ampm, @@ -425,7 +428,7 @@ DateTimePickerToolbar.propTypes = { */ toolbarTitle: PropTypes.node, toolbarVariant: PropTypes.oneOf(['desktop', 'mobile']), - value: PropTypes.any, + value: PropTypes.object, /** * Currently visible picker view. */ diff --git a/packages/x-date-pickers/src/DateTimePicker/shared.tsx b/packages/x-date-pickers/src/DateTimePicker/shared.tsx index ff7ef45d18728..feb1531a67877 100644 --- a/packages/x-date-pickers/src/DateTimePicker/shared.tsx +++ b/packages/x-date-pickers/src/DateTimePicker/shared.tsx @@ -1,7 +1,7 @@ import * as React from 'react'; import { useThemeProps } from '@mui/material/styles'; import { DefaultizedProps } from '../internals/models/helpers'; -import { DateTimeValidationError } from '../models'; +import { DateTimeValidationError, PickerValidDate } from '../models'; import { useDefaultDates, useUtils } from '../internals/hooks/useUtils'; import { DateCalendarSlots, @@ -34,7 +34,9 @@ import { applyDefaultViewProps } from '../internals/utils/views'; import { BaseClockProps, ExportedBaseClockProps } from '../internals/models/props/clock'; import { DateOrTimeViewWithMeridiem, TimeViewWithMeridiem } from '../internals/models'; -export interface BaseDateTimePickerSlots extends DateCalendarSlots, TimeClockSlots { +export interface BaseDateTimePickerSlots + extends DateCalendarSlots, + TimeClockSlots { /** * Tabs enabling toggling between date and time pickers. * @default DateTimePickerTabs @@ -47,7 +49,7 @@ export interface BaseDateTimePickerSlots extends DateCalendarSlots toolbar?: React.JSXElementConstructor>; } -export interface BaseDateTimePickerSlotProps +export interface BaseDateTimePickerSlotProps extends DateCalendarSlotProps, TimeClockSlotProps { /** @@ -60,8 +62,10 @@ export interface BaseDateTimePickerSlotProps toolbar?: ExportedDateTimePickerToolbarProps; } -export interface BaseDateTimePickerProps - extends BasePickerInputProps, +export interface BaseDateTimePickerProps< + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +> extends BasePickerInputProps, Omit, 'onViewChange'>, ExportedBaseClockProps, DateTimeValidationProps { @@ -97,7 +101,7 @@ export interface BaseDateTimePickerProps, > = LocalizedComponent< @@ -114,7 +118,7 @@ type UseDateTimePickerDefaultizedProps< >; export function useDateTimePickerDefaultizedProps< - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, Props extends BaseDateTimePickerProps, >(props: Props, name: string): UseDateTimePickerDefaultizedProps { diff --git a/packages/x-date-pickers/src/DesktopDatePicker/DesktopDatePicker.tsx b/packages/x-date-pickers/src/DesktopDatePicker/DesktopDatePicker.tsx index d7107fe88c489..550cde19361b3 100644 --- a/packages/x-date-pickers/src/DesktopDatePicker/DesktopDatePicker.tsx +++ b/packages/x-date-pickers/src/DesktopDatePicker/DesktopDatePicker.tsx @@ -7,7 +7,7 @@ import { DesktopDatePickerProps } from './DesktopDatePicker.types'; import { useDatePickerDefaultizedProps } from '../DatePicker/shared'; import { useLocaleText, useUtils } from '../internals/hooks/useUtils'; import { validateDate } from '../internals/utils/validation/validateDate'; -import { DateView } from '../models'; +import { DateView, PickerValidDate } from '../models'; import { useDesktopPicker } from '../internals/hooks/useDesktopPicker'; import { CalendarIcon } from '../icons'; import { DateField } from '../DateField'; @@ -16,7 +16,7 @@ import { renderDateViewCalendar } from '../dateViewRenderers'; import { PickerViewRendererLookup } from '../internals/hooks/usePicker/usePickerViews'; import { resolveDateFormat } from '../internals/utils/date-utils'; -type DesktopDatePickerComponent = (( +type DesktopDatePickerComponent = (( props: DesktopDatePickerProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -30,10 +30,9 @@ type DesktopDatePickerComponent = (( * * - [DesktopDatePicker API](https://mui.com/x/api/date-pickers/desktop-date-picker/) */ -const DesktopDatePicker = React.forwardRef(function DesktopDatePicker( - inProps: DesktopDatePickerProps, - ref: React.Ref, -) { +const DesktopDatePicker = React.forwardRef(function DesktopDatePicker< + TDate extends PickerValidDate, +>(inProps: DesktopDatePickerProps, ref: React.Ref) { const localeText = useLocaleText(); const utils = useUtils(); @@ -116,7 +115,7 @@ DesktopDatePicker.propTypes = { * The default value. * Used when the component is not controlled. */ - defaultValue: PropTypes.any, + defaultValue: PropTypes.object, /** * If `true`, the picker and text field are disabled. * @default false @@ -185,11 +184,11 @@ DesktopDatePicker.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Months rendered per row. * @default 3 @@ -281,7 +280,7 @@ DesktopDatePicker.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * Component displaying when passed `loading` true. * @returns {React.ReactNode} The node to render when loading. @@ -381,7 +380,7 @@ DesktopDatePicker.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.any, + value: PropTypes.object, /** * The visible view. * Used when the component view is controlled. diff --git a/packages/x-date-pickers/src/DesktopDatePicker/DesktopDatePicker.types.ts b/packages/x-date-pickers/src/DesktopDatePicker/DesktopDatePicker.types.ts index 6a977b079b94b..d586879cefbb4 100644 --- a/packages/x-date-pickers/src/DesktopDatePicker/DesktopDatePicker.types.ts +++ b/packages/x-date-pickers/src/DesktopDatePicker/DesktopDatePicker.types.ts @@ -9,17 +9,17 @@ import { BaseDatePickerSlotProps, } from '../DatePicker/shared'; import { MakeOptional } from '../internals/models/helpers'; -import { DateView } from '../models'; +import { DateView, PickerValidDate } from '../models'; -export interface DesktopDatePickerSlots +export interface DesktopDatePickerSlots extends BaseDatePickerSlots, MakeOptional, 'field' | 'openPickerIcon'> {} -export interface DesktopDatePickerSlotProps +export interface DesktopDatePickerSlotProps extends BaseDatePickerSlotProps, ExportedUseDesktopPickerSlotProps {} -export interface DesktopDatePickerProps +export interface DesktopDatePickerProps extends BaseDatePickerProps, DesktopOnlyPickerProps { /** diff --git a/packages/x-date-pickers/src/DesktopDatePicker/tests/DesktopDatePicker.test.tsx b/packages/x-date-pickers/src/DesktopDatePicker/tests/DesktopDatePicker.test.tsx index 5f89b74ea0290..7c64c8832c42a 100644 --- a/packages/x-date-pickers/src/DesktopDatePicker/tests/DesktopDatePicker.test.tsx +++ b/packages/x-date-pickers/src/DesktopDatePicker/tests/DesktopDatePicker.test.tsx @@ -307,15 +307,6 @@ describe('', () => { expect(screen.getByLabelText('Next month')).not.to.have.attribute('disabled'); }); - - it('should allow to navigate to previous and next month if props.minDate == null', () => { - render(); - - openPicker({ type: 'date', variant: 'desktop' }); - - expect(screen.getByLabelText('Previous month')).not.to.have.attribute('disabled'); - expect(screen.getByLabelText('Next month')).not.to.have.attribute('disabled'); - }); }); describe('Validation', () => { diff --git a/packages/x-date-pickers/src/DesktopDateTimePicker/DesktopDateTimePicker.tsx b/packages/x-date-pickers/src/DesktopDateTimePicker/DesktopDateTimePicker.tsx index c4a1f08ae8a71..a592931033129 100644 --- a/packages/x-date-pickers/src/DesktopDateTimePicker/DesktopDateTimePicker.tsx +++ b/packages/x-date-pickers/src/DesktopDateTimePicker/DesktopDateTimePicker.tsx @@ -20,8 +20,9 @@ import { resolveTimeViewsResponse, } from '../internals/utils/date-time-utils'; import { PickersActionBarAction } from '../PickersActionBar'; +import { PickerValidDate } from '../models'; -type DesktopDateTimePickerComponent = (( +type DesktopDateTimePickerComponent = (( props: DesktopDateTimePickerProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -35,10 +36,9 @@ type DesktopDateTimePickerComponent = (( * * - [DesktopDateTimePicker API](https://mui.com/x/api/date-pickers/desktop-date-time-picker/) */ -const DesktopDateTimePicker = React.forwardRef(function DesktopDateTimePicker( - inProps: DesktopDateTimePickerProps, - ref: React.Ref, -) { +const DesktopDateTimePicker = React.forwardRef(function DesktopDateTimePicker< + TDate extends PickerValidDate, +>(inProps: DesktopDateTimePickerProps, ref: React.Ref) { const localeText = useLocaleText(); const utils = useUtils(); @@ -175,7 +175,7 @@ DesktopDateTimePicker.propTypes = { * The default value. * Used when the component is not controlled. */ - defaultValue: PropTypes.any, + defaultValue: PropTypes.object, /** * If `true`, the picker and text field are disabled. * @default false @@ -249,29 +249,29 @@ DesktopDateTimePicker.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Maximal selectable moment of time with binding to date, to set max time in each day use `maxTime`. */ - maxDateTime: PropTypes.any, + maxDateTime: PropTypes.object, /** * Maximal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - maxTime: PropTypes.any, + maxTime: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Minimal selectable moment of time with binding to date, to set min time in each day use `minTime`. */ - minDateTime: PropTypes.any, + minDateTime: PropTypes.object, /** * Minimal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - minTime: PropTypes.any, + minTime: PropTypes.object, /** * Step over minutes. * @default 1 @@ -368,7 +368,7 @@ DesktopDateTimePicker.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * Component displaying when passed `loading` true. * @returns {React.ReactNode} The node to render when loading. @@ -497,7 +497,7 @@ DesktopDateTimePicker.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.any, + value: PropTypes.object, /** * The visible view. * Used when the component view is controlled. diff --git a/packages/x-date-pickers/src/DesktopDateTimePicker/DesktopDateTimePicker.types.ts b/packages/x-date-pickers/src/DesktopDateTimePicker/DesktopDateTimePicker.types.ts index d36ce2b031455..4848a1477317f 100644 --- a/packages/x-date-pickers/src/DesktopDateTimePicker/DesktopDateTimePicker.types.ts +++ b/packages/x-date-pickers/src/DesktopDateTimePicker/DesktopDateTimePicker.types.ts @@ -9,7 +9,7 @@ import { BaseDateTimePickerSlotProps, } from '../DateTimePicker/shared'; import { MakeOptional } from '../internals/models/helpers'; -import { DateOrTimeView } from '../models'; +import { DateOrTimeView, PickerValidDate } from '../models'; import { DesktopOnlyTimePickerProps } from '../internals/models/props/clock'; import { DateOrTimeViewWithMeridiem } from '../internals/models'; import { @@ -18,7 +18,7 @@ import { } from '../MultiSectionDigitalClock'; import { DigitalClockSlots, DigitalClockSlotProps } from '../DigitalClock'; -export interface DesktopDateTimePickerSlots +export interface DesktopDateTimePickerSlots extends BaseDateTimePickerSlots, MakeOptional< UseDesktopPickerSlots, @@ -27,13 +27,13 @@ export interface DesktopDateTimePickerSlots DigitalClockSlots, MultiSectionDigitalClockSlots {} -export interface DesktopDateTimePickerSlotProps +export interface DesktopDateTimePickerSlotProps extends BaseDateTimePickerSlotProps, ExportedUseDesktopPickerSlotProps, DigitalClockSlotProps, MultiSectionDigitalClockSlotProps {} -export interface DesktopDateTimePickerProps +export interface DesktopDateTimePickerProps extends BaseDateTimePickerProps, DesktopOnlyPickerProps, DesktopOnlyTimePickerProps { diff --git a/packages/x-date-pickers/src/DesktopTimePicker/DesktopTimePicker.tsx b/packages/x-date-pickers/src/DesktopTimePicker/DesktopTimePicker.tsx index de810cb47552b..659c364afb4e9 100644 --- a/packages/x-date-pickers/src/DesktopTimePicker/DesktopTimePicker.tsx +++ b/packages/x-date-pickers/src/DesktopTimePicker/DesktopTimePicker.tsx @@ -20,9 +20,9 @@ import { PickersActionBarAction } from '../PickersActionBar'; import { TimeViewWithMeridiem } from '../internals/models'; import { resolveTimeFormat } from '../internals/utils/time-utils'; import { resolveTimeViewsResponse } from '../internals/utils/date-time-utils'; -import { TimeView } from '../models/views'; +import { TimeView, PickerValidDate } from '../models'; -type DesktopTimePickerComponent = (( +type DesktopTimePickerComponent = (( props: DesktopTimePickerProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -36,10 +36,9 @@ type DesktopTimePickerComponent = (( * * - [DesktopTimePicker API](https://mui.com/x/api/date-pickers/desktop-time-picker/) */ -const DesktopTimePicker = React.forwardRef(function DesktopTimePicker( - inProps: DesktopTimePickerProps, - ref: React.Ref, -) { +const DesktopTimePicker = React.forwardRef(function DesktopTimePicker< + TDate extends PickerValidDate, +>(inProps: DesktopTimePickerProps, ref: React.Ref) { const localeText = useLocaleText(); const utils = useUtils(); @@ -157,7 +156,7 @@ DesktopTimePicker.propTypes = { * The default value. * Used when the component is not controlled. */ - defaultValue: PropTypes.any, + defaultValue: PropTypes.object, /** * If `true`, the picker and text field are disabled. * @default false @@ -211,12 +210,12 @@ DesktopTimePicker.propTypes = { * Maximal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - maxTime: PropTypes.any, + maxTime: PropTypes.object, /** * Minimal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - minTime: PropTypes.any, + minTime: PropTypes.object, /** * Step over minutes. * @default 1 @@ -296,7 +295,7 @@ DesktopTimePicker.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * The currently selected sections. * This prop accept four formats: @@ -384,7 +383,7 @@ DesktopTimePicker.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.any, + value: PropTypes.object, /** * The visible view. * Used when the component view is controlled. diff --git a/packages/x-date-pickers/src/DesktopTimePicker/DesktopTimePicker.types.ts b/packages/x-date-pickers/src/DesktopTimePicker/DesktopTimePicker.types.ts index 6f3735460d58e..ec9a50c0c2c48 100644 --- a/packages/x-date-pickers/src/DesktopTimePicker/DesktopTimePicker.types.ts +++ b/packages/x-date-pickers/src/DesktopTimePicker/DesktopTimePicker.types.ts @@ -16,21 +16,21 @@ import { MultiSectionDigitalClockSlots, MultiSectionDigitalClockSlotProps, } from '../MultiSectionDigitalClock'; -import { TimeView } from '../models'; +import { PickerValidDate, TimeView } from '../models'; -export interface DesktopTimePickerSlots +export interface DesktopTimePickerSlots extends BaseTimePickerSlots, MakeOptional, 'field' | 'openPickerIcon'>, DigitalClockSlots, MultiSectionDigitalClockSlots {} -export interface DesktopTimePickerSlotProps +export interface DesktopTimePickerSlotProps extends BaseTimePickerSlotProps, ExportedUseDesktopPickerSlotProps, DigitalClockSlotProps, MultiSectionDigitalClockSlotProps {} -export interface DesktopTimePickerProps +export interface DesktopTimePickerProps extends BaseTimePickerProps, DesktopOnlyPickerProps, DesktopOnlyTimePickerProps { diff --git a/packages/x-date-pickers/src/DigitalClock/DigitalClock.tsx b/packages/x-date-pickers/src/DigitalClock/DigitalClock.tsx index 94fcdb8d9f895..e3824be369071 100644 --- a/packages/x-date-pickers/src/DigitalClock/DigitalClock.tsx +++ b/packages/x-date-pickers/src/DigitalClock/DigitalClock.tsx @@ -14,7 +14,7 @@ import { PickerViewRoot } from '../internals/components/PickerViewRoot'; import { getDigitalClockUtilityClass } from './digitalClockClasses'; import { DigitalClockProps } from './DigitalClock.types'; import { useViews } from '../internals/hooks/useViews'; -import { TimeView } from '../models'; +import { PickerValidDate, TimeView } from '../models'; import { DIGITAL_CLOCK_VIEW_HEIGHT } from '../internals/constants/dimensions'; import { useControlledValueWithTimezone } from '../internals/hooks/useValueWithTimezone'; import { singleItemValueManager } from '../internals/utils/valueManagers'; @@ -81,7 +81,7 @@ const DigitalClockItem = styled(MenuItem, { }, })); -type DigitalClockComponent = (( +type DigitalClockComponent = (( props: DigitalClockProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -95,7 +95,7 @@ type DigitalClockComponent = (( * * - [DigitalClock API](https://mui.com/x/api/date-pickers/digital-clock/) */ -export const DigitalClock = React.forwardRef(function DigitalClock( +export const DigitalClock = React.forwardRef(function DigitalClock( inProps: DigitalClockProps, ref: React.Ref, ) { @@ -352,7 +352,7 @@ DigitalClock.propTypes = { * The default selected value. * Used when the component is not controlled. */ - defaultValue: PropTypes.any, + defaultValue: PropTypes.object, /** * If `true`, the picker views and text field are disabled. * @default false @@ -381,12 +381,12 @@ DigitalClock.propTypes = { * Maximal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - maxTime: PropTypes.any, + maxTime: PropTypes.object, /** * Minimal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - minTime: PropTypes.any, + minTime: PropTypes.object, /** * Step over minutes. * @default 1 @@ -429,7 +429,7 @@ DigitalClock.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid time using the validation props, except callbacks such as `shouldDisableTime`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * Disable specific time. * @template TDate @@ -479,7 +479,7 @@ DigitalClock.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.any, + value: PropTypes.object, /** * The visible view. * Used when the component view is controlled. diff --git a/packages/x-date-pickers/src/DigitalClock/DigitalClock.types.ts b/packages/x-date-pickers/src/DigitalClock/DigitalClock.types.ts index 35b88400f1a92..7b98c84670d60 100644 --- a/packages/x-date-pickers/src/DigitalClock/DigitalClock.types.ts +++ b/packages/x-date-pickers/src/DigitalClock/DigitalClock.types.ts @@ -1,3 +1,4 @@ +import * as React from 'react'; import { SlotComponentProps } from '@mui/base/utils'; import MenuItem from '@mui/material/MenuItem'; import { DigitalClockClasses } from './digitalClockClasses'; @@ -6,9 +7,9 @@ import { DigitalClockOnlyProps, ExportedBaseClockProps, } from '../internals/models/props/clock'; -import { TimeView } from '../models'; +import { PickerValidDate, TimeView } from '../models'; -export interface ExportedDigitalClockProps +export interface ExportedDigitalClockProps extends ExportedBaseClockProps, DigitalClockOnlyProps {} @@ -24,7 +25,7 @@ export interface DigitalClockSlotProps { digitalClockItem?: SlotComponentProps>; } -export interface DigitalClockProps +export interface DigitalClockProps extends ExportedDigitalClockProps, BaseClockProps> { /** diff --git a/packages/x-date-pickers/src/LocalizationProvider/LocalizationProvider.tsx b/packages/x-date-pickers/src/LocalizationProvider/LocalizationProvider.tsx index 956bf452ccb75..e7f74202614ad 100644 --- a/packages/x-date-pickers/src/LocalizationProvider/LocalizationProvider.tsx +++ b/packages/x-date-pickers/src/LocalizationProvider/LocalizationProvider.tsx @@ -1,10 +1,10 @@ import * as React from 'react'; import PropTypes from 'prop-types'; import { useThemeProps } from '@mui/material/styles'; -import { AdapterFormats, MuiPickersAdapter } from '../models'; +import { AdapterFormats, MuiPickersAdapter, PickerValidDate } from '../models'; import { PickersInputLocaleText } from '../locales'; -export interface MuiPickersAdapterContextValue { +export interface MuiPickersAdapterContextValue { defaultDates: { minDate: TDate; maxDate: TDate; @@ -14,7 +14,7 @@ export interface MuiPickersAdapterContextValue { localeText: PickersInputLocaleText | undefined; } -export type MuiPickersAdapterContextNullableValue = { +export type MuiPickersAdapterContextNullableValue = { [K in keyof MuiPickersAdapterContextValue]: MuiPickersAdapterContextValue[K] | null; }; @@ -25,7 +25,7 @@ if (process.env.NODE_ENV !== 'production') { MuiPickersAdapterContext.displayName = 'MuiPickersAdapterContext'; } -export interface LocalizationProviderProps { +export interface LocalizationProviderProps { children?: React.ReactNode; /** * Date library adapter class function. @@ -51,7 +51,7 @@ export interface LocalizationProviderProps { localeText?: PickersInputLocaleText; } -type LocalizationProviderComponent = (( +type LocalizationProviderComponent = (( props: LocalizationProviderProps, ) => React.JSX.Element) & { propTypes?: any }; @@ -67,9 +67,10 @@ type LocalizationProviderComponent = (( * * - [LocalizationProvider API](https://mui.com/x/api/date-pickers/localization-provider/) */ -export const LocalizationProvider = function LocalizationProvider( - inProps: LocalizationProviderProps, -) { +export const LocalizationProvider = function LocalizationProvider< + TDate extends PickerValidDate, + TLocale, +>(inProps: LocalizationProviderProps) { const { localeText: inLocaleText, ...otherInProps } = inProps; const { utils: parentUtils, localeText: parentLocaleText } = React.useContext( diff --git a/packages/x-date-pickers/src/MobileDatePicker/MobileDatePicker.tsx b/packages/x-date-pickers/src/MobileDatePicker/MobileDatePicker.tsx index 76ac709bf41b3..5c84007985692 100644 --- a/packages/x-date-pickers/src/MobileDatePicker/MobileDatePicker.tsx +++ b/packages/x-date-pickers/src/MobileDatePicker/MobileDatePicker.tsx @@ -8,14 +8,14 @@ import { useDatePickerDefaultizedProps } from '../DatePicker/shared'; import { useUtils, useLocaleText } from '../internals/hooks/useUtils'; import { validateDate } from '../internals/utils/validation/validateDate'; import { PickerViewRendererLookup } from '../internals/hooks/usePicker/usePickerViews'; -import { DateView } from '../models'; +import { DateView, PickerValidDate } from '../models'; import { DateField } from '../DateField'; import { extractValidationProps } from '../internals/utils/validation/extractValidationProps'; import { singleItemValueManager } from '../internals/utils/valueManagers'; import { renderDateViewCalendar } from '../dateViewRenderers'; import { resolveDateFormat } from '../internals/utils/date-utils'; -type MobileDatePickerComponent = (( +type MobileDatePickerComponent = (( props: MobileDatePickerProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -29,7 +29,7 @@ type MobileDatePickerComponent = (( * * - [MobileDatePicker API](https://mui.com/x/api/date-pickers/mobile-date-picker/) */ -const MobileDatePicker = React.forwardRef(function MobileDatePicker( +const MobileDatePicker = React.forwardRef(function MobileDatePicker( inProps: MobileDatePickerProps, ref: React.Ref, ) { @@ -113,7 +113,7 @@ MobileDatePicker.propTypes = { * The default value. * Used when the component is not controlled. */ - defaultValue: PropTypes.any, + defaultValue: PropTypes.object, /** * If `true`, the picker and text field are disabled. * @default false @@ -182,11 +182,11 @@ MobileDatePicker.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Months rendered per row. * @default 3 @@ -278,7 +278,7 @@ MobileDatePicker.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * Component displaying when passed `loading` true. * @returns {React.ReactNode} The node to render when loading. @@ -378,7 +378,7 @@ MobileDatePicker.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.any, + value: PropTypes.object, /** * The visible view. * Used when the component view is controlled. diff --git a/packages/x-date-pickers/src/MobileDatePicker/MobileDatePicker.types.ts b/packages/x-date-pickers/src/MobileDatePicker/MobileDatePicker.types.ts index 31fb295dbfd76..d6371b06907e5 100644 --- a/packages/x-date-pickers/src/MobileDatePicker/MobileDatePicker.types.ts +++ b/packages/x-date-pickers/src/MobileDatePicker/MobileDatePicker.types.ts @@ -9,17 +9,17 @@ import { BaseDatePickerSlotProps, } from '../DatePicker/shared'; import { MakeOptional } from '../internals/models/helpers'; -import { DateView } from '../models'; +import { DateView, PickerValidDate } from '../models'; -export interface MobileDatePickerSlots +export interface MobileDatePickerSlots extends BaseDatePickerSlots, MakeOptional, 'field'> {} -export interface MobileDatePickerSlotProps +export interface MobileDatePickerSlotProps extends BaseDatePickerSlotProps, ExportedUseMobilePickerSlotProps {} -export interface MobileDatePickerProps +export interface MobileDatePickerProps extends BaseDatePickerProps, MobileOnlyPickerProps { /** diff --git a/packages/x-date-pickers/src/MobileDateTimePicker/MobileDateTimePicker.tsx b/packages/x-date-pickers/src/MobileDateTimePicker/MobileDateTimePicker.tsx index 0035794e8369a..63b1c6129d4b9 100644 --- a/packages/x-date-pickers/src/MobileDateTimePicker/MobileDateTimePicker.tsx +++ b/packages/x-date-pickers/src/MobileDateTimePicker/MobileDateTimePicker.tsx @@ -9,14 +9,14 @@ import { useDateTimePickerDefaultizedProps } from '../DateTimePicker/shared'; import { useLocaleText, useUtils } from '../internals/hooks/useUtils'; import { validateDateTime } from '../internals/utils/validation/validateDateTime'; import { PickerViewRendererLookup } from '../internals/hooks/usePicker/usePickerViews'; -import { DateOrTimeView } from '../models'; +import { DateOrTimeView, PickerValidDate } from '../models'; import { useMobilePicker } from '../internals/hooks/useMobilePicker'; import { extractValidationProps } from '../internals/utils/validation/extractValidationProps'; import { renderDateViewCalendar } from '../dateViewRenderers'; import { renderTimeViewClock } from '../timeViewRenderers'; import { resolveDateTimeFormat } from '../internals/utils/date-time-utils'; -type MobileDateTimePickerComponent = (( +type MobileDateTimePickerComponent = (( props: MobileDateTimePickerProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -30,10 +30,9 @@ type MobileDateTimePickerComponent = (( * * - [MobileDateTimePicker API](https://mui.com/x/api/date-pickers/mobile-date-time-picker/) */ -const MobileDateTimePicker = React.forwardRef(function MobileDateTimePicker( - inProps: MobileDateTimePickerProps, - ref: React.Ref, -) { +const MobileDateTimePicker = React.forwardRef(function MobileDateTimePicker< + TDate extends PickerValidDate, +>(inProps: MobileDateTimePickerProps, ref: React.Ref) { const localeText = useLocaleText(); const utils = useUtils(); @@ -135,7 +134,7 @@ MobileDateTimePicker.propTypes = { * The default value. * Used when the component is not controlled. */ - defaultValue: PropTypes.any, + defaultValue: PropTypes.object, /** * If `true`, the picker and text field are disabled. * @default false @@ -209,29 +208,29 @@ MobileDateTimePicker.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Maximal selectable moment of time with binding to date, to set max time in each day use `maxTime`. */ - maxDateTime: PropTypes.any, + maxDateTime: PropTypes.object, /** * Maximal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - maxTime: PropTypes.any, + maxTime: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Minimal selectable moment of time with binding to date, to set min time in each day use `minTime`. */ - minDateTime: PropTypes.any, + minDateTime: PropTypes.object, /** * Minimal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - minTime: PropTypes.any, + minTime: PropTypes.object, /** * Step over minutes. * @default 1 @@ -328,7 +327,7 @@ MobileDateTimePicker.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * Component displaying when passed `loading` true. * @returns {React.ReactNode} The node to render when loading. @@ -436,7 +435,7 @@ MobileDateTimePicker.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.any, + value: PropTypes.object, /** * The visible view. * Used when the component view is controlled. diff --git a/packages/x-date-pickers/src/MobileDateTimePicker/MobileDateTimePicker.types.ts b/packages/x-date-pickers/src/MobileDateTimePicker/MobileDateTimePicker.types.ts index 29bb903432789..d8b6a4c1d9621 100644 --- a/packages/x-date-pickers/src/MobileDateTimePicker/MobileDateTimePicker.types.ts +++ b/packages/x-date-pickers/src/MobileDateTimePicker/MobileDateTimePicker.types.ts @@ -9,23 +9,23 @@ import { BaseDateTimePickerSlotProps, } from '../DateTimePicker/shared'; import { MakeOptional } from '../internals/models/helpers'; -import { DateOrTimeView } from '../models'; +import { DateOrTimeView, PickerValidDate } from '../models'; import { DateOrTimeViewWithMeridiem } from '../internals/models'; export interface MobileDateTimePickerSlots< - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem = DateOrTimeView, > extends BaseDateTimePickerSlots, MakeOptional, 'field'> {} export interface MobileDateTimePickerSlotProps< - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem = DateOrTimeView, > extends BaseDateTimePickerSlotProps, ExportedUseMobilePickerSlotProps {} export interface MobileDateTimePickerProps< - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem = DateOrTimeView, > extends BaseDateTimePickerProps, MobileOnlyPickerProps { diff --git a/packages/x-date-pickers/src/MobileDateTimePicker/tests/MobileDateTimePicker.test.tsx b/packages/x-date-pickers/src/MobileDateTimePicker/tests/MobileDateTimePicker.test.tsx index df67f29c014c1..e796cd42c98a5 100644 --- a/packages/x-date-pickers/src/MobileDateTimePicker/tests/MobileDateTimePicker.test.tsx +++ b/packages/x-date-pickers/src/MobileDateTimePicker/tests/MobileDateTimePicker.test.tsx @@ -1,5 +1,4 @@ import * as React from 'react'; -import TextField from '@mui/material/TextField'; import { expect } from 'chai'; import { spy } from 'sinon'; import { fireTouchChangedEvent, screen, userEvent } from '@mui-internal/test-utils'; @@ -31,13 +30,7 @@ describe('', () => { }); it('should render toolbar and tabs by default', () => { - render( - } - />, - ); + render(); expect(screen.queryByMuiTest('picker-toolbar-title')).not.to.equal(null); expect(screen.getByRole('tab', { name: 'pick date' })).not.to.equal(null); diff --git a/packages/x-date-pickers/src/MobileTimePicker/MobileTimePicker.tsx b/packages/x-date-pickers/src/MobileTimePicker/MobileTimePicker.tsx index 242983fde78c7..fc8d5747ef0ea 100644 --- a/packages/x-date-pickers/src/MobileTimePicker/MobileTimePicker.tsx +++ b/packages/x-date-pickers/src/MobileTimePicker/MobileTimePicker.tsx @@ -9,13 +9,13 @@ import { useTimePickerDefaultizedProps } from '../TimePicker/shared'; import { useLocaleText, useUtils } from '../internals/hooks/useUtils'; import { PickerViewRendererLookup } from '../internals/hooks/usePicker/usePickerViews'; import { validateTime } from '../internals/utils/validation/validateTime'; -import { TimeView } from '../models'; +import { PickerValidDate, TimeView } from '../models'; import { useMobilePicker } from '../internals/hooks/useMobilePicker'; import { extractValidationProps } from '../internals/utils/validation/extractValidationProps'; import { renderTimeViewClock } from '../timeViewRenderers'; import { resolveTimeFormat } from '../internals/utils/time-utils'; -type MobileTimePickerComponent = (( +type MobileTimePickerComponent = (( props: MobileTimePickerProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -29,7 +29,7 @@ type MobileTimePickerComponent = (( * * - [MobileTimePicker API](https://mui.com/x/api/date-pickers/mobile-time-picker/) */ -const MobileTimePicker = React.forwardRef(function MobileTimePicker( +const MobileTimePicker = React.forwardRef(function MobileTimePicker( inProps: MobileTimePickerProps, ref: React.Ref, ) { @@ -120,7 +120,7 @@ MobileTimePicker.propTypes = { * The default value. * Used when the component is not controlled. */ - defaultValue: PropTypes.any, + defaultValue: PropTypes.object, /** * If `true`, the picker and text field are disabled. * @default false @@ -174,12 +174,12 @@ MobileTimePicker.propTypes = { * Maximal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - maxTime: PropTypes.any, + maxTime: PropTypes.object, /** * Minimal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - minTime: PropTypes.any, + minTime: PropTypes.object, /** * Step over minutes. * @default 1 @@ -259,7 +259,7 @@ MobileTimePicker.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * The currently selected sections. * This prop accept four formats: @@ -326,7 +326,7 @@ MobileTimePicker.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.any, + value: PropTypes.object, /** * The visible view. * Used when the component view is controlled. diff --git a/packages/x-date-pickers/src/MobileTimePicker/MobileTimePicker.types.ts b/packages/x-date-pickers/src/MobileTimePicker/MobileTimePicker.types.ts index 130e42e7a6b5c..152f1f2402ddf 100644 --- a/packages/x-date-pickers/src/MobileTimePicker/MobileTimePicker.types.ts +++ b/packages/x-date-pickers/src/MobileTimePicker/MobileTimePicker.types.ts @@ -9,19 +9,25 @@ import { BaseTimePickerSlotProps, } from '../TimePicker/shared'; import { MakeOptional } from '../internals/models/helpers'; -import { TimeView } from '../models'; +import { PickerValidDate, TimeView } from '../models'; import { TimeViewWithMeridiem } from '../internals/models'; -export interface MobileTimePickerSlots - extends BaseTimePickerSlots, +export interface MobileTimePickerSlots< + TDate extends PickerValidDate, + TView extends TimeViewWithMeridiem = TimeView, +> extends BaseTimePickerSlots, MakeOptional, 'field'> {} -export interface MobileTimePickerSlotProps - extends BaseTimePickerSlotProps, +export interface MobileTimePickerSlotProps< + TDate extends PickerValidDate, + TView extends TimeViewWithMeridiem = TimeView, +> extends BaseTimePickerSlotProps, ExportedUseMobilePickerSlotProps {} -export interface MobileTimePickerProps - extends BaseTimePickerProps, +export interface MobileTimePickerProps< + TDate extends PickerValidDate, + TView extends TimeViewWithMeridiem = TimeView, +> extends BaseTimePickerProps, MobileOnlyPickerProps { /** * Overridable component slots. diff --git a/packages/x-date-pickers/src/MonthCalendar/MonthCalendar.tsx b/packages/x-date-pickers/src/MonthCalendar/MonthCalendar.tsx index d6d5cc1dcb230..a537531d94885 100644 --- a/packages/x-date-pickers/src/MonthCalendar/MonthCalendar.tsx +++ b/packages/x-date-pickers/src/MonthCalendar/MonthCalendar.tsx @@ -18,6 +18,7 @@ import { singleItemValueManager } from '../internals/utils/valueManagers'; import { SECTION_TYPE_GRANULARITY } from '../internals/utils/getDefaultReferenceDate'; import { useControlledValueWithTimezone } from '../internals/hooks/useValueWithTimezone'; import { DIALOG_WIDTH } from '../internals/constants/dimensions'; +import { PickerValidDate } from '../models'; const useUtilityClasses = (ownerState: MonthCalendarProps) => { const { classes } = ownerState; @@ -29,7 +30,7 @@ const useUtilityClasses = (ownerState: MonthCalendarProps) => { return composeClasses(slots, getMonthCalendarUtilityClass, classes); }; -export function useMonthCalendarDefaultizedProps( +export function useMonthCalendarDefaultizedProps( props: MonthCalendarProps, name: string, ): DefaultizedProps< @@ -66,7 +67,7 @@ const MonthCalendarRoot = styled('div', { boxSizing: 'border-box', }); -type MonthCalendarComponent = (( +type MonthCalendarComponent = (( props: MonthCalendarProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -79,7 +80,7 @@ type MonthCalendarComponent = (( * * - [MonthCalendar API](https://mui.com/x/api/date-pickers/month-calendar/) */ -export const MonthCalendar = React.forwardRef(function MonthCalendar( +export const MonthCalendar = React.forwardRef(function MonthCalendar( inProps: MonthCalendarProps, ref: React.Ref, ) { @@ -314,7 +315,7 @@ MonthCalendar.propTypes = { * The default selected value. * Used when the component is not controlled. */ - defaultValue: PropTypes.any, + defaultValue: PropTypes.object, /** * If `true` picker is disabled */ @@ -339,11 +340,11 @@ MonthCalendar.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Months rendered per row. * @default 3 @@ -365,7 +366,7 @@ MonthCalendar.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid month using the validation props, except callbacks such as `shouldDisableMonth`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * Disable specific month. * @template TDate @@ -393,5 +394,5 @@ MonthCalendar.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.any, + value: PropTypes.object, } as any; diff --git a/packages/x-date-pickers/src/MonthCalendar/MonthCalendar.types.ts b/packages/x-date-pickers/src/MonthCalendar/MonthCalendar.types.ts index c621ee167c9db..c7a8a148c6f8d 100644 --- a/packages/x-date-pickers/src/MonthCalendar/MonthCalendar.types.ts +++ b/packages/x-date-pickers/src/MonthCalendar/MonthCalendar.types.ts @@ -2,7 +2,7 @@ import { SxProps } from '@mui/system'; import { Theme } from '@mui/material/styles'; import { MonthCalendarClasses } from './monthCalendarClasses'; import { BaseDateValidationProps, MonthValidationProps } from '../internals/models/validation'; -import { TimezoneProps } from '../models'; +import { PickerValidDate, TimezoneProps } from '../models'; export interface ExportedMonthCalendarProps { /** @@ -11,7 +11,7 @@ export interface ExportedMonthCalendarProps { */ monthsPerRow?: 3 | 4; } -export interface MonthCalendarProps +export interface MonthCalendarProps extends ExportedMonthCalendarProps, MonthValidationProps, BaseDateValidationProps, diff --git a/packages/x-date-pickers/src/MultiSectionDigitalClock/MultiSectionDigitalClock.tsx b/packages/x-date-pickers/src/MultiSectionDigitalClock/MultiSectionDigitalClock.tsx index 0f4fbe64df7ba..3aae2c8dcb262 100644 --- a/packages/x-date-pickers/src/MultiSectionDigitalClock/MultiSectionDigitalClock.tsx +++ b/packages/x-date-pickers/src/MultiSectionDigitalClock/MultiSectionDigitalClock.tsx @@ -17,7 +17,7 @@ import { MultiSectionDigitalClockViewProps, } from './MultiSectionDigitalClock.types'; import { getHourSectionOptions, getTimeSectionOptions } from './MultiSectionDigitalClock.utils'; -import { TimeStepOptions, TimeView } from '../models'; +import { PickerValidDate, TimeStepOptions, TimeView } from '../models'; import { TimeViewWithMeridiem } from '../internals/models'; import { useControlledValueWithTimezone } from '../internals/hooks/useValueWithTimezone'; import { singleItemValueManager } from '../internals/utils/valueManagers'; @@ -44,7 +44,7 @@ const MultiSectionDigitalClockRoot = styled(PickerViewRoot, { borderBottom: `1px solid ${(theme.vars || theme).palette.divider}`, })); -type MultiSectionDigitalClockComponent = (( +type MultiSectionDigitalClockComponent = (( props: MultiSectionDigitalClockProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -59,7 +59,7 @@ type MultiSectionDigitalClockComponent = (( * - [MultiSectionDigitalClock API](https://mui.com/x/api/date-pickers/multi-section-digital-clock/) */ export const MultiSectionDigitalClock = React.forwardRef(function MultiSectionDigitalClock< - TDate extends unknown, + TDate extends PickerValidDate, >(inProps: MultiSectionDigitalClockProps, ref: React.Ref) { const utils = useUtils(); @@ -455,7 +455,7 @@ MultiSectionDigitalClock.propTypes = { * The default selected value. * Used when the component is not controlled. */ - defaultValue: PropTypes.any, + defaultValue: PropTypes.object, /** * If `true`, the picker views and text field are disabled. * @default false @@ -484,12 +484,12 @@ MultiSectionDigitalClock.propTypes = { * Maximal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - maxTime: PropTypes.any, + maxTime: PropTypes.object, /** * Minimal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - minTime: PropTypes.any, + minTime: PropTypes.object, /** * Step over minutes. * @default 1 @@ -532,7 +532,7 @@ MultiSectionDigitalClock.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid time using the validation props, except callbacks such as `shouldDisableTime`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * Disable specific time. * @template TDate @@ -586,7 +586,7 @@ MultiSectionDigitalClock.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.any, + value: PropTypes.object, /** * The visible view. * Used when the component view is controlled. diff --git a/packages/x-date-pickers/src/MultiSectionDigitalClock/MultiSectionDigitalClock.types.ts b/packages/x-date-pickers/src/MultiSectionDigitalClock/MultiSectionDigitalClock.types.ts index 13fe496fa09fd..31f2ac1d1d73e 100644 --- a/packages/x-date-pickers/src/MultiSectionDigitalClock/MultiSectionDigitalClock.types.ts +++ b/packages/x-date-pickers/src/MultiSectionDigitalClock/MultiSectionDigitalClock.types.ts @@ -1,3 +1,4 @@ +import * as React from 'react'; import { SlotComponentProps } from '@mui/base/utils'; import MenuItem from '@mui/material/MenuItem'; import { MultiSectionDigitalClockClasses } from './multiSectionDigitalClockClasses'; @@ -8,6 +9,7 @@ import { } from '../internals/models/props/clock'; import { MultiSectionDigitalClockSectionProps } from './MultiSectionDigitalClockSection'; import { TimeViewWithMeridiem } from '../internals/models'; +import { PickerValidDate } from '../models'; export interface MultiSectionDigitalClockOption { isDisabled?: (value: TValue) => boolean; @@ -18,7 +20,7 @@ export interface MultiSectionDigitalClockOption { ariaLabel: string; } -export interface ExportedMultiSectionDigitalClockProps +export interface ExportedMultiSectionDigitalClockProps extends ExportedBaseClockProps, MultiSectionDigitalClockOnlyProps {} @@ -37,7 +39,7 @@ export interface MultiSectionDigitalClockSlotProps { digitalClockSectionItem?: SlotComponentProps>; } -export interface MultiSectionDigitalClockProps +export interface MultiSectionDigitalClockProps extends ExportedMultiSectionDigitalClockProps, BaseClockProps { /** diff --git a/packages/x-date-pickers/src/MultiSectionDigitalClock/MultiSectionDigitalClock.utils.ts b/packages/x-date-pickers/src/MultiSectionDigitalClock/MultiSectionDigitalClock.utils.ts index 660f2a7cf9dff..643fcb5e0c180 100644 --- a/packages/x-date-pickers/src/MultiSectionDigitalClock/MultiSectionDigitalClock.utils.ts +++ b/packages/x-date-pickers/src/MultiSectionDigitalClock/MultiSectionDigitalClock.utils.ts @@ -1,7 +1,7 @@ -import { MuiPickersAdapter } from '../models'; +import { MuiPickersAdapter, PickerValidDate } from '../models'; import { MultiSectionDigitalClockOption } from './MultiSectionDigitalClock.types'; -interface IGetHoursSectionOptions { +interface IGetHoursSectionOptions { now: TDate; value: TDate | null; utils: MuiPickersAdapter; @@ -12,7 +12,7 @@ interface IGetHoursSectionOptions { valueOrReferenceDate: TDate; } -export const getHourSectionOptions = ({ +export const getHourSectionOptions = ({ now, value, utils, @@ -66,7 +66,7 @@ export const getHourSectionOptions = ({ return result; }; -interface IGetTimeSectionOptions { +interface IGetTimeSectionOptions { value: number | null; utils: MuiPickersAdapter; isDisabled: (value: number) => boolean; @@ -76,7 +76,7 @@ interface IGetTimeSectionOptions { resolveAriaLabel: (value: string) => string; } -export const getTimeSectionOptions = ({ +export const getTimeSectionOptions = ({ value, utils, isDisabled, diff --git a/packages/x-date-pickers/src/PickersCalendarHeader/PickersCalendarHeader.tsx b/packages/x-date-pickers/src/PickersCalendarHeader/PickersCalendarHeader.tsx index d3367326fca6f..4edc2507e7390 100644 --- a/packages/x-date-pickers/src/PickersCalendarHeader/PickersCalendarHeader.tsx +++ b/packages/x-date-pickers/src/PickersCalendarHeader/PickersCalendarHeader.tsx @@ -22,6 +22,7 @@ import { PickersCalendarHeaderOwnerState, PickersCalendarHeaderProps, } from './PickersCalendarHeader.types'; +import { PickerValidDate } from '../models'; const useUtilityClasses = (ownerState: PickersCalendarHeaderOwnerState) => { const { classes } = ownerState; @@ -105,7 +106,7 @@ const PickersCalendarHeaderSwitchViewIcon = styled(ArrowDropDownIcon, { transform: 'rotate(0deg)', })); -type PickersCalendarHeaderComponent = (( +type PickersCalendarHeaderComponent = (( props: PickersCalendarHeaderProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -120,10 +121,9 @@ type PickersCalendarHeaderComponent = (( * * - [PickersCalendarHeader API](https://mui.com/x/api/date-pickers/pickers-calendar-header/) */ -const PickersCalendarHeader = React.forwardRef(function PickersCalendarHeader( - inProps: PickersCalendarHeaderProps, - ref: React.Ref, -) { +const PickersCalendarHeader = React.forwardRef(function PickersCalendarHeader< + TDate extends PickerValidDate, +>(inProps: PickersCalendarHeaderProps, ref: React.Ref) { const localeText = useLocaleText(); const utils = useUtils(); @@ -267,7 +267,7 @@ PickersCalendarHeader.propTypes = { */ classes: PropTypes.object, className: PropTypes.string, - currentMonth: PropTypes.any.isRequired, + currentMonth: PropTypes.object.isRequired, disabled: PropTypes.bool, disableFuture: PropTypes.bool, disablePast: PropTypes.bool, @@ -277,8 +277,8 @@ PickersCalendarHeader.propTypes = { */ format: PropTypes.string, labelId: PropTypes.string, - maxDate: PropTypes.any.isRequired, - minDate: PropTypes.any.isRequired, + maxDate: PropTypes.object.isRequired, + minDate: PropTypes.object.isRequired, onMonthChange: PropTypes.func.isRequired, onViewChange: PropTypes.func, reduceAnimations: PropTypes.bool.isRequired, diff --git a/packages/x-date-pickers/src/PickersCalendarHeader/PickersCalendarHeader.types.ts b/packages/x-date-pickers/src/PickersCalendarHeader/PickersCalendarHeader.types.ts index 506e6d4ce821f..c2270d128f8e8 100644 --- a/packages/x-date-pickers/src/PickersCalendarHeader/PickersCalendarHeader.types.ts +++ b/packages/x-date-pickers/src/PickersCalendarHeader/PickersCalendarHeader.types.ts @@ -1,3 +1,4 @@ +import * as React from 'react'; import { SlotComponentProps } from '@mui/base/utils'; import IconButton from '@mui/material/IconButton'; import SvgIcon from '@mui/material/SvgIcon'; @@ -8,7 +9,7 @@ import { PickersArrowSwitcherSlotProps, } from '../internals/components/PickersArrowSwitcher'; import { MonthValidationOptions } from '../internals/hooks/date-helpers-hooks'; -import { DateView } from '../models/views'; +import { PickerValidDate, DateView } from '../models'; import { SlideDirection } from '../DateCalendar/PickersSlideTransition'; import { PickersCalendarHeaderClasses } from './pickersCalendarHeaderClasses'; @@ -28,9 +29,11 @@ export interface PickersCalendarHeaderSlots extends PickersArrowSwitcherSlots { // We keep the interface to allow module augmentation export interface PickersCalendarHeaderSlotPropsOverrides {} -export type PickersCalendarHeaderOwnerState = PickersCalendarHeaderProps; +export type PickersCalendarHeaderOwnerState = + PickersCalendarHeaderProps; -export interface PickersCalendarHeaderSlotProps extends PickersArrowSwitcherSlotProps { +export interface PickersCalendarHeaderSlotProps + extends PickersArrowSwitcherSlotProps { switchViewButton?: SlotComponentProps< typeof IconButton, PickersCalendarHeaderSlotPropsOverrides, @@ -44,7 +47,7 @@ export interface PickersCalendarHeaderSlotProps extends PickersArrowSwitc >; } -export interface PickersCalendarHeaderProps +export interface PickersCalendarHeaderProps extends ExportedPickersArrowSwitcherProps, MonthValidationOptions { /** @@ -76,7 +79,7 @@ export interface PickersCalendarHeaderProps sx?: SxProps; } -export type ExportedPickersCalendarHeaderProps = Pick< +export type ExportedPickersCalendarHeaderProps = Pick< PickersCalendarHeaderProps, 'classes' | 'slots' | 'slotProps' >; diff --git a/packages/x-date-pickers/src/PickersDay/PickersDay.tsx b/packages/x-date-pickers/src/PickersDay/PickersDay.tsx index b226938bc31d7..b0ed7b3ac0eb7 100644 --- a/packages/x-date-pickers/src/PickersDay/PickersDay.tsx +++ b/packages/x-date-pickers/src/PickersDay/PickersDay.tsx @@ -18,6 +18,7 @@ import { getPickersDayUtilityClass, pickersDayClasses, } from './pickersDayClasses'; +import { PickerValidDate } from '../models'; export interface ExportedPickersDayProps { /** @@ -38,7 +39,7 @@ export interface ExportedPickersDayProps { showDaysOutsideCurrentMonth?: boolean; } -export interface PickersDayProps +export interface PickersDayProps extends ExportedPickersDayProps, Omit< ExtendMui, @@ -221,11 +222,11 @@ const PickersDayFiller = styled('div', { const noop = () => {}; -type PickersDayComponent = (( +type PickersDayComponent = (( props: PickersDayProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; -const PickersDayRaw = React.forwardRef(function PickersDay( +const PickersDayRaw = React.forwardRef(function PickersDay( inProps: PickersDayProps, forwardedRef: React.Ref, ) { @@ -373,7 +374,7 @@ PickersDayRaw.propTypes = { /** * The date to show. */ - day: PropTypes.any.isRequired, + day: PropTypes.object.isRequired, /** * If `true`, renders as disabled. * @default false diff --git a/packages/x-date-pickers/src/PickersLayout/PickersLayout.tsx b/packages/x-date-pickers/src/PickersLayout/PickersLayout.tsx index 4247d58b2f8ab..c76b350f092fb 100644 --- a/packages/x-date-pickers/src/PickersLayout/PickersLayout.tsx +++ b/packages/x-date-pickers/src/PickersLayout/PickersLayout.tsx @@ -7,6 +7,7 @@ import { PickersLayoutProps } from './PickersLayout.types'; import { pickersLayoutClasses, getPickersLayoutUtilityClass } from './pickersLayoutClasses'; import usePickerLayout from './usePickerLayout'; import { DateOrTimeViewWithMeridiem } from '../internals/models'; +import { PickerValidDate } from '../models'; const useUtilityClasses = (ownerState: PickersLayoutProps) => { const { isLandscape, classes } = ownerState; @@ -81,7 +82,7 @@ export const PickersLayoutContentWrapper = styled('div', { */ const PickersLayout = function PickersLayout< TValue, - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, >(inProps: PickersLayoutProps) { const props = useThemeProps({ props: inProps, name: 'MuiPickersLayout' }); diff --git a/packages/x-date-pickers/src/PickersLayout/PickersLayout.types.ts b/packages/x-date-pickers/src/PickersLayout/PickersLayout.types.ts index 40e699fc58dc0..27b0b042aae56 100644 --- a/packages/x-date-pickers/src/PickersLayout/PickersLayout.types.ts +++ b/packages/x-date-pickers/src/PickersLayout/PickersLayout.types.ts @@ -9,10 +9,11 @@ import { PickersLayoutClasses } from './pickersLayoutClasses'; import { DateOrTimeViewWithMeridiem, WrapperVariant } from '../internals/models/common'; import { PickersShortcutsProps } from '../PickersShortcuts'; import { ExportedPickersShortcutProps } from '../PickersShortcuts/PickersShortcuts'; +import { PickerValidDate } from '../models'; export interface ExportedPickersLayoutSlots< TValue, - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, > { /** @@ -34,8 +35,11 @@ export interface ExportedPickersLayoutSlots< >; } -interface PickersLayoutActionBarOwnerState - extends PickersLayoutProps { +interface PickersLayoutActionBarOwnerState< + TValue, + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +> extends PickersLayoutProps { wrapperVariant: WrapperVariant; } @@ -45,7 +49,7 @@ interface PickersShortcutsOwnerState extends PickersShortcutsProps { /** @@ -72,8 +76,11 @@ export interface ExportedPickersLayoutSlotProps< layout?: Partial>; } -export interface PickersLayoutSlots - extends ExportedPickersLayoutSlots { +export interface PickersLayoutSlots< + TValue, + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +> extends ExportedPickersLayoutSlots { /** * Tabs enabling toggling between views. */ @@ -85,8 +92,11 @@ export interface PickersLayoutSlots>; } -export interface PickersLayoutSlotProps - extends ExportedPickersLayoutSlotProps { +export interface PickersLayoutSlotProps< + TValue, + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +> extends ExportedPickersLayoutSlotProps { /** * Props passed down to the tabs component. */ @@ -97,8 +107,11 @@ export interface PickersLayoutSlotProps - extends Omit, 'value'> { +export interface PickersLayoutProps< + TValue, + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +> extends Omit, 'value'> { value?: TValue; className?: string; children?: React.ReactNode; diff --git a/packages/x-date-pickers/src/PickersLayout/usePickerLayout.tsx b/packages/x-date-pickers/src/PickersLayout/usePickerLayout.tsx index 8ba6c1afa4f5e..186649d43cd7d 100644 --- a/packages/x-date-pickers/src/PickersLayout/usePickerLayout.tsx +++ b/packages/x-date-pickers/src/PickersLayout/usePickerLayout.tsx @@ -7,6 +7,7 @@ import { getPickersLayoutUtilityClass } from './pickersLayoutClasses'; import { PickersShortcuts } from '../PickersShortcuts'; import { BaseToolbarProps } from '../internals/models/props/toolbar'; import { DateOrTimeViewWithMeridiem } from '../internals/models'; +import { PickerValidDate } from '../models'; function toolbarHasView( toolbarProps: BaseToolbarProps | any, @@ -31,14 +32,18 @@ const useUtilityClasses = (ownerState: PickersLayoutProps) => { interface PickersLayoutPropsWithValueRequired< TValue, - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, > extends PickersLayoutProps { value: TValue; } interface UsePickerLayoutResponse extends SubComponents {} -const usePickerLayout = ( +const usePickerLayout = < + TValue, + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +>( props: PickersLayoutProps, ): UsePickerLayoutResponse => { const { diff --git a/packages/x-date-pickers/src/StaticDatePicker/StaticDatePicker.tsx b/packages/x-date-pickers/src/StaticDatePicker/StaticDatePicker.tsx index b36dfb5475949..dfd1098438d5a 100644 --- a/packages/x-date-pickers/src/StaticDatePicker/StaticDatePicker.tsx +++ b/packages/x-date-pickers/src/StaticDatePicker/StaticDatePicker.tsx @@ -5,11 +5,11 @@ import { useDatePickerDefaultizedProps } from '../DatePicker/shared'; import { renderDateViewCalendar } from '../dateViewRenderers'; import { useStaticPicker } from '../internals/hooks/useStaticPicker'; import { validateDate } from '../internals/utils/validation/validateDate'; -import { DateView } from '../models'; +import { DateView, PickerValidDate } from '../models'; import { singleItemValueManager } from '../internals/utils/valueManagers'; import { PickerViewRendererLookup } from '../internals/hooks/usePicker/usePickerViews'; -type StaticDatePickerComponent = (( +type StaticDatePickerComponent = (( props: StaticDatePickerProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -23,7 +23,7 @@ type StaticDatePickerComponent = (( * * - [StaticDatePicker API](https://mui.com/x/api/date-pickers/static-date-picker/) */ -const StaticDatePicker = React.forwardRef(function StaticDatePicker( +const StaticDatePicker = React.forwardRef(function StaticDatePicker( inProps: StaticDatePickerProps, ref: React.Ref, ) { @@ -91,7 +91,7 @@ StaticDatePicker.propTypes = { * The default value. * Used when the component is not controlled. */ - defaultValue: PropTypes.any, + defaultValue: PropTypes.object, /** * If `true`, the picker and text field are disabled. * @default false @@ -141,11 +141,11 @@ StaticDatePicker.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Months rendered per row. * @default 3 @@ -219,7 +219,7 @@ StaticDatePicker.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * Component displaying when passed `loading` true. * @returns {React.ReactNode} The node to render when loading. @@ -291,7 +291,7 @@ StaticDatePicker.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.any, + value: PropTypes.object, /** * The visible view. * Used when the component view is controlled. diff --git a/packages/x-date-pickers/src/StaticDatePicker/StaticDatePicker.types.ts b/packages/x-date-pickers/src/StaticDatePicker/StaticDatePicker.types.ts index de183ec323e96..64a84459d9b4e 100644 --- a/packages/x-date-pickers/src/StaticDatePicker/StaticDatePicker.types.ts +++ b/packages/x-date-pickers/src/StaticDatePicker/StaticDatePicker.types.ts @@ -9,17 +9,17 @@ import { UseStaticPickerSlotProps, } from '../internals/hooks/useStaticPicker'; import { MakeOptional } from '../internals/models/helpers'; -import { DateView } from '../models'; +import { DateView, PickerValidDate } from '../models'; -export interface StaticDatePickerSlots +export interface StaticDatePickerSlots extends BaseDatePickerSlots, UseStaticPickerSlots {} -export interface StaticDatePickerSlotProps +export interface StaticDatePickerSlotProps extends BaseDatePickerSlotProps, UseStaticPickerSlotProps {} -export interface StaticDatePickerProps +export interface StaticDatePickerProps extends BaseDatePickerProps, MakeOptional { /** diff --git a/packages/x-date-pickers/src/StaticDateTimePicker/StaticDateTimePicker.tsx b/packages/x-date-pickers/src/StaticDateTimePicker/StaticDateTimePicker.tsx index a62f49fefc0fc..0cf76f80ac968 100644 --- a/packages/x-date-pickers/src/StaticDateTimePicker/StaticDateTimePicker.tsx +++ b/packages/x-date-pickers/src/StaticDateTimePicker/StaticDateTimePicker.tsx @@ -6,11 +6,11 @@ import { renderTimeViewClock } from '../timeViewRenderers'; import { renderDateViewCalendar } from '../dateViewRenderers'; import { singleItemValueManager } from '../internals/utils/valueManagers'; import { useStaticPicker } from '../internals/hooks/useStaticPicker'; -import { DateOrTimeView } from '../models'; +import { DateOrTimeView, PickerValidDate } from '../models'; import { validateDateTime } from '../internals/utils/validation/validateDateTime'; import { PickerViewRendererLookup } from '../internals/hooks/usePicker/usePickerViews'; -type StaticDateTimePickerComponent = (( +type StaticDateTimePickerComponent = (( props: StaticDateTimePickerProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -24,10 +24,9 @@ type StaticDateTimePickerComponent = (( * * - [StaticDateTimePicker API](https://mui.com/x/api/date-pickers/static-date-time-picker/) */ -const StaticDateTimePicker = React.forwardRef(function StaticDateTimePicker( - inProps: StaticDateTimePickerProps, - ref: React.Ref, -) { +const StaticDateTimePicker = React.forwardRef(function StaticDateTimePicker< + TDate extends PickerValidDate, +>(inProps: StaticDateTimePickerProps, ref: React.Ref) { const defaultizedProps = useDateTimePickerDefaultizedProps< TDate, DateOrTimeView, @@ -113,7 +112,7 @@ StaticDateTimePicker.propTypes = { * The default value. * Used when the component is not controlled. */ - defaultValue: PropTypes.any, + defaultValue: PropTypes.object, /** * If `true`, the picker and text field are disabled. * @default false @@ -168,29 +167,29 @@ StaticDateTimePicker.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Maximal selectable moment of time with binding to date, to set max time in each day use `maxTime`. */ - maxDateTime: PropTypes.any, + maxDateTime: PropTypes.object, /** * Maximal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - maxTime: PropTypes.any, + maxTime: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Minimal selectable moment of time with binding to date, to set min time in each day use `minTime`. */ - minDateTime: PropTypes.any, + minDateTime: PropTypes.object, /** * Minimal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - minTime: PropTypes.any, + minTime: PropTypes.object, /** * Step over minutes. * @default 1 @@ -269,7 +268,7 @@ StaticDateTimePicker.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * Component displaying when passed `loading` true. * @returns {React.ReactNode} The node to render when loading. @@ -349,7 +348,7 @@ StaticDateTimePicker.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.any, + value: PropTypes.object, /** * The visible view. * Used when the component view is controlled. diff --git a/packages/x-date-pickers/src/StaticDateTimePicker/StaticDateTimePicker.types.ts b/packages/x-date-pickers/src/StaticDateTimePicker/StaticDateTimePicker.types.ts index ead81f65a0387..e154e31b80982 100644 --- a/packages/x-date-pickers/src/StaticDateTimePicker/StaticDateTimePicker.types.ts +++ b/packages/x-date-pickers/src/StaticDateTimePicker/StaticDateTimePicker.types.ts @@ -9,17 +9,17 @@ import { UseStaticPickerSlotProps, } from '../internals/hooks/useStaticPicker'; import { MakeOptional } from '../internals/models/helpers'; -import { DateOrTimeView } from '../models'; +import { DateOrTimeView, PickerValidDate } from '../models'; -export interface StaticDateTimePickerSlots +export interface StaticDateTimePickerSlots extends BaseDateTimePickerSlots, UseStaticPickerSlots {} -export interface StaticDateTimePickerSlotProps +export interface StaticDateTimePickerSlotProps extends BaseDateTimePickerSlotProps, UseStaticPickerSlotProps {} -export interface StaticDateTimePickerProps +export interface StaticDateTimePickerProps extends BaseDateTimePickerProps, MakeOptional { /** diff --git a/packages/x-date-pickers/src/StaticTimePicker/StaticTimePicker.tsx b/packages/x-date-pickers/src/StaticTimePicker/StaticTimePicker.tsx index a5b99754c2eaf..aaf03d7301f18 100644 --- a/packages/x-date-pickers/src/StaticTimePicker/StaticTimePicker.tsx +++ b/packages/x-date-pickers/src/StaticTimePicker/StaticTimePicker.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import PropTypes from 'prop-types'; -import { TimeView } from '../models'; +import { PickerValidDate, TimeView } from '../models'; import { StaticTimePickerProps } from './StaticTimePicker.types'; import { useTimePickerDefaultizedProps } from '../TimePicker/shared'; import { renderTimeViewClock } from '../timeViewRenderers'; @@ -9,7 +9,7 @@ import { useStaticPicker } from '../internals/hooks/useStaticPicker'; import { validateTime } from '../internals/utils/validation/validateTime'; import { PickerViewRendererLookup } from '../internals/hooks/usePicker/usePickerViews'; -type StaticTimePickerComponent = (( +type StaticTimePickerComponent = (( props: StaticTimePickerProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -23,7 +23,7 @@ type StaticTimePickerComponent = (( * * - [StaticTimePicker API](https://mui.com/x/api/date-pickers/static-time-picker/) */ -const StaticTimePicker = React.forwardRef(function StaticTimePicker( +const StaticTimePicker = React.forwardRef(function StaticTimePicker( inProps: StaticTimePickerProps, ref: React.Ref, ) { @@ -97,7 +97,7 @@ StaticTimePicker.propTypes = { * The default value. * Used when the component is not controlled. */ - defaultValue: PropTypes.any, + defaultValue: PropTypes.object, /** * If `true`, the picker and text field are disabled. * @default false @@ -132,12 +132,12 @@ StaticTimePicker.propTypes = { * Maximal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - maxTime: PropTypes.any, + maxTime: PropTypes.object, /** * Minimal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - minTime: PropTypes.any, + minTime: PropTypes.object, /** * Step over minutes. * @default 1 @@ -199,7 +199,7 @@ StaticTimePicker.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * Disable specific time. * @template TDate @@ -238,7 +238,7 @@ StaticTimePicker.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.any, + value: PropTypes.object, /** * The visible view. * Used when the component view is controlled. diff --git a/packages/x-date-pickers/src/StaticTimePicker/StaticTimePicker.types.ts b/packages/x-date-pickers/src/StaticTimePicker/StaticTimePicker.types.ts index b55a15bd0714a..70d04cbe841af 100644 --- a/packages/x-date-pickers/src/StaticTimePicker/StaticTimePicker.types.ts +++ b/packages/x-date-pickers/src/StaticTimePicker/StaticTimePicker.types.ts @@ -9,17 +9,17 @@ import { UseStaticPickerSlotProps, } from '../internals/hooks/useStaticPicker'; import { MakeOptional } from '../internals/models/helpers'; -import { TimeView } from '../models'; +import { PickerValidDate, TimeView } from '../models'; -export interface StaticTimePickerSlots +export interface StaticTimePickerSlots extends BaseTimePickerSlots, UseStaticPickerSlots {} -export interface StaticTimePickerSlotProps +export interface StaticTimePickerSlotProps extends BaseTimePickerSlotProps, UseStaticPickerSlotProps {} -export interface StaticTimePickerProps +export interface StaticTimePickerProps extends BaseTimePickerProps, MakeOptional { /** diff --git a/packages/x-date-pickers/src/TimeClock/Clock.tsx b/packages/x-date-pickers/src/TimeClock/Clock.tsx index b4080f100f6d3..8b15624405619 100644 --- a/packages/x-date-pickers/src/TimeClock/Clock.tsx +++ b/packages/x-date-pickers/src/TimeClock/Clock.tsx @@ -12,11 +12,12 @@ import { useLocaleText, useUtils } from '../internals/hooks/useUtils'; import type { PickerSelectionState } from '../internals/hooks/usePicker'; import { useMeridiemMode } from '../internals/hooks/date-helpers-hooks'; import { CLOCK_HOUR_WIDTH, getHours, getMinutes } from './shared'; -import { TimeView } from '../models'; +import { PickerValidDate, TimeView } from '../models'; import { ClockClasses, getClockUtilityClass } from './clockClasses'; import { formatMeridiem } from '../internals/utils/date-utils'; -export interface ClockProps extends ReturnType { +export interface ClockProps + extends ReturnType { ampm: boolean; ampmInClock: boolean; autoFocus?: boolean; @@ -195,7 +196,7 @@ const ClockMeridiemText = styled(Typography, { /** * @ignore - internal component. */ -export function Clock(inProps: ClockProps) { +export function Clock(inProps: ClockProps) { const props = useThemeProps({ props: inProps, name: 'MuiClock' }); const { ampm, diff --git a/packages/x-date-pickers/src/TimeClock/ClockNumbers.tsx b/packages/x-date-pickers/src/TimeClock/ClockNumbers.tsx index 19188dad42796..28c34d15caf5b 100644 --- a/packages/x-date-pickers/src/TimeClock/ClockNumbers.tsx +++ b/packages/x-date-pickers/src/TimeClock/ClockNumbers.tsx @@ -1,9 +1,9 @@ import * as React from 'react'; import { ClockNumber } from './ClockNumber'; -import { MuiPickersAdapter } from '../models'; +import { MuiPickersAdapter, PickerValidDate } from '../models'; import type { PickerSelectionState } from '../internals/hooks/usePicker'; -interface GetHourNumbersOptions { +interface GetHourNumbersOptions { ampm: boolean; value: TDate | null; getClockNumberText: (hour: string) => string; @@ -20,7 +20,7 @@ interface GetHourNumbersOptions { /** * @ignore - internal component. */ -export const getHourNumbers = ({ +export const getHourNumbers = ({ ampm, value, getClockNumberText, @@ -79,7 +79,7 @@ export const getHourNumbers = ({ return hourNumbers; }; -export const getMinutesNumbers = ({ +export const getMinutesNumbers = ({ utils, value, isDisabled, diff --git a/packages/x-date-pickers/src/TimeClock/TimeClock.tsx b/packages/x-date-pickers/src/TimeClock/TimeClock.tsx index 93b8e6625af79..2e2e4186fe2da 100644 --- a/packages/x-date-pickers/src/TimeClock/TimeClock.tsx +++ b/packages/x-date-pickers/src/TimeClock/TimeClock.tsx @@ -9,7 +9,7 @@ import { convertValueToMeridiem, createIsAfterIgnoreDatePart } from '../internal import { useViews } from '../internals/hooks/useViews'; import type { PickerSelectionState } from '../internals/hooks/usePicker'; import { useMeridiemMode } from '../internals/hooks/date-helpers-hooks'; -import { TimeView } from '../models'; +import { PickerValidDate, TimeView } from '../models'; import { PickerViewRoot } from '../internals/components/PickerViewRoot'; import { getTimeClockUtilityClass } from './timeClockClasses'; import { Clock, ClockProps } from './Clock'; @@ -49,7 +49,7 @@ const TimeClockArrowSwitcher = styled(PickersArrowSwitcher, { top: 15, }); -type TimeClockComponent = (( +type TimeClockComponent = (( props: TimeClockProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -65,7 +65,7 @@ const TIME_CLOCK_DEFAULT_VIEWS: TimeView[] = ['hours', 'minutes']; * * - [TimeClock API](https://mui.com/x/api/date-pickers/time-clock/) */ -export const TimeClock = React.forwardRef(function TimeClock( +export const TimeClock = React.forwardRef(function TimeClock( inProps: TimeClockProps, ref: React.Ref, ) { @@ -417,7 +417,7 @@ TimeClock.propTypes = { * The default selected value. * Used when the component is not controlled. */ - defaultValue: PropTypes.any, + defaultValue: PropTypes.object, /** * If `true`, the picker views and text field are disabled. * @default false @@ -446,12 +446,12 @@ TimeClock.propTypes = { * Maximal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - maxTime: PropTypes.any, + maxTime: PropTypes.object, /** * Minimal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - minTime: PropTypes.any, + minTime: PropTypes.object, /** * Step over minutes. * @default 1 @@ -494,7 +494,7 @@ TimeClock.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid time using the validation props, except callbacks such as `shouldDisableTime`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * Disable specific time. * @template TDate @@ -534,7 +534,7 @@ TimeClock.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.any, + value: PropTypes.object, /** * The visible view. * Used when the component view is controlled. diff --git a/packages/x-date-pickers/src/TimeClock/TimeClock.types.ts b/packages/x-date-pickers/src/TimeClock/TimeClock.types.ts index afb3a935e5531..fda54930f817a 100644 --- a/packages/x-date-pickers/src/TimeClock/TimeClock.types.ts +++ b/packages/x-date-pickers/src/TimeClock/TimeClock.types.ts @@ -4,10 +4,11 @@ import { PickersArrowSwitcherSlotProps, } from '../internals/components/PickersArrowSwitcher'; import { BaseClockProps, ExportedBaseClockProps } from '../internals/models/props/clock'; -import { TimeView } from '../models'; +import { PickerValidDate, TimeView } from '../models'; import { TimeViewWithMeridiem } from '../internals/models'; -export interface ExportedTimeClockProps extends ExportedBaseClockProps { +export interface ExportedTimeClockProps + extends ExportedBaseClockProps { /** * Display ampm controls under the clock (instead of in the toolbar). * @default false @@ -19,8 +20,10 @@ export interface TimeClockSlots extends PickersArrowSwitcherSlots {} export interface TimeClockSlotProps extends PickersArrowSwitcherSlotProps {} -export interface TimeClockProps - extends ExportedTimeClockProps, +export interface TimeClockProps< + TDate extends PickerValidDate, + TView extends TimeViewWithMeridiem = TimeView, +> extends ExportedTimeClockProps, BaseClockProps { /** * Available views. diff --git a/packages/x-date-pickers/src/TimeField/TimeField.tsx b/packages/x-date-pickers/src/TimeField/TimeField.tsx index 495ae41d528ec..612df5b2f35a2 100644 --- a/packages/x-date-pickers/src/TimeField/TimeField.tsx +++ b/packages/x-date-pickers/src/TimeField/TimeField.tsx @@ -8,8 +8,9 @@ import { TimeFieldProps, TimeFieldSlotProps } from './TimeField.types'; import { useTimeField } from './useTimeField'; import { useClearableField } from '../hooks'; import { convertFieldResponseIntoMuiTextFieldProps } from '../internals/utils/convertFieldResponseIntoMuiTextFieldProps'; +import { PickerValidDate } from '../models'; -type TimeFieldComponent = (( +type TimeFieldComponent = (( props: TimeFieldProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -23,7 +24,7 @@ type TimeFieldComponent = (( * * - [TimeField API](https://mui.com/x/api/date-pickers/time-field/) */ -const TimeField = React.forwardRef(function TimeField( +const TimeField = React.forwardRef(function TimeField( inProps: TimeFieldProps, inRef: React.Ref, ) { @@ -100,7 +101,7 @@ TimeField.propTypes = { /** * The default value. Use when the component is not controlled. */ - defaultValue: PropTypes.any, + defaultValue: PropTypes.object, /** * If `true`, the component is disabled. * @default false @@ -193,12 +194,12 @@ TimeField.propTypes = { * Maximal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - maxTime: PropTypes.any, + maxTime: PropTypes.object, /** * Minimal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - minTime: PropTypes.any, + minTime: PropTypes.object, /** * Step over minutes. * @default 1 @@ -246,7 +247,7 @@ TimeField.propTypes = { * For example, on time fields it will be used to determine the date to set. * @default The closest valid date using the validation props, except callbacks such as `shouldDisableDate`. Value is rounded to the most granular section used. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * If `true`, the label is displayed as required and the `input` element is required. * @default false @@ -342,7 +343,7 @@ TimeField.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.any, + value: PropTypes.object, /** * The variant to use. * @default 'outlined' diff --git a/packages/x-date-pickers/src/TimeField/TimeField.types.ts b/packages/x-date-pickers/src/TimeField/TimeField.types.ts index 46c7b4659e5b2..b78ed842f6f30 100644 --- a/packages/x-date-pickers/src/TimeField/TimeField.types.ts +++ b/packages/x-date-pickers/src/TimeField/TimeField.types.ts @@ -5,10 +5,10 @@ import { UseFieldInternalProps } from '../internals/hooks/useField'; import { DefaultizedProps, MakeOptional } from '../internals/models/helpers'; import { BaseTimeValidationProps, TimeValidationProps } from '../internals/models/validation'; import { FieldsTextFieldProps } from '../internals/models/fields'; -import { FieldSection, TimeValidationError } from '../models'; +import { FieldSection, PickerValidDate, TimeValidationError } from '../models'; import { UseClearableFieldSlots, UseClearableFieldSlotProps } from '../hooks/useClearableField'; -export interface UseTimeFieldProps +export interface UseTimeFieldProps extends MakeOptional< UseFieldInternalProps, 'format' @@ -22,18 +22,17 @@ export interface UseTimeFieldProps ampm?: boolean; } -export type UseTimeFieldDefaultizedProps = DefaultizedProps< +export type UseTimeFieldDefaultizedProps = DefaultizedProps< UseTimeFieldProps, keyof BaseTimeValidationProps | 'format' >; -export type UseTimeFieldComponentProps = Omit< - TChildProps, - keyof UseTimeFieldProps -> & - UseTimeFieldProps; +export type UseTimeFieldComponentProps< + TDate extends PickerValidDate, + TChildProps extends {}, +> = Omit> & UseTimeFieldProps; -export interface TimeFieldProps +export interface TimeFieldProps extends UseTimeFieldComponentProps { /** * Overridable component slots. @@ -47,7 +46,7 @@ export interface TimeFieldProps slotProps?: TimeFieldSlotProps; } -export type TimeFieldOwnerState = TimeFieldProps; +export type TimeFieldOwnerState = TimeFieldProps; export interface TimeFieldSlots extends UseClearableFieldSlots { /** @@ -58,6 +57,7 @@ export interface TimeFieldSlots extends UseClearableFieldSlots { textField?: React.ElementType; } -export interface TimeFieldSlotProps extends UseClearableFieldSlotProps { +export interface TimeFieldSlotProps + extends UseClearableFieldSlotProps { textField?: SlotComponentProps>; } diff --git a/packages/x-date-pickers/src/TimeField/useTimeField.ts b/packages/x-date-pickers/src/TimeField/useTimeField.ts index fdaf7485cbf8a..1c6cf0089253e 100644 --- a/packages/x-date-pickers/src/TimeField/useTimeField.ts +++ b/packages/x-date-pickers/src/TimeField/useTimeField.ts @@ -11,8 +11,9 @@ import { import { validateTime } from '../internals/utils/validation/validateTime'; import { useUtils } from '../internals/hooks/useUtils'; import { splitFieldInternalAndForwardedProps } from '../internals/utils/fields'; +import { PickerValidDate } from '../models'; -const useDefaultizedTimeField = ( +const useDefaultizedTimeField = ( props: UseTimeFieldProps, ): AdditionalProps & UseTimeFieldDefaultizedProps => { const utils = useUtils(); @@ -28,7 +29,7 @@ const useDefaultizedTimeField = ( } as any; }; -export const useTimeField = ( +export const useTimeField = ( inProps: UseTimeFieldComponentProps, ) => { const props = useDefaultizedTimeField(inProps); diff --git a/packages/x-date-pickers/src/TimePicker/TimePicker.tsx b/packages/x-date-pickers/src/TimePicker/TimePicker.tsx index b78288e0e7872..0928d469cc9c8 100644 --- a/packages/x-date-pickers/src/TimePicker/TimePicker.tsx +++ b/packages/x-date-pickers/src/TimePicker/TimePicker.tsx @@ -7,8 +7,9 @@ import { DesktopTimePicker } from '../DesktopTimePicker'; import { MobileTimePicker, MobileTimePickerProps } from '../MobileTimePicker'; import { TimePickerProps } from './TimePicker.types'; import { DEFAULT_DESKTOP_MODE_MEDIA_QUERY } from '../internals/utils/utils'; +import { PickerValidDate } from '../models'; -type TimePickerComponent = (( +type TimePickerComponent = (( props: TimePickerProps & React.RefAttributes, ) => React.JSX.Element) & { propTypes?: any }; @@ -22,7 +23,7 @@ type TimePickerComponent = (( * * - [TimePicker API](https://mui.com/x/api/date-pickers/time-picker/) */ -const TimePicker = React.forwardRef(function TimePicker( +const TimePicker = React.forwardRef(function TimePicker( inProps: TimePickerProps, ref: React.Ref, ) { @@ -72,7 +73,7 @@ TimePicker.propTypes = { * The default value. * Used when the component is not controlled. */ - defaultValue: PropTypes.any, + defaultValue: PropTypes.object, /** * CSS media query when `Mobile` mode will be changed to `Desktop`. * @default '@media (pointer: fine)' @@ -132,12 +133,12 @@ TimePicker.propTypes = { * Maximal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - maxTime: PropTypes.any, + maxTime: PropTypes.object, /** * Minimal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. */ - minTime: PropTypes.any, + minTime: PropTypes.object, /** * Step over minutes. * @default 1 @@ -217,7 +218,7 @@ TimePicker.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid date-time using the validation props, except callbacks like `shouldDisable<...>`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * The currently selected sections. * This prop accept four formats: @@ -305,7 +306,7 @@ TimePicker.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.any, + value: PropTypes.object, /** * The visible view. * Used when the component view is controlled. diff --git a/packages/x-date-pickers/src/TimePicker/TimePicker.types.ts b/packages/x-date-pickers/src/TimePicker/TimePicker.types.ts index 3bf24d7725e1b..5561198004888 100644 --- a/packages/x-date-pickers/src/TimePicker/TimePicker.types.ts +++ b/packages/x-date-pickers/src/TimePicker/TimePicker.types.ts @@ -9,16 +9,17 @@ import { MobileTimePickerSlots, MobileTimePickerSlotProps, } from '../MobileTimePicker'; +import { PickerValidDate } from '../models'; -export interface TimePickerSlots +export interface TimePickerSlots extends DesktopTimePickerSlots, MobileTimePickerSlots {} -export interface TimePickerSlotProps +export interface TimePickerSlotProps extends DesktopTimePickerSlotProps, MobileTimePickerSlotProps {} -export interface TimePickerProps +export interface TimePickerProps extends DesktopTimePickerProps, Omit, 'views'> { /** diff --git a/packages/x-date-pickers/src/TimePicker/TimePickerToolbar.tsx b/packages/x-date-pickers/src/TimePicker/TimePickerToolbar.tsx index 89151a022a9e5..78614cdb22f21 100644 --- a/packages/x-date-pickers/src/TimePicker/TimePickerToolbar.tsx +++ b/packages/x-date-pickers/src/TimePicker/TimePickerToolbar.tsx @@ -16,8 +16,9 @@ import { } from './timePickerToolbarClasses'; import { TimeViewWithMeridiem } from '../internals/models'; import { formatMeridiem } from '../internals/utils/date-utils'; +import { PickerValidDate } from '../models'; -export interface TimePickerToolbarProps +export interface TimePickerToolbarProps extends BaseToolbarProps { ampm?: boolean; ampmInClock?: boolean; @@ -153,7 +154,7 @@ TimePickerToolbarAmPmSelection.propTypes = { * * - [TimePickerToolbar API](https://mui.com/x/api/date-pickers/time-picker-toolbar/) */ -function TimePickerToolbar(inProps: TimePickerToolbarProps) { +function TimePickerToolbar(inProps: TimePickerToolbarProps) { const props = useThemeProps({ props: inProps, name: 'MuiTimePickerToolbar' }); const { ampm, @@ -302,7 +303,7 @@ TimePickerToolbar.propTypes = { * @default "––" */ toolbarPlaceholder: PropTypes.node, - value: PropTypes.any, + value: PropTypes.object, /** * Currently visible picker view. */ diff --git a/packages/x-date-pickers/src/TimePicker/shared.tsx b/packages/x-date-pickers/src/TimePicker/shared.tsx index b1812f13fb69e..763948a3398ad 100644 --- a/packages/x-date-pickers/src/TimePicker/shared.tsx +++ b/packages/x-date-pickers/src/TimePicker/shared.tsx @@ -11,14 +11,14 @@ import { ExportedTimePickerToolbarProps, TimePickerToolbar, } from './TimePickerToolbar'; -import { TimeValidationError } from '../models'; +import { PickerValidDate, TimeValidationError } from '../models'; import { PickerViewRendererLookup } from '../internals/hooks/usePicker/usePickerViews'; import { TimeViewRendererProps } from '../timeViewRenderers'; import { applyDefaultViewProps } from '../internals/utils/views'; import { BaseClockProps, ExportedBaseClockProps } from '../internals/models/props/clock'; import { TimeViewWithMeridiem } from '../internals/models'; -export interface BaseTimePickerSlots extends TimeClockSlots { +export interface BaseTimePickerSlots extends TimeClockSlots { /** * Custom component for the toolbar rendered above the views. * @default TimePickerToolbar @@ -30,8 +30,10 @@ export interface BaseTimePickerSlotProps extends TimeClockSlotProps { toolbar?: ExportedTimePickerToolbarProps; } -export interface BaseTimePickerProps - extends BasePickerInputProps, +export interface BaseTimePickerProps< + TDate extends PickerValidDate, + TView extends TimeViewWithMeridiem, +> extends BasePickerInputProps, ExportedBaseClockProps { /** * Display ampm controls under the clock (instead of in the toolbar). @@ -64,7 +66,7 @@ export interface BaseTimePickerProps } type UseTimePickerDefaultizedProps< - TDate, + TDate extends PickerValidDate, TView extends TimeViewWithMeridiem, Props extends BaseTimePickerProps, > = LocalizedComponent< @@ -73,7 +75,7 @@ type UseTimePickerDefaultizedProps< >; export function useTimePickerDefaultizedProps< - TDate, + TDate extends PickerValidDate, TView extends TimeViewWithMeridiem, Props extends BaseTimePickerProps, >(props: Props, name: string): UseTimePickerDefaultizedProps { diff --git a/packages/x-date-pickers/src/YearCalendar/YearCalendar.tsx b/packages/x-date-pickers/src/YearCalendar/YearCalendar.tsx index f3765c4dfbd66..8f882c62c6b47 100644 --- a/packages/x-date-pickers/src/YearCalendar/YearCalendar.tsx +++ b/packages/x-date-pickers/src/YearCalendar/YearCalendar.tsx @@ -19,6 +19,7 @@ import { singleItemValueManager } from '../internals/utils/valueManagers'; import { SECTION_TYPE_GRANULARITY } from '../internals/utils/getDefaultReferenceDate'; import { useControlledValueWithTimezone } from '../internals/hooks/useValueWithTimezone'; import { DIALOG_WIDTH, MAX_CALENDAR_HEIGHT } from '../internals/constants/dimensions'; +import { PickerValidDate } from '../models'; const useUtilityClasses = (ownerState: YearCalendarProps) => { const { classes } = ownerState; @@ -30,7 +31,7 @@ const useUtilityClasses = (ownerState: YearCalendarProps) => { return composeClasses(slots, getYearCalendarUtilityClass, classes); }; -function useYearCalendarDefaultizedProps( +function useYearCalendarDefaultizedProps( props: YearCalendarProps, name: string, ): DefaultizedProps< @@ -72,7 +73,9 @@ const YearCalendarRoot = styled('div', { position: 'relative', }); -type YearCalendarComponent = ((props: YearCalendarProps) => React.JSX.Element) & { +type YearCalendarComponent = (( + props: YearCalendarProps, +) => React.JSX.Element) & { propTypes?: any; }; @@ -85,7 +88,7 @@ type YearCalendarComponent = ((props: YearCalendarProps) => React. * * - [YearCalendar API](https://mui.com/x/api/date-pickers/year-calendar/) */ -export const YearCalendar = React.forwardRef(function YearCalendar( +export const YearCalendar = React.forwardRef(function YearCalendar( inProps: YearCalendarProps, ref: React.Ref, ) { @@ -340,7 +343,7 @@ YearCalendar.propTypes = { * The default selected value. * Used when the component is not controlled. */ - defaultValue: PropTypes.any, + defaultValue: PropTypes.object, /** * If `true` picker is disabled */ @@ -365,11 +368,11 @@ YearCalendar.propTypes = { /** * Maximal selectable date. */ - maxDate: PropTypes.any, + maxDate: PropTypes.object, /** * Minimal selectable date. */ - minDate: PropTypes.any, + minDate: PropTypes.object, /** * Callback fired when the value changes. * @template TDate @@ -386,7 +389,7 @@ YearCalendar.propTypes = { * The date used to generate the new value when both `value` and `defaultValue` are empty. * @default The closest valid year using the validation props, except callbacks such as `shouldDisableYear`. */ - referenceDate: PropTypes.any, + referenceDate: PropTypes.object, /** * Disable specific year. * @template TDate @@ -414,7 +417,7 @@ YearCalendar.propTypes = { * The selected value. * Used when the component is controlled. */ - value: PropTypes.any, + value: PropTypes.object, /** * Years rendered per row. * @default 3 diff --git a/packages/x-date-pickers/src/YearCalendar/YearCalendar.types.ts b/packages/x-date-pickers/src/YearCalendar/YearCalendar.types.ts index bff9ff54b52c9..c972ae68ee4ce 100644 --- a/packages/x-date-pickers/src/YearCalendar/YearCalendar.types.ts +++ b/packages/x-date-pickers/src/YearCalendar/YearCalendar.types.ts @@ -2,7 +2,7 @@ import { SxProps } from '@mui/system'; import { Theme } from '@mui/material/styles'; import { YearCalendarClasses } from './yearCalendarClasses'; import { BaseDateValidationProps, YearValidationProps } from '../internals/models/validation'; -import { TimezoneProps } from '../models'; +import { PickerValidDate, TimezoneProps } from '../models'; export interface ExportedYearCalendarProps { /** @@ -16,7 +16,7 @@ export interface ExportedYearCalendarProps { yearsReversed?: boolean; } -export interface YearCalendarProps +export interface YearCalendarProps extends ExportedYearCalendarProps, YearValidationProps, BaseDateValidationProps, diff --git a/packages/x-date-pickers/src/dateTimeViewRenderers/dateTimeViewRenderers.tsx b/packages/x-date-pickers/src/dateTimeViewRenderers/dateTimeViewRenderers.tsx index 7e9d4340e0571..80ea74129e606 100644 --- a/packages/x-date-pickers/src/dateTimeViewRenderers/dateTimeViewRenderers.tsx +++ b/packages/x-date-pickers/src/dateTimeViewRenderers/dateTimeViewRenderers.tsx @@ -17,8 +17,9 @@ import { } from '../timeViewRenderers'; import { digitalClockClasses } from '../DigitalClock'; import { VIEW_HEIGHT } from '../internals/constants/dimensions'; +import { PickerValidDate } from '../models'; -export interface DateTimeViewRendererProps +export interface DateTimeViewRendererProps extends Omit< DateCalendarProps & MultiSectionDigitalClockProps, 'views' | 'openTo' | 'view' | 'onViewChange' | 'focusedView' | 'slots' | 'slotProps' @@ -32,7 +33,7 @@ export interface DateTimeViewRendererProps shouldRenderTimeInASingleColumn: boolean; } -export const renderDesktopDateTimeView = ({ +export const renderDesktopDateTimeView = ({ view, onViewChange, views, diff --git a/packages/x-date-pickers/src/dateViewRenderers/dateViewRenderers.tsx b/packages/x-date-pickers/src/dateViewRenderers/dateViewRenderers.tsx index b353c8e3382c8..fc791c0e75de9 100644 --- a/packages/x-date-pickers/src/dateViewRenderers/dateViewRenderers.tsx +++ b/packages/x-date-pickers/src/dateViewRenderers/dateViewRenderers.tsx @@ -1,11 +1,13 @@ import * as React from 'react'; import { DateCalendar, DateCalendarProps } from '../DateCalendar'; -import { DateView } from '../models'; +import { DateView, PickerValidDate } from '../models'; import { DateOrTimeViewWithMeridiem } from '../internals/models'; import { isDatePickerView } from '../internals/utils/date-utils'; -export interface DateViewRendererProps - extends Omit< +export interface DateViewRendererProps< + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +> extends Omit< DateCalendarProps, 'views' | 'openTo' | 'view' | 'onViewChange' | 'focusedView' > { @@ -15,7 +17,7 @@ export interface DateViewRendererProps({ +export const renderDateViewCalendar = ({ view, onViewChange, views, diff --git a/packages/x-date-pickers/src/internals/hooks/date-helpers-hooks.tsx b/packages/x-date-pickers/src/internals/hooks/date-helpers-hooks.tsx index e4f299d8ae139..7fcdcba1b2c97 100644 --- a/packages/x-date-pickers/src/internals/hooks/date-helpers-hooks.tsx +++ b/packages/x-date-pickers/src/internals/hooks/date-helpers-hooks.tsx @@ -3,9 +3,9 @@ import { useUtils } from './useUtils'; import { PickerOnChangeFn } from './useViews'; import { getMeridiem, convertToMeridiem } from '../utils/time-utils'; import { PickerSelectionState } from './usePicker'; -import { PickersTimezone } from '../../models'; +import { PickersTimezone, PickerValidDate } from '../../models'; -export interface MonthValidationOptions { +export interface MonthValidationOptions { disablePast?: boolean; disableFuture?: boolean; minDate: TDate; @@ -13,7 +13,7 @@ export interface MonthValidationOptions { timezone: PickersTimezone; } -export function useNextMonthDisabled( +export function useNextMonthDisabled( month: TDate, { disableFuture, @@ -31,7 +31,7 @@ export function useNextMonthDisabled( }, [disableFuture, maxDate, month, utils, timezone]); } -export function usePreviousMonthDisabled( +export function usePreviousMonthDisabled( month: TDate, { disablePast, @@ -50,7 +50,7 @@ export function usePreviousMonthDisabled( }, [disablePast, minDate, month, utils, timezone]); } -export function useMeridiemMode( +export function useMeridiemMode( date: TDate | null, ampm: boolean | undefined, onChange: PickerOnChangeFn, diff --git a/packages/x-date-pickers/src/internals/hooks/useClockReferenceDate.ts b/packages/x-date-pickers/src/internals/hooks/useClockReferenceDate.ts index f7f4062bad211..03afe046d50c6 100644 --- a/packages/x-date-pickers/src/internals/hooks/useClockReferenceDate.ts +++ b/packages/x-date-pickers/src/internals/hooks/useClockReferenceDate.ts @@ -1,10 +1,10 @@ import * as React from 'react'; -import { MuiPickersAdapter, PickersTimezone } from '../../models'; +import { MuiPickersAdapter, PickersTimezone, PickerValidDate } from '../../models'; import { singleItemValueManager } from '../utils/valueManagers'; import { getTodayDate } from '../utils/date-utils'; import { SECTION_TYPE_GRANULARITY } from '../utils/getDefaultReferenceDate'; -export const useClockReferenceDate = ({ +export const useClockReferenceDate = ({ value, referenceDate: referenceDateProp, utils, diff --git a/packages/x-date-pickers/src/internals/hooks/useDesktopPicker/useDesktopPicker.tsx b/packages/x-date-pickers/src/internals/hooks/useDesktopPicker/useDesktopPicker.tsx index 7c6a84ddec528..52418e14d0ac6 100644 --- a/packages/x-date-pickers/src/internals/hooks/useDesktopPicker/useDesktopPicker.tsx +++ b/packages/x-date-pickers/src/internals/hooks/useDesktopPicker/useDesktopPicker.tsx @@ -15,7 +15,7 @@ import { usePicker } from '../usePicker'; import { LocalizationProvider } from '../../../LocalizationProvider'; import { PickersLayout } from '../../../PickersLayout'; import { InferError } from '../useValidation'; -import { FieldSection, BaseSingleInputFieldProps } from '../../../models'; +import { FieldSection, BaseSingleInputFieldProps, PickerValidDate } from '../../../models'; import { DateOrTimeViewWithMeridiem } from '../../models'; import { UsePickerValueFieldResponse } from '../usePicker/usePickerValue.types'; @@ -26,7 +26,7 @@ import { UsePickerValueFieldResponse } from '../usePicker/usePickerValue.types'; * - DesktopTimePicker */ export const useDesktopPicker = < - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TExternalProps extends UseDesktopPickerProps, >({ 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 3c661b0c11f52..64118161d17d8 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 @@ -10,7 +10,12 @@ import { } from '../../models/props/basePickerProps'; import { PickersPopperSlots, PickersPopperSlotProps } from '../../components/PickersPopper'; import { UsePickerParams, UsePickerProps } from '../usePicker'; -import { BaseSingleInputFieldProps, FieldSection, MuiPickersAdapter } from '../../../models'; +import { + BaseSingleInputFieldProps, + FieldSection, + MuiPickersAdapter, + PickerValidDate, +} from '../../../models'; import { ExportedPickersLayoutSlots, ExportedPickersLayoutSlotProps, @@ -24,8 +29,10 @@ import { UseClearableFieldSlotProps, } from '../../../hooks/useClearableField'; -export interface UseDesktopPickerSlots - extends Pick< +export interface UseDesktopPickerSlots< + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +> extends Pick< PickersPopperSlots, 'desktopPaper' | 'desktopTransition' | 'desktopTrapFocus' | 'popper' >, @@ -57,12 +64,16 @@ export interface UseDesktopPickerSlots - extends ExportedUseDesktopPickerSlotProps, +export interface UseDesktopPickerSlotProps< + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +> extends ExportedUseDesktopPickerSlotProps, Pick, 'toolbar'> {} -export interface ExportedUseDesktopPickerSlotProps - extends PickersPopperSlotProps, +export interface ExportedUseDesktopPickerSlotProps< + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +> extends PickersPopperSlotProps, ExportedPickersLayoutSlotProps, UseClearableFieldSlotProps { field?: SlotComponentProps< @@ -80,7 +91,7 @@ export interface ExportedUseDesktopPickerSlotProps; } -export interface DesktopOnlyPickerProps +export interface DesktopOnlyPickerProps extends BaseNonStaticPickerProps, BaseNonRangeNonStaticPickerProps, UsePickerValueNonStaticProps, @@ -92,7 +103,7 @@ export interface DesktopOnlyPickerProps } export interface UseDesktopPickerProps< - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TError, TExternalProps extends UsePickerViewsProps, @@ -111,7 +122,7 @@ export interface UseDesktopPickerProps< } export interface UseDesktopPickerParams< - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TExternalProps extends UseDesktopPickerProps, > extends Pick< diff --git a/packages/x-date-pickers/src/internals/hooks/useField/useField.ts b/packages/x-date-pickers/src/internals/hooks/useField/useField.ts index 6afb33b07eb22..740054ce131d7 100644 --- a/packages/x-date-pickers/src/internals/hooks/useField/useField.ts +++ b/packages/x-date-pickers/src/internals/hooks/useField/useField.ts @@ -16,11 +16,11 @@ import { adjustSectionValue, isAndroid, cleanString, getSectionOrder } from './u import { useFieldState } from './useFieldState'; import { useFieldCharacterEditing } from './useFieldCharacterEditing'; import { getActiveElement } from '../../utils/utils'; -import { FieldSection } from '../../../models'; +import { FieldSection, PickerValidDate } from '../../../models'; export const useField = < TValue, - TDate, + TDate extends PickerValidDate, TSection extends FieldSection, TForwardedProps extends UseFieldForwardedProps, TInternalProps extends UseFieldInternalProps & { minutesStep?: number }, 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 cf0e3de7ea40c..6bfc7d3580935 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 @@ -8,13 +8,14 @@ import { FieldSectionContentType, FieldValueType, PickersTimezone, + PickerValidDate, } from '../../../models'; import type { PickerValueManager } from '../usePicker'; import { InferError, Validator } from '../useValidation'; export interface UseFieldParams< TValue, - TDate, + TDate extends PickerValidDate, TSection extends FieldSection, TForwardedProps extends UseFieldForwardedProps, TInternalProps extends UseFieldInternalProps, @@ -32,8 +33,12 @@ export interface UseFieldParams< valueType: FieldValueType; } -export interface UseFieldInternalProps - extends TimezoneProps { +export interface UseFieldInternalProps< + TValue, + TDate extends PickerValidDate, + TSection extends FieldSection, + TError, +> extends TimezoneProps { /** * The selected value. * Used when the component is controlled. @@ -183,12 +188,15 @@ export type FieldSectionWithoutPosition; -export type FieldSectionValueBoundaries = { +export type FieldSectionValueBoundaries< + TDate extends PickerValidDate, + SectionType extends FieldSectionType, +> = { minimum: number; maximum: number; } & (SectionType extends 'day' ? { longestMonth: TDate } : {}); -export type FieldSectionsValueBoundaries = { +export type FieldSectionsValueBoundaries = { [SectionType in FieldSectionType]: (params: { currentDate: TDate | null; format: string; @@ -209,7 +217,11 @@ export interface FieldChangeHandlerContext { * Object used to access and update the active date (i.e: the date containing the active section). * Mainly useful in the range fields where we need to update the date containing the active section without impacting the other one. */ -interface FieldActiveDateManager { +interface FieldActiveDateManager< + TValue, + TDate extends PickerValidDate, + TSection extends FieldSection, +> { /** * Active date from `state.value`. */ @@ -245,7 +257,11 @@ export type FieldSelectedSectionsIndexes = { shouldSelectBoundarySelectors: boolean; }; -export interface FieldValueManager { +export interface FieldValueManager< + TValue, + TDate extends PickerValidDate, + TSection extends FieldSection, +> { /** * Creates the section list from the current value. * The `prevSections` are used on the range fields to avoid losing the sections of a partially filled date when editing the other date. 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 cfbea21b8f719..2f6ad0ab5b404 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 @@ -13,11 +13,12 @@ import { MuiPickersAdapter, FieldSectionContentType, PickersTimezone, + PickerValidDate, } from '../../../models'; import { PickersLocaleText } from '../../../locales/utils/pickersLocaleTextApi'; import { getMonthsInYear } from '../../utils/date-utils'; -export const getDateSectionConfigFromFormatToken = ( +export const getDateSectionConfigFromFormatToken = ( utils: MuiPickersAdapter, formatToken: string, ): Pick & { maxLength: number | undefined } => { @@ -62,7 +63,7 @@ const getDeltaFromKeyCode = (keyCode: Omit( +export const getDaysInWeekStr = ( utils: MuiPickersAdapter, timezone: PickersTimezone, format: string, @@ -82,7 +83,7 @@ export const getDaysInWeekStr = ( return elements.map((weekDay) => utils.formatByString(weekDay, format)); }; -export const getLetterEditingOptions = ( +export const getLetterEditingOptions = ( utils: MuiPickersAdapter, timezone: PickersTimezone, sectionType: FieldSectionType, @@ -118,7 +119,9 @@ export const FORMAT_SECONDS_NO_LEADING_ZEROS = 's'; const NON_LOCALIZED_DIGITS = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9']; -export const getLocalizedDigits = (utils: MuiPickersAdapter) => { +export const getLocalizedDigits = ( + utils: MuiPickersAdapter, +) => { const today = utils.date(undefined); const formattedZero = utils.formatByString( utils.setSeconds(today, 0), @@ -188,7 +191,7 @@ export const cleanLeadingZeros = (valueStr: string, size: number) => { return cleanValueStr; }; -export const cleanDigitSectionValue = ( +export const cleanDigitSectionValue = ( utils: MuiPickersAdapter, value: number, sectionBoundaries: FieldSectionValueBoundaries, @@ -231,7 +234,7 @@ export const cleanDigitSectionValue = ( return applyLocalizedDigits(valueStr, localizedDigits); }; -export const adjustSectionValue = ( +export const adjustSectionValue = ( utils: MuiPickersAdapter, timezone: PickersTimezone, section: TSection, @@ -417,7 +420,7 @@ export const addPositionPropertiesToSections = ( return newSections; }; -const getSectionPlaceholder = ( +const getSectionPlaceholder = ( utils: MuiPickersAdapter, timezone: PickersTimezone, localeText: PickersLocaleText, @@ -472,7 +475,7 @@ const getSectionPlaceholder = ( } }; -export const changeSectionValueFormat = ( +export const changeSectionValueFormat = ( utils: MuiPickersAdapter, valueStr: string, currentFormat: string, @@ -487,13 +490,13 @@ export const changeSectionValueFormat = ( return utils.formatByString(utils.parse(valueStr, currentFormat)!, newFormat); }; -const isFourDigitYearFormat = ( +const isFourDigitYearFormat = ( utils: MuiPickersAdapter, timezone: PickersTimezone, format: string, ) => utils.formatByString(utils.date(undefined, timezone), format).length === 4; -export const doesSectionFormatHaveLeadingZeros = ( +export const doesSectionFormatHaveLeadingZeros = ( utils: MuiPickersAdapter, timezone: PickersTimezone, contentType: FieldSectionContentType, @@ -548,7 +551,10 @@ export const doesSectionFormatHaveLeadingZeros = ( } }; -const getEscapedPartsFromFormat = (utils: MuiPickersAdapter, format: string) => { +const getEscapedPartsFromFormat = ( + utils: MuiPickersAdapter, + format: string, +) => { const escapedParts: { start: number; end: number }[] = []; const { start: startChar, end: endChar } = utils.escapedCharacters; const regExp = new RegExp(`(\\${startChar}[^\\${endChar}]*\\${endChar})+`, 'g'); @@ -562,7 +568,7 @@ const getEscapedPartsFromFormat = (utils: MuiPickersAdapter, forma return escapedParts; }; -export const splitFormatIntoSections = ( +export const splitFormatIntoSections = ( utils: MuiPickersAdapter, timezone: PickersTimezone, localeText: PickersLocaleText, @@ -743,7 +749,7 @@ export const splitFormatIntoSections = ( * Some date libraries like `dayjs` don't support parsing from date with escaped characters. * To make sure that the parsing works, we are building a format and a date without any separator. */ -export const getDateFromDateSections = ( +export const getDateFromDateSections = ( utils: MuiPickersAdapter, sections: FieldSection[], localizedDigits: string[], @@ -800,7 +806,7 @@ export const createDateStrForInputFromSections = ( return `\u2066${dateStr}\u2069`; }; -export const getSectionsBoundaries = ( +export const getSectionsBoundaries = ( utils: MuiPickersAdapter, localizedDigits: string[], timezone: PickersTimezone, @@ -929,7 +935,7 @@ export const validateSections = ( } }; -const transferDateSectionValue = ( +const transferDateSectionValue = ( utils: MuiPickersAdapter, timezone: PickersTimezone, section: FieldSectionWithoutPosition, @@ -1004,7 +1010,7 @@ const reliableSectionModificationOrder: Record = { empty: 9, }; -export const mergeDateIntoReferenceDate = ( +export const mergeDateIntoReferenceDate = ( utils: MuiPickersAdapter, timezone: PickersTimezone, dateToTransferFrom: TDate, diff --git a/packages/x-date-pickers/src/internals/hooks/useField/useFieldCharacterEditing.ts b/packages/x-date-pickers/src/internals/hooks/useField/useFieldCharacterEditing.ts index 13f7247bdf780..2fc78b739d0d0 100644 --- a/packages/x-date-pickers/src/internals/hooks/useField/useFieldCharacterEditing.ts +++ b/packages/x-date-pickers/src/internals/hooks/useField/useFieldCharacterEditing.ts @@ -1,6 +1,6 @@ import * as React from 'react'; import useEventCallback from '@mui/utils/useEventCallback'; -import { FieldSectionType, FieldSection, PickersTimezone } from '../../../models'; +import { FieldSectionType, FieldSection, PickersTimezone, PickerValidDate } from '../../../models'; import { useUtils } from '../useUtils'; import { FieldSectionsValueBoundaries } from './useField.types'; import { @@ -27,7 +27,7 @@ interface ApplyCharacterEditingParams { sectionIndex: number; } -interface UseFieldEditingParams { +interface UseFieldEditingParams { sections: TSection[]; updateSectionValue: (params: UpdateSectionValueParams) => void; sectionsValueBoundaries: FieldSectionsValueBoundaries; @@ -78,7 +78,10 @@ const isQueryResponseWithoutValue = ( * 1. The numeric editing when the user presses a digit * 2. The letter editing when the user presses another key */ -export const useFieldCharacterEditing = ({ +export const useFieldCharacterEditing = < + TDate extends PickerValidDate, + TSection extends FieldSection, +>({ sections, updateSectionValue, sectionsValueBoundaries, diff --git a/packages/x-date-pickers/src/internals/hooks/useField/useFieldState.ts b/packages/x-date-pickers/src/internals/hooks/useField/useFieldState.ts index 102bac4d7f7a6..0731be627b7ed 100644 --- a/packages/x-date-pickers/src/internals/hooks/useField/useFieldState.ts +++ b/packages/x-date-pickers/src/internals/hooks/useField/useFieldState.ts @@ -20,7 +20,7 @@ import { getLocalizedDigits, } from './useField.utils'; import { InferError } from '../useValidation'; -import { FieldSection, FieldSelectedSections } from '../../../models'; +import { FieldSection, FieldSelectedSections, PickerValidDate } from '../../../models'; import { useValueWithTimezone } from '../useValueWithTimezone'; import { GetDefaultReferenceDateProps, @@ -44,7 +44,7 @@ export interface UpdateSectionValueParams { export const useFieldState = < TValue, - TDate, + TDate extends PickerValidDate, TSection extends FieldSection, TForwardedProps extends UseFieldForwardedProps, TInternalProps extends UseFieldInternalProps, diff --git a/packages/x-date-pickers/src/internals/hooks/useMobilePicker/useMobilePicker.tsx b/packages/x-date-pickers/src/internals/hooks/useMobilePicker/useMobilePicker.tsx index a34d914b30449..f39bda9d098bb 100644 --- a/packages/x-date-pickers/src/internals/hooks/useMobilePicker/useMobilePicker.tsx +++ b/packages/x-date-pickers/src/internals/hooks/useMobilePicker/useMobilePicker.tsx @@ -10,7 +10,7 @@ import { useUtils } from '../useUtils'; import { LocalizationProvider } from '../../../LocalizationProvider'; import { PickersLayout } from '../../../PickersLayout'; import { InferError } from '../useValidation'; -import { FieldSection, BaseSingleInputFieldProps } from '../../../models'; +import { FieldSection, BaseSingleInputFieldProps, PickerValidDate } from '../../../models'; import { DateOrTimeViewWithMeridiem } from '../../models'; /** @@ -20,7 +20,7 @@ import { DateOrTimeViewWithMeridiem } from '../../models'; * - MobileTimePicker */ export const useMobilePicker = < - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TExternalProps extends UseMobilePickerProps, >({ 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 91c310fab3859..bbbe33d8521ef 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 @@ -11,7 +11,12 @@ import { PickersModalDialogSlotProps, } from '../../components/PickersModalDialog'; import { UsePickerParams, UsePickerProps } from '../usePicker'; -import { BaseSingleInputFieldProps, FieldSection, MuiPickersAdapter } from '../../../models'; +import { + BaseSingleInputFieldProps, + FieldSection, + MuiPickersAdapter, + PickerValidDate, +} from '../../../models'; import { ExportedPickersLayoutSlots, ExportedPickersLayoutSlotProps, @@ -21,8 +26,10 @@ import { UsePickerValueNonStaticProps } from '../usePicker/usePickerValue.types' import { UsePickerViewsNonStaticProps, UsePickerViewsProps } from '../usePicker/usePickerViews'; import { DateOrTimeViewWithMeridiem } from '../../models'; -export interface UseMobilePickerSlots - extends PickersModalDialogSlots, +export interface UseMobilePickerSlots< + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +> extends PickersModalDialogSlots, ExportedPickersLayoutSlots { /** * Component used to enter the date with the keyboard. @@ -36,8 +43,10 @@ export interface UseMobilePickerSlots; } -export interface ExportedUseMobilePickerSlotProps - extends PickersModalDialogSlotProps, +export interface ExportedUseMobilePickerSlotProps< + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +> extends PickersModalDialogSlotProps, ExportedPickersLayoutSlotProps { field?: SlotComponentProps< React.ElementType>, @@ -47,18 +56,20 @@ export interface ExportedUseMobilePickerSlotProps>; } -export interface UseMobilePickerSlotProps - extends ExportedUseMobilePickerSlotProps, +export interface UseMobilePickerSlotProps< + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +> extends ExportedUseMobilePickerSlotProps, Pick, 'toolbar'> {} -export interface MobileOnlyPickerProps +export interface MobileOnlyPickerProps extends BaseNonStaticPickerProps, BaseNonRangeNonStaticPickerProps, UsePickerValueNonStaticProps, UsePickerViewsNonStaticProps {} export interface UseMobilePickerProps< - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TError, TExternalProps extends UsePickerViewsProps, @@ -77,7 +88,7 @@ export interface UseMobilePickerProps< } export interface UseMobilePickerParams< - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TExternalProps extends UseMobilePickerProps, > extends Pick< 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 4e60cf201427f..889aa0eb101b1 100644 --- a/packages/x-date-pickers/src/internals/hooks/usePicker/usePicker.ts +++ b/packages/x-date-pickers/src/internals/hooks/usePicker/usePicker.ts @@ -4,7 +4,7 @@ import { usePickerViews } from './usePickerViews'; import { usePickerLayoutProps } from './usePickerLayoutProps'; import { InferError } from '../useValidation'; import { buildWarning } from '../../utils/warning'; -import { FieldSection } from '../../../models'; +import { FieldSection, PickerValidDate } from '../../../models'; import { DateOrTimeViewWithMeridiem } from '../../models'; const warnRenderInputIsDefined = buildWarning([ @@ -15,7 +15,7 @@ const warnRenderInputIsDefined = buildWarning([ export const usePicker = < TValue, - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TSection extends FieldSection, TExternalProps extends UsePickerProps, 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 5b7e4aeb4ded8..0827fe08cd995 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 @@ -11,7 +11,7 @@ import { UsePickerViewsBaseProps, } from './usePickerViews'; import { UsePickerLayoutProps, UsePickerLayoutPropsResponse } from './usePickerLayoutProps'; -import { FieldSection } from '../../../models'; +import { FieldSection, PickerValidDate } from '../../../models'; import { DateOrTimeViewWithMeridiem } from '../../models'; /** @@ -19,7 +19,7 @@ import { DateOrTimeViewWithMeridiem } from '../../models'; */ export interface UsePickerBaseProps< TValue, - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TError, TExternalProps extends UsePickerViewsProps, @@ -30,7 +30,7 @@ export interface UsePickerBaseProps< export interface UsePickerProps< TValue, - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TSection extends FieldSection, TError, @@ -42,7 +42,7 @@ export interface UsePickerProps< export interface UsePickerParams< TValue, - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TSection extends FieldSection, TExternalProps extends UsePickerProps, 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 98863c4ebea8b..1e2c0947eef1d 100644 --- a/packages/x-date-pickers/src/internals/hooks/usePicker/usePickerValue.ts +++ b/packages/x-date-pickers/src/internals/hooks/usePicker/usePickerValue.ts @@ -5,7 +5,12 @@ import { useOpenState } from '../useOpenState'; import { useLocalizationContext, useUtils } from '../useUtils'; import { FieldChangeHandlerContext } from '../useField'; import { InferError, useValidation } from '../useValidation'; -import { FieldSection, FieldSelectedSections, PickerChangeHandlerContext } from '../../../models'; +import { + FieldSection, + FieldSelectedSections, + PickerChangeHandlerContext, + PickerValidDate, +} from '../../../models'; import { PickerShortcutChangeImportance, PickersShortcutsItemContext, @@ -147,7 +152,7 @@ const shouldClosePicker = ( */ export const usePickerValue = < TValue, - TDate, + TDate extends PickerValidDate, TSection extends FieldSection, TExternalProps extends UsePickerValueProps, >({ diff --git a/packages/x-date-pickers/src/internals/hooks/usePicker/usePickerValue.types.ts b/packages/x-date-pickers/src/internals/hooks/usePicker/usePickerValue.types.ts index 959b45b70a337..3546b56d9f51c 100644 --- a/packages/x-date-pickers/src/internals/hooks/usePicker/usePickerValue.types.ts +++ b/packages/x-date-pickers/src/internals/hooks/usePicker/usePickerValue.types.ts @@ -10,6 +10,7 @@ import { MuiPickersAdapter, PickersTimezone, PickerChangeHandlerContext, + PickerValidDate, } from '../../../models'; import { GetDefaultReferenceDateProps } from '../../utils/getDefaultReferenceDate'; import { @@ -17,7 +18,7 @@ import { PickersShortcutsItemContext, } from '../../../PickersShortcuts'; -export interface PickerValueManager { +export interface PickerValueManager { /** * Determines if two values are equal. * @template TDate, TValue @@ -249,7 +250,7 @@ export interface UsePickerValueBaseProps { */ export interface UsePickerValueNonStaticProps extends Pick< - UseFieldInternalProps, + UseFieldInternalProps, 'selectedSections' | 'onSelectedSectionsChange' > { /** @@ -284,7 +285,7 @@ export interface UsePickerValueProps, > { @@ -312,7 +313,7 @@ export interface UsePickerValueActions { export type UsePickerValueFieldResponse = Required< Pick< - UseFieldInternalProps, + UseFieldInternalProps, 'value' | 'onChange' | 'selectedSections' | 'onSelectedSectionsChange' > >; diff --git a/packages/x-date-pickers/src/internals/hooks/usePicker/usePickerViews.ts b/packages/x-date-pickers/src/internals/hooks/usePicker/usePickerViews.ts index d70dbe1cdeb58..58768a3877b35 100644 --- a/packages/x-date-pickers/src/internals/hooks/usePicker/usePickerViews.ts +++ b/packages/x-date-pickers/src/internals/hooks/usePicker/usePickerViews.ts @@ -7,7 +7,7 @@ import { useViews, UseViewsOptions } from '../useViews'; import type { UsePickerValueViewsResponse } from './usePickerValue.types'; import { isTimeView } from '../../utils/time-utils'; import { DateOrTimeViewWithMeridiem } from '../../models'; -import { TimezoneProps } from '../../../models'; +import { PickerValidDate, TimezoneProps } from '../../../models'; interface PickerViewsRendererBaseExternalProps extends Omit, 'openTo' | 'viewRenderers'> {} @@ -49,7 +49,7 @@ export type PickerViewRendererLookup< */ export interface UsePickerViewsBaseProps< TValue, - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TExternalProps extends UsePickerViewsProps, TAdditionalProps extends {}, @@ -93,7 +93,7 @@ export interface UsePickerViewsNonStaticProps { */ export interface UsePickerViewsProps< TValue, - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TExternalProps extends UsePickerViewsProps, TAdditionalProps extends {}, @@ -105,7 +105,7 @@ export interface UsePickerViewsProps< export interface UsePickerViewParams< TValue, - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TExternalProps extends UsePickerViewsProps< TValue, @@ -163,7 +163,7 @@ export interface UsePickerViewsLayoutResponse, TAdditionalProps extends {}, diff --git a/packages/x-date-pickers/src/internals/hooks/useStaticPicker/useStaticPicker.tsx b/packages/x-date-pickers/src/internals/hooks/useStaticPicker/useStaticPicker.tsx index 7bd800892bc20..7c6f79c2914d1 100644 --- a/packages/x-date-pickers/src/internals/hooks/useStaticPicker/useStaticPicker.tsx +++ b/packages/x-date-pickers/src/internals/hooks/useStaticPicker/useStaticPicker.tsx @@ -6,7 +6,7 @@ import { usePicker } from '../usePicker'; import { LocalizationProvider } from '../../../LocalizationProvider'; import { PickersLayout } from '../../../PickersLayout'; import { DIALOG_WIDTH } from '../../constants/dimensions'; -import { FieldSection } from '../../../models'; +import { FieldSection, PickerValidDate } from '../../../models'; import { DateOrTimeViewWithMeridiem } from '../../models'; const PickerStaticLayout = styled(PickersLayout)(({ theme }) => ({ @@ -22,7 +22,7 @@ const PickerStaticLayout = styled(PickersLayout)(({ theme }) => ({ * - StaticTimePicker */ export const useStaticPicker = < - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TExternalProps extends UseStaticPickerProps, >({ diff --git a/packages/x-date-pickers/src/internals/hooks/useStaticPicker/useStaticPicker.types.ts b/packages/x-date-pickers/src/internals/hooks/useStaticPicker/useStaticPicker.types.ts index 3938bfcdf7187..3ac7db4269d1c 100644 --- a/packages/x-date-pickers/src/internals/hooks/useStaticPicker/useStaticPicker.types.ts +++ b/packages/x-date-pickers/src/internals/hooks/useStaticPicker/useStaticPicker.types.ts @@ -6,14 +6,18 @@ import { import { BasePickerProps } from '../../models/props/basePickerProps'; import { UsePickerParams } from '../usePicker'; import { UsePickerViewsProps } from '../usePicker/usePickerViews'; -import { FieldSection } from '../../../models'; +import { FieldSection, PickerValidDate } from '../../../models'; import { DateOrTimeViewWithMeridiem } from '../../models'; -export interface UseStaticPickerSlots - extends ExportedPickersLayoutSlots {} +export interface UseStaticPickerSlots< + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +> extends ExportedPickersLayoutSlots {} -export interface UseStaticPickerSlotProps - extends ExportedPickersLayoutSlotProps {} +export interface UseStaticPickerSlotProps< + TDate extends PickerValidDate, + TView extends DateOrTimeViewWithMeridiem, +> extends ExportedPickersLayoutSlotProps {} export interface StaticOnlyPickerProps { /** @@ -34,7 +38,7 @@ export interface StaticOnlyPickerProps { } export interface UseStaticPickerProps< - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TError, TExternalProps extends UsePickerViewsProps, @@ -44,7 +48,7 @@ export interface UseStaticPickerProps< * Overridable component slots. * @default {} */ - slots?: UseStaticPickerSlots; + slots?: UseStaticPickerSlots; /** * The props used for each component slot. * @default {} @@ -53,7 +57,7 @@ export interface UseStaticPickerProps< } export interface UseStaticPickerParams< - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TExternalProps extends UseStaticPickerProps, > extends Pick< diff --git a/packages/x-date-pickers/src/internals/hooks/useUtils.ts b/packages/x-date-pickers/src/internals/hooks/useUtils.ts index 9ce0b0102bcdb..2759b1b050785 100644 --- a/packages/x-date-pickers/src/internals/hooks/useUtils.ts +++ b/packages/x-date-pickers/src/internals/hooks/useUtils.ts @@ -5,9 +5,9 @@ import { } from '../../LocalizationProvider/LocalizationProvider'; import { DEFAULT_LOCALE } from '../../locales/enUS'; import { PickersLocaleText } from '../../locales/utils/pickersLocaleTextApi'; -import { PickersTimezone } from '../../models'; +import { PickersTimezone, PickerValidDate } from '../../models'; -export const useLocalizationContext = () => { +export const useLocalizationContext = () => { const localization = React.useContext(MuiPickersAdapterContext); if (localization === null) { throw new Error( @@ -45,13 +45,15 @@ export const useLocalizationContext = () => { ); }; -export const useUtils = () => useLocalizationContext().utils; +export const useUtils = () => useLocalizationContext().utils; -export const useDefaultDates = () => useLocalizationContext().defaultDates; +export const useDefaultDates = () => + useLocalizationContext().defaultDates; -export const useLocaleText = () => useLocalizationContext().localeText; +export const useLocaleText = () => + useLocalizationContext().localeText; -export const useNow = (timezone: PickersTimezone): TDate => { +export const useNow = (timezone: PickersTimezone): TDate => { const utils = useUtils(); const now = React.useRef() as React.MutableRefObject; diff --git a/packages/x-date-pickers/src/internals/hooks/useValidation.ts b/packages/x-date-pickers/src/internals/hooks/useValidation.ts index 1742634d63b5b..406dcf61d0db8 100644 --- a/packages/x-date-pickers/src/internals/hooks/useValidation.ts +++ b/packages/x-date-pickers/src/internals/hooks/useValidation.ts @@ -1,6 +1,7 @@ import * as React from 'react'; import { useLocalizationContext } from './useUtils'; import { MuiPickersAdapterContextValue } from '../../LocalizationProvider/LocalizationProvider'; +import { PickerValidDate } from '../../models'; interface ValidationCommonProps { /** @@ -27,13 +28,18 @@ export type InferError = ? Parameters>[0] : never; -export type Validator = (params: { +export type Validator = (params: { adapter: MuiPickersAdapterContextValue; value: TValue; props: Omit; }) => TError; -export function useValidation( +export function useValidation< + TValue, + TDate extends PickerValidDate, + TError, + TValidationProps extends {}, +>( props: ValidationProps, validate: Validator, isSameError: (a: TError, b: TError | null) => boolean, diff --git a/packages/x-date-pickers/src/internals/hooks/useValueWithTimezone.ts b/packages/x-date-pickers/src/internals/hooks/useValueWithTimezone.ts index 3bac13012c37f..dd892c5d1c9da 100644 --- a/packages/x-date-pickers/src/internals/hooks/useValueWithTimezone.ts +++ b/packages/x-date-pickers/src/internals/hooks/useValueWithTimezone.ts @@ -3,14 +3,18 @@ import useEventCallback from '@mui/utils/useEventCallback'; import useControlled from '@mui/utils/useControlled'; import { useUtils } from './useUtils'; import type { PickerValueManager } from './usePicker'; -import { PickersTimezone } from '../../models'; +import { PickersTimezone, PickerValidDate } from '../../models'; /** * Hooks making sure that: * - The value returned by `onChange` always have the timezone of `props.value` or `props.defaultValue` if defined * - The value rendered is always the one from `props.timezone` if defined */ -export const useValueWithTimezone = void>({ +export const useValueWithTimezone = < + TDate extends PickerValidDate, + TValue, + TChange extends (...params: any[]) => void, +>({ timezone: timezoneProp, value: valueProp, defaultValue, @@ -60,7 +64,7 @@ export const useValueWithTimezone = void, >({ diff --git a/packages/x-date-pickers/src/internals/hooks/useViews.tsx b/packages/x-date-pickers/src/internals/hooks/useViews.tsx index 8f120dde32635..c5c25387d2bf5 100644 --- a/packages/x-date-pickers/src/internals/hooks/useViews.tsx +++ b/packages/x-date-pickers/src/internals/hooks/useViews.tsx @@ -4,8 +4,9 @@ import { unstable_useControlled as useControlled } from '@mui/utils'; import type { PickerSelectionState } from './usePicker'; import { MakeOptional } from '../models/helpers'; import { DateOrTimeViewWithMeridiem } from '../models'; +import { PickerValidDate } from '../../models'; -export type PickerOnChangeFn = ( +export type PickerOnChangeFn = ( date: TDate | null, selectionState?: PickerSelectionState, ) => void; diff --git a/packages/x-date-pickers/src/internals/models/fields.ts b/packages/x-date-pickers/src/internals/models/fields.ts index 552dfb3bef9d3..f46af981ad9ac 100644 --- a/packages/x-date-pickers/src/internals/models/fields.ts +++ b/packages/x-date-pickers/src/internals/models/fields.ts @@ -1,10 +1,14 @@ import * as React from 'react'; import { TextFieldProps } from '@mui/material/TextField'; import type { UseFieldInternalProps } from '../hooks/useField'; -import type { FieldSection } from '../../models'; +import { FieldSection, PickerValidDate } from '../../models'; -export interface BaseFieldProps - extends Omit, 'format'> { +export interface BaseFieldProps< + TValue, + TDate extends PickerValidDate, + TSection extends FieldSection, + TError, +> extends Omit, 'format'> { className?: string; format?: string; disabled?: boolean; 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 ae4f8a9b8d7f9..9d0b473af2dd8 100644 --- a/packages/x-date-pickers/src/internals/models/props/basePickerProps.tsx +++ b/packages/x-date-pickers/src/internals/models/props/basePickerProps.tsx @@ -6,13 +6,14 @@ import { PickersInputComponentLocaleText } from '../../../locales/utils/pickersL import type { UsePickerViewsProps } from '../../hooks/usePicker/usePickerViews'; import { MakeOptional } from '../helpers'; import { DateOrTimeViewWithMeridiem } from '../common'; +import { PickerValidDate } from '../../../models'; /** * Props common to all pickers after applying the default props on each picker. */ export interface BasePickerProps< TValue, - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TError, TExternalProps extends UsePickerViewsProps, @@ -35,7 +36,7 @@ export interface BasePickerProps< */ export interface BasePickerInputProps< TValue, - TDate, + TDate extends PickerValidDate, TView extends DateOrTimeViewWithMeridiem, TError, > extends Omit< diff --git a/packages/x-date-pickers/src/internals/models/props/clock.ts b/packages/x-date-pickers/src/internals/models/props/clock.ts index 8c783c1ac3e67..ff5fa599f6cdb 100644 --- a/packages/x-date-pickers/src/internals/models/props/clock.ts +++ b/packages/x-date-pickers/src/internals/models/props/clock.ts @@ -1,12 +1,12 @@ import { SxProps, Theme } from '@mui/material/styles'; import { BaseTimeValidationProps, TimeValidationProps } from '../validation'; -import { TimeStepOptions, TimezoneProps } from '../../../models'; +import { PickerValidDate, TimeStepOptions, TimezoneProps } from '../../../models'; import type { ExportedDigitalClockProps } from '../../../DigitalClock/DigitalClock.types'; import type { ExportedMultiSectionDigitalClockProps } from '../../../MultiSectionDigitalClock/MultiSectionDigitalClock.types'; import type { ExportedUseViewsOptions } from '../../hooks/useViews'; import { TimeViewWithMeridiem } from '../common'; -export interface ExportedBaseClockProps +export interface ExportedBaseClockProps extends TimeValidationProps, BaseTimeValidationProps, TimezoneProps { @@ -17,7 +17,7 @@ export interface ExportedBaseClockProps ampm?: boolean; } -export interface BaseClockProps +export interface BaseClockProps extends ExportedUseViewsOptions, ExportedBaseClockProps { className?: string; @@ -52,7 +52,7 @@ export interface BaseClockProps referenceDate?: TDate; } -export interface DesktopOnlyTimePickerProps +export interface DesktopOnlyTimePickerProps extends Omit, 'timeStep'>, Omit, 'timeSteps'> { /** diff --git a/packages/x-date-pickers/src/internals/models/validation.ts b/packages/x-date-pickers/src/internals/models/validation.ts index d933b83ecb628..aee8f2a3833e9 100644 --- a/packages/x-date-pickers/src/internals/models/validation.ts +++ b/packages/x-date-pickers/src/internals/models/validation.ts @@ -1,4 +1,4 @@ -import { TimeView } from '../../models'; +import { PickerValidDate, TimeView } from '../../models'; interface FutureAndPastValidationProps { /** @@ -22,7 +22,7 @@ export interface BaseTimeValidationProps extends FutureAndPastValidationProps {} /** * Props used to validate a time value. */ -export interface TimeValidationProps { +export interface TimeValidationProps { /** * Minimal selectable time. * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`. @@ -57,7 +57,8 @@ export interface TimeValidationProps { * Validation props common to all the date views. * All these props have a default value when used inside a field / picker / calendar. */ -export interface BaseDateValidationProps extends FutureAndPastValidationProps { +export interface BaseDateValidationProps + extends FutureAndPastValidationProps { /** * Maximal selectable date. */ @@ -71,7 +72,7 @@ export interface BaseDateValidationProps extends FutureAndPastValidationP /** * Props used to validate a date value (validates day + month + year). */ -export interface DayValidationProps { +export interface DayValidationProps { /** * Disable specific date. * @@ -87,7 +88,7 @@ export interface DayValidationProps { /** * Props used to validate a month value */ -export interface MonthValidationProps { +export interface MonthValidationProps { /** * Disable specific month. * @template TDate @@ -100,7 +101,7 @@ export interface MonthValidationProps { /** * Props used to validate a year value */ -export interface YearValidationProps { +export interface YearValidationProps { /** * Disable specific year. * @template TDate @@ -113,7 +114,7 @@ export interface YearValidationProps { /** * Props used to validate a date time value. */ -export interface DateTimeValidationProps { +export interface DateTimeValidationProps { /** * Minimal selectable moment of time with binding to date, to set min time in each day use `minTime`. */ diff --git a/packages/x-date-pickers/src/internals/utils/date-time-utils.ts b/packages/x-date-pickers/src/internals/utils/date-time-utils.ts index 61f4daa693c15..0be0869483c4b 100644 --- a/packages/x-date-pickers/src/internals/utils/date-time-utils.ts +++ b/packages/x-date-pickers/src/internals/utils/date-time-utils.ts @@ -2,6 +2,7 @@ import { DateOrTimeView, DateView, MuiPickersAdapter, + PickerValidDate, TimeStepOptions, TimeView, } from '../../models'; @@ -11,8 +12,8 @@ import { DateOrTimeViewWithMeridiem } from '../models'; import { DesktopOnlyTimePickerProps } from '../models/props/clock'; import { DefaultizedProps } from '../models/helpers'; -export const resolveDateTimeFormat = ( - utils: MuiPickersAdapter, +export const resolveDateTimeFormat = ( + utils: MuiPickersAdapter, { views, format, ...other }: { format?: string; views: readonly DateOrTimeView[]; ampm: boolean }, ) => { if (format) { @@ -58,13 +59,15 @@ const resolveViews = (24 * 60) / ((timeSteps.hours ?? 1) * (timeSteps.minutes ?? 5)) <= threshold; -interface DefaultizedTimeViewsProps +interface DefaultizedTimeViewsProps extends DefaultizedProps, 'ampm'> { views: readonly TView[]; } -interface DefaultizedTimeViewsResponse - extends Required< +interface DefaultizedTimeViewsResponse< + TDate extends PickerValidDate, + TView = DateOrTimeViewWithMeridiem, +> extends Required< Pick< DefaultizedTimeViewsProps, 'thresholdToRenderTimeInASingleColumn' | 'timeSteps' | 'views' @@ -74,7 +77,7 @@ interface DefaultizedTimeViewsResponse({ 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 ea444ec19736a..639332f7dc49e 100644 --- a/packages/x-date-pickers/src/internals/utils/date-utils.ts +++ b/packages/x-date-pickers/src/internals/utils/date-utils.ts @@ -1,8 +1,14 @@ -import { DateView, FieldValueType, MuiPickersAdapter, PickersTimezone } from '../../models'; +import { + DateView, + FieldValueType, + MuiPickersAdapter, + PickersTimezone, + PickerValidDate, +} from '../../models'; import { DateOrTimeViewWithMeridiem } from '../models'; import { areViewsEqual } from './views'; -interface FindClosestDateParams { +interface FindClosestDateParams { date: TDate; disableFuture?: boolean; disablePast?: boolean; @@ -13,7 +19,7 @@ interface FindClosestDateParams { timezone: PickersTimezone; } -export const findClosestEnabledDate = ({ +export const findClosestEnabledDate = ({ date, disableFuture, disablePast, @@ -74,12 +80,12 @@ export const findClosestEnabledDate = ({ return null; }; -export const replaceInvalidDateByNull = ( +export const replaceInvalidDateByNull = ( utils: MuiPickersAdapter, value: TDate | null, ) => (value == null || !utils.isValid(value) ? null : value); -export const applyDefaultDate = ( +export const applyDefaultDate = ( utils: MuiPickersAdapter, value: TDate | null | undefined, defaultValue: TDate, @@ -91,7 +97,11 @@ export const applyDefaultDate = ( return value; }; -export const areDatesEqual = (utils: MuiPickersAdapter, a: TDate, b: TDate) => { +export const areDatesEqual = ( + utils: MuiPickersAdapter, + a: TDate, + b: TDate, +) => { if (!utils.isValid(a) && a != null && !utils.isValid(b) && b != null) { return true; } @@ -99,7 +109,10 @@ export const areDatesEqual = (utils: MuiPickersAdapter, a: TDate, return utils.isEqual(a, b); }; -export const getMonthsInYear = (utils: MuiPickersAdapter, year: TDate) => { +export const getMonthsInYear = ( + utils: MuiPickersAdapter, + year: TDate, +) => { const firstMonth = utils.startOfYear(year); const months = [firstMonth]; @@ -111,7 +124,7 @@ export const getMonthsInYear = (utils: MuiPickersAdapter, year: TD return months; }; -export const mergeDateAndTime = ( +export const mergeDateAndTime = ( utils: MuiPickersAdapter, dateParam: TDate, timeParam: TDate, @@ -124,7 +137,7 @@ export const mergeDateAndTime = ( return mergedDate; }; -export const getTodayDate = ( +export const getTodayDate = ( utils: MuiPickersAdapter, timezone: PickersTimezone, valueType?: FieldValueType, @@ -133,7 +146,10 @@ export const getTodayDate = ( ? utils.startOfDay(utils.date(undefined, timezone)) : utils.date(undefined, timezone); -export const formatMeridiem = (utils: MuiPickersAdapter, meridiem: 'am' | 'pm') => { +export const formatMeridiem = ( + utils: MuiPickersAdapter, + meridiem: 'am' | 'pm', +) => { const date = utils.setHours(utils.date()!, meridiem === 'am' ? 2 : 14); return utils.format(date, 'meridiem'); }; @@ -142,8 +158,8 @@ const dateViews = ['year', 'month', 'day']; export const isDatePickerView = (view: DateOrTimeViewWithMeridiem): view is DateView => dateViews.includes(view); -export const resolveDateFormat = ( - utils: MuiPickersAdapter, +export const resolveDateFormat = ( + utils: MuiPickersAdapter, { format, views }: { format?: string; views: readonly DateView[] }, isInToolbar: boolean, ) => { @@ -184,7 +200,10 @@ export const resolveDateFormat = ( return formats.keyboardDate; }; -export const getWeekdays = (utils: MuiPickersAdapter, date: TDate) => { +export const getWeekdays = ( + utils: MuiPickersAdapter, + date: TDate, +) => { const start = utils.startOfWeek(date); return [0, 1, 2, 3, 4, 5, 6].map((diff) => utils.addDays(start, diff)); }; diff --git a/packages/x-date-pickers/src/internals/utils/getDefaultReferenceDate.ts b/packages/x-date-pickers/src/internals/utils/getDefaultReferenceDate.ts index c93f2fda56dae..7d31ee708ee08 100644 --- a/packages/x-date-pickers/src/internals/utils/getDefaultReferenceDate.ts +++ b/packages/x-date-pickers/src/internals/utils/getDefaultReferenceDate.ts @@ -1,8 +1,8 @@ import { createIsAfterIgnoreDatePart } from './time-utils'; import { mergeDateAndTime, getTodayDate } from './date-utils'; -import { FieldSection, MuiPickersAdapter, PickersTimezone } from '../../models'; +import { FieldSection, MuiPickersAdapter, PickersTimezone, PickerValidDate } from '../../models'; -export interface GetDefaultReferenceDateProps { +export interface GetDefaultReferenceDateProps { maxDate?: TDate; minDate?: TDate; minTime?: TDate; @@ -28,7 +28,11 @@ export const getSectionTypeGranularity = (sections: FieldSection[]) => ), ); -const roundDate = (utils: MuiPickersAdapter, granularity: number, date: TDate) => { +const roundDate = ( + utils: MuiPickersAdapter, + granularity: number, + date: TDate, +) => { if (granularity === SECTION_TYPE_GRANULARITY.year) { return utils.startOfYear(date); } @@ -54,7 +58,7 @@ const roundDate = (utils: MuiPickersAdapter, granularity: number, return roundedDate; }; -export const getDefaultReferenceDate = ({ +export const getDefaultReferenceDate = ({ props, utils, granularity, 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 133ce1080c6a6..01faa1cf78626 100644 --- a/packages/x-date-pickers/src/internals/utils/time-utils.ts +++ b/packages/x-date-pickers/src/internals/utils/time-utils.ts @@ -1,4 +1,4 @@ -import { MuiPickersAdapter, TimeView } from '../../models'; +import { MuiPickersAdapter, PickerValidDate, TimeView } from '../../models'; import { DateOrTimeViewWithMeridiem, TimeViewWithMeridiem } from '../models'; import { areViewsEqual } from './views'; @@ -11,7 +11,7 @@ export const isInternalTimeView = ( export type Meridiem = 'am' | 'pm'; -export const getMeridiem = ( +export const getMeridiem = ( date: TDate | null, utils: MuiPickersAdapter, ): Meridiem | null => { @@ -33,7 +33,7 @@ export const convertValueToMeridiem = (value: number, meridiem: Meridiem | null, return value; }; -export const convertToMeridiem = ( +export const convertToMeridiem = ( time: TDate, meridiem: Meridiem, ampm: boolean, @@ -43,12 +43,18 @@ export const convertToMeridiem = ( return utils.setHours(time, newHoursAmount); }; -export const getSecondsInDay = (date: TDate, utils: MuiPickersAdapter) => { +export const getSecondsInDay = ( + date: TDate, + utils: MuiPickersAdapter, +) => { return utils.getHours(date) * 3600 + utils.getMinutes(date) * 60 + utils.getSeconds(date); }; export const createIsAfterIgnoreDatePart = - (disableIgnoringDatePartForTimeValidation: boolean, utils: MuiPickersAdapter) => + ( + disableIgnoringDatePartForTimeValidation: boolean, + utils: MuiPickersAdapter, + ) => (dateLeft: TDate, dateRight: TDate) => { if (disableIgnoringDatePartForTimeValidation) { return utils.isAfter(dateLeft, dateRight); @@ -57,8 +63,8 @@ export const createIsAfterIgnoreDatePart = return getSecondsInDay(dateLeft, utils) > getSecondsInDay(dateRight, utils); }; -export const resolveTimeFormat = ( - utils: MuiPickersAdapter, +export const resolveTimeFormat = ( + utils: MuiPickersAdapter, { format, views, ampm }: { format?: string; views: readonly TimeView[]; ampm: boolean }, ) => { if (format != null) { diff --git a/packages/x-date-pickers/src/internals/utils/validation/validateDate.ts b/packages/x-date-pickers/src/internals/utils/validation/validateDate.ts index 6cd8b41ff7c63..363b13a96f70c 100644 --- a/packages/x-date-pickers/src/internals/utils/validation/validateDate.ts +++ b/packages/x-date-pickers/src/internals/utils/validation/validateDate.ts @@ -5,11 +5,11 @@ import { MonthValidationProps, YearValidationProps, } from '../../models/validation'; -import { DateValidationError, TimezoneProps } from '../../../models'; +import { DateValidationError, PickerValidDate, TimezoneProps } from '../../../models'; import { applyDefaultDate } from '../date-utils'; import { DefaultizedProps } from '../../models/helpers'; -export interface DateComponentValidationProps +export interface DateComponentValidationProps extends DayValidationProps, MonthValidationProps, YearValidationProps, diff --git a/packages/x-date-pickers/src/internals/utils/validation/validateDateTime.ts b/packages/x-date-pickers/src/internals/utils/validation/validateDateTime.ts index 30a39602fb47b..ff14f93ac1eb4 100644 --- a/packages/x-date-pickers/src/internals/utils/validation/validateDateTime.ts +++ b/packages/x-date-pickers/src/internals/utils/validation/validateDateTime.ts @@ -1,9 +1,9 @@ import { Validator } from '../../hooks/useValidation'; import { validateDate, DateComponentValidationProps } from './validateDate'; import { validateTime, TimeComponentValidationProps } from './validateTime'; -import { DateTimeValidationError } from '../../../models'; +import { DateTimeValidationError, PickerValidDate } from '../../../models'; -export interface DateTimeComponentValidationProps +export interface DateTimeComponentValidationProps extends DateComponentValidationProps, TimeComponentValidationProps {} diff --git a/packages/x-date-pickers/src/internals/utils/validation/validateTime.ts b/packages/x-date-pickers/src/internals/utils/validation/validateTime.ts index e21efee801c33..c3d109e7ec0f9 100644 --- a/packages/x-date-pickers/src/internals/utils/validation/validateTime.ts +++ b/packages/x-date-pickers/src/internals/utils/validation/validateTime.ts @@ -1,10 +1,10 @@ import { createIsAfterIgnoreDatePart } from '../time-utils'; import { Validator } from '../../hooks/useValidation'; import { BaseTimeValidationProps, TimeValidationProps } from '../../models/validation'; -import { TimeValidationError, TimezoneProps } from '../../../models'; +import { PickerValidDate, TimeValidationError, TimezoneProps } from '../../../models'; import { DefaultizedProps } from '../../models/helpers'; -export interface TimeComponentValidationProps +export interface TimeComponentValidationProps extends Required, TimeValidationProps, DefaultizedProps {} diff --git a/packages/x-date-pickers/src/internals/utils/valueManagers.ts b/packages/x-date-pickers/src/internals/utils/valueManagers.ts index 02efbeafe40e3..e00437056044e 100644 --- a/packages/x-date-pickers/src/internals/utils/valueManagers.ts +++ b/packages/x-date-pickers/src/internals/utils/valueManagers.ts @@ -4,6 +4,7 @@ import { TimeValidationError, DateTimeValidationError, FieldSection, + PickerValidDate, } from '../../models'; import type { FieldValueManager } from '../hooks/useField'; import { areDatesEqual, getTodayDate, replaceInvalidDateByNull } from './date-utils'; @@ -15,7 +16,7 @@ import { export type SingleItemPickerValueManager< TValue = any, - TDate = any, + TDate extends PickerValidDate = any, TError extends DateValidationError | TimeValidationError | DateTimeValidationError = any, > = PickerValueManager; diff --git a/packages/x-date-pickers/src/locales/utils/pickersLocaleTextApi.ts b/packages/x-date-pickers/src/locales/utils/pickersLocaleTextApi.ts index cb738d79bb873..6e0aca44083b1 100644 --- a/packages/x-date-pickers/src/locales/utils/pickersLocaleTextApi.ts +++ b/packages/x-date-pickers/src/locales/utils/pickersLocaleTextApi.ts @@ -1,5 +1,11 @@ import { TimeViewWithMeridiem } from '../../internals/models'; -import { DateView, TimeView, MuiPickersAdapter, FieldSectionContentType } from '../../models'; +import { + DateView, + TimeView, + MuiPickersAdapter, + FieldSectionContentType, + PickerValidDate, +} from '../../models'; export interface PickersComponentSpecificLocaleText { /** @@ -24,7 +30,7 @@ export interface PickersComponentSpecificLocaleText { dateRangePickerToolbarTitle: string; } -export interface PickersComponentAgnosticLocaleText { +export interface PickersComponentAgnosticLocaleText { // Calendar navigation previousMonth: string; nextMonth: string; @@ -91,18 +97,20 @@ export interface PickersComponentAgnosticLocaleText { fieldMeridiemPlaceholder: (params: { format: string }) => string; } -export interface PickersLocaleText +export interface PickersLocaleText extends PickersComponentAgnosticLocaleText, PickersComponentSpecificLocaleText {} -export type PickersInputLocaleText = Partial>; +export type PickersInputLocaleText = Partial< + PickersLocaleText +>; /** * 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 +export interface PickersInputComponentLocaleText extends Partial> { /** * Title displayed in the toolbar of this picker. @@ -114,6 +122,6 @@ export interface PickersInputComponentLocaleText export type PickersTranslationKeys = keyof PickersLocaleText; export type LocalizedComponent< - TDate, + TDate extends PickerValidDate, Props extends { localeText?: PickersInputComponentLocaleText }, > = Omit & { localeText?: PickersInputLocaleText }; diff --git a/packages/x-date-pickers/src/models/adapters.ts b/packages/x-date-pickers/src/models/adapters.ts index 199ec3bd03811..ae4cf04ddff23 100644 --- a/packages/x-date-pickers/src/models/adapters.ts +++ b/packages/x-date-pickers/src/models/adapters.ts @@ -1,5 +1,6 @@ import { FieldSectionContentType, FieldSectionType } from './fields'; import { PickersTimezone } from './timezone'; +import { PickerValidDate } from './pickers'; export interface AdapterFormats { // Token formats @@ -153,7 +154,7 @@ export type DateBuilderReturnType = ? null : TDate; -export interface MuiPickersAdapter { +export interface MuiPickersAdapter { /** * A boolean confirming that the adapter used is an MUI adapter. */ diff --git a/packages/x-date-pickers/src/models/fields.ts b/packages/x-date-pickers/src/models/fields.ts index a49895354f1ec..8f88dc742f3b9 100644 --- a/packages/x-date-pickers/src/models/fields.ts +++ b/packages/x-date-pickers/src/models/fields.ts @@ -1,5 +1,6 @@ import * as React from 'react'; import type { BaseFieldProps } from '../internals/models/fields'; +import { PickerValidDate } from './pickers'; export type FieldSectionType = | 'year' @@ -125,10 +126,14 @@ export type FieldSelectedSections = /** * Props the single input field can receive when used inside a picker. - * Only contains what the MUI component are passing to the field, not what users can pass using the `props.slotProps.field`. + * Only contains what the MUI components are passing to the field, not what users can pass using the `props.slotProps.field`. */ -export interface BaseSingleInputFieldProps - extends BaseFieldProps { +export interface BaseSingleInputFieldProps< + TValue, + TDate extends PickerValidDate, + TSection extends FieldSection, + TError, +> extends BaseFieldProps { label?: React.ReactNode; id?: string; name?: string; diff --git a/packages/x-date-pickers/src/models/pickers.ts b/packages/x-date-pickers/src/models/pickers.ts index a51d9b1bff8ac..f093acb08b6f9 100644 --- a/packages/x-date-pickers/src/models/pickers.ts +++ b/packages/x-date-pickers/src/models/pickers.ts @@ -8,3 +8,7 @@ export interface PickerChangeHandlerContext { */ shortcut?: PickersShortcutsItemContext; } + +export interface PickerValidDateLookup {} + +export type PickerValidDate = PickerValidDateLookup[keyof PickerValidDateLookup]; diff --git a/packages/x-date-pickers/src/tests/fieldKeyboardInteraction.test.tsx b/packages/x-date-pickers/src/tests/fieldKeyboardInteraction.test.tsx index 948853ed504fd..b2fdefc1e22d9 100644 --- a/packages/x-date-pickers/src/tests/fieldKeyboardInteraction.test.tsx +++ b/packages/x-date-pickers/src/tests/fieldKeyboardInteraction.test.tsx @@ -12,7 +12,7 @@ import { expectInputValue, } from 'test/utils/pickers'; import { DateTimeField } from '@mui/x-date-pickers/DateTimeField'; -import { FieldSectionType, MuiPickersAdapter } from '@mui/x-date-pickers/models'; +import { FieldSectionType, MuiPickersAdapter, PickerValidDate } from '@mui/x-date-pickers/models'; import { getDateSectionConfigFromFormatToken, cleanLeadingZeros, @@ -20,7 +20,7 @@ import { const testDate = '2018-05-15T09:35:10'; -function updateDate( +function updateDate( date: TDate, adapter: MuiPickersAdapter, sectionType: FieldSectionType, @@ -182,7 +182,7 @@ adapterToTest.forEach((adapterName) => { return valueStr; }; - const testKeyPress = ({ + const testKeyPress = ({ key, format, initialValue, diff --git a/packages/x-date-pickers/src/themeAugmentation/props.d.ts b/packages/x-date-pickers/src/themeAugmentation/props.d.ts index 84feaf48aab51..066a1d694b3ec 100644 --- a/packages/x-date-pickers/src/themeAugmentation/props.d.ts +++ b/packages/x-date-pickers/src/themeAugmentation/props.d.ts @@ -17,7 +17,7 @@ import { PickerPopperProps } from '../internals/components/PickersPopper'; import { PickersToolbarProps } from '../internals/components/PickersToolbar'; import { PickersToolbarButtonProps } from '../internals/components/PickersToolbarButton'; import { ExportedPickersToolbarTextProps } from '../internals/components/PickersToolbarText'; -import { DateOrTimeView } from '../models'; +import { DateOrTimeView, PickerValidDate } from '../models'; import { DatePickerProps, DatePickerToolbarProps } from '../DatePicker'; import { DesktopDatePickerProps } from '../DesktopDatePicker'; @@ -55,25 +55,25 @@ import { import { PickersSectionListProps } from '../PickersSectionList'; export interface PickersComponentsPropsList { - MuiClock: ClockProps; + MuiClock: ClockProps; MuiClockNumber: ClockNumberProps; MuiClockPointer: ClockPointerProps; - MuiDateCalendar: DateCalendarProps; - MuiDateField: DateFieldProps; - MuiDatePickerToolbar: DatePickerToolbarProps; - MuiDateTimeField: DateTimeFieldProps; + MuiDateCalendar: DateCalendarProps; + MuiDateField: DateFieldProps; + MuiDatePickerToolbar: DatePickerToolbarProps; + MuiDateTimeField: DateTimeFieldProps; MuiDateTimePickerTabs: DateTimePickerTabsProps; - MuiDateTimePickerToolbar: DateTimePickerToolbarProps; - MuiDayCalendar: DayCalendarProps; + MuiDateTimePickerToolbar: DateTimePickerToolbarProps; + MuiDayCalendar: DayCalendarProps; MuiDayCalendarSkeleton: DayCalendarSkeletonProps; - MuiDigitalClock: ExportedDigitalClockProps; - MuiLocalizationProvider: LocalizationProviderProps; - MuiMonthCalendar: MonthCalendarProps; - MuiMultiSectionDigitalClock: MultiSectionDigitalClockProps; + MuiDigitalClock: ExportedDigitalClockProps; + MuiLocalizationProvider: LocalizationProviderProps; + MuiMonthCalendar: MonthCalendarProps; + MuiMultiSectionDigitalClock: MultiSectionDigitalClockProps; MuiMultiSectionDigitalClockSection: ExportedMultiSectionDigitalClockSectionProps; MuiPickersArrowSwitcher: ExportedPickersArrowSwitcherProps; - MuiPickersCalendarHeader: ExportedPickersCalendarHeaderProps; - MuiPickersDay: PickersDayProps; + MuiPickersCalendarHeader: ExportedPickersCalendarHeaderProps; + MuiPickersDay: PickersDayProps; MuiPickersFadeTransitionGroup: PickersFadeTransitionGroupProps; MuiPickersMonth: ExportedPickersMonthProps; MuiPickersPopper: PickerPopperProps; @@ -81,30 +81,30 @@ export interface PickersComponentsPropsList { MuiPickersToolbar: PickersToolbarProps; MuiPickersToolbarButton: PickersToolbarButtonProps; MuiPickersToolbarText: ExportedPickersToolbarTextProps; - MuiPickersLayout: PickersLayoutProps; + MuiPickersLayout: PickersLayoutProps; MuiPickersYear: ExportedPickersYearProps; - MuiTimeClock: TimeClockProps; - MuiTimeField: TimeFieldProps; - MuiTimePickerToolbar: TimePickerToolbarProps; - MuiYearCalendar: YearCalendarProps; + MuiTimeClock: TimeClockProps; + MuiTimeField: TimeFieldProps; + MuiTimePickerToolbar: TimePickerToolbarProps; + MuiYearCalendar: YearCalendarProps; // Date Pickers - MuiDatePicker: DatePickerProps; - MuiDesktopDatePicker: DesktopDatePickerProps; - MuiMobileDatePicker: MobileDatePickerProps; - MuiStaticDatePicker: StaticDatePickerProps; + MuiDatePicker: DatePickerProps; + MuiDesktopDatePicker: DesktopDatePickerProps; + MuiMobileDatePicker: MobileDatePickerProps; + MuiStaticDatePicker: StaticDatePickerProps; // Time Pickers - MuiTimePicker: TimePickerProps; - MuiDesktopTimePicker: DesktopTimePickerProps; - MuiMobileTimePicker: MobileTimePickerProps; - MuiStaticTimePicker: StaticTimePickerProps; + MuiTimePicker: TimePickerProps; + MuiDesktopTimePicker: DesktopTimePickerProps; + MuiMobileTimePicker: MobileTimePickerProps; + MuiStaticTimePicker: StaticTimePickerProps; // Date Time Pickers - MuiDateTimePicker: DateTimePickerProps; - MuiDesktopDateTimePicker: DesktopDateTimePickerProps; - MuiMobileDateTimePicker: MobileDateTimePickerProps; - MuiStaticDateTimePicker: StaticDateTimePickerProps; + MuiDateTimePicker: DateTimePickerProps; + MuiDesktopDateTimePicker: DesktopDateTimePickerProps; + MuiMobileDateTimePicker: MobileDateTimePickerProps; + MuiStaticDateTimePicker: StaticDateTimePickerProps; // V7 Picker's TextField MuiPickersTextField: PickersTextFieldProps; diff --git a/packages/x-date-pickers/src/timeViewRenderers/timeViewRenderers.tsx b/packages/x-date-pickers/src/timeViewRenderers/timeViewRenderers.tsx index 568a09abaf841..6d9d631c6d0df 100644 --- a/packages/x-date-pickers/src/timeViewRenderers/timeViewRenderers.tsx +++ b/packages/x-date-pickers/src/timeViewRenderers/timeViewRenderers.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; import { TimeClock, TimeClockProps } from '../TimeClock'; -import { TimeView } from '../models'; +import { PickerValidDate, TimeView } from '../models'; import { DigitalClock, DigitalClockProps } from '../DigitalClock'; import { BaseClockProps } from '../internals/models/props/clock'; import { @@ -20,7 +20,7 @@ export type TimeViewRendererProps< views: readonly TView[]; }; -export const renderTimeViewClock = ({ +export const renderTimeViewClock = ({ view, onViewChange, focusedView, @@ -82,7 +82,7 @@ export const renderTimeViewClock = ({ /> ); -export const renderDigitalClockTimeView = ({ +export const renderDigitalClockTimeView = ({ view, onViewChange, focusedView, @@ -147,7 +147,7 @@ export const renderDigitalClockTimeView = ({ /> ); -export const renderMultiSectionDigitalClockTimeView = ({ +export const renderMultiSectionDigitalClockTimeView = ({ view, onViewChange, focusedView, diff --git a/scripts/x-date-pickers-pro.exports.json b/scripts/x-date-pickers-pro.exports.json index 5343b4cafe9bf..e56672a9a27df 100644 --- a/scripts/x-date-pickers-pro.exports.json +++ b/scripts/x-date-pickers-pro.exports.json @@ -312,6 +312,8 @@ { "name": "pickersYearClasses", "kind": "Variable" }, { "name": "PickersYearClasses", "kind": "Interface" }, { "name": "PickersYearClassKey", "kind": "TypeAlias" }, + { "name": "PickerValidDate", "kind": "TypeAlias" }, + { "name": "PickerValidDateLookup", "kind": "Interface" }, { "name": "RangeFieldSection", "kind": "Interface" }, { "name": "RangePosition", "kind": "TypeAlias" }, { "name": "renderDateRangeViewCalendar", "kind": "Variable" }, diff --git a/scripts/x-date-pickers.exports.json b/scripts/x-date-pickers.exports.json index e7f8314be788d..db0a05484f4f3 100644 --- a/scripts/x-date-pickers.exports.json +++ b/scripts/x-date-pickers.exports.json @@ -233,6 +233,8 @@ { "name": "pickersYearClasses", "kind": "Variable" }, { "name": "PickersYearClasses", "kind": "Interface" }, { "name": "PickersYearClassKey", "kind": "TypeAlias" }, + { "name": "PickerValidDate", "kind": "TypeAlias" }, + { "name": "PickerValidDateLookup", "kind": "Interface" }, { "name": "renderDateViewCalendar", "kind": "Variable" }, { "name": "renderDigitalClockTimeView", "kind": "Variable" }, { "name": "renderMultiSectionDigitalClockTimeView", "kind": "Variable" }, diff --git a/test/utils/pickers/describeGregorianAdapter/describeGregorianAdapter.ts b/test/utils/pickers/describeGregorianAdapter/describeGregorianAdapter.ts index cf87ef967b2ac..09aa0c0a3ffc3 100644 --- a/test/utils/pickers/describeGregorianAdapter/describeGregorianAdapter.ts +++ b/test/utils/pickers/describeGregorianAdapter/describeGregorianAdapter.ts @@ -1,5 +1,5 @@ import createDescribe from '@mui-internal/test-utils/createDescribe'; -import { MuiPickersAdapter } from '@mui/x-date-pickers/models'; +import { MuiPickersAdapter, PickerValidDate } from '@mui/x-date-pickers/models'; import { testCalculations } from './testCalculations'; import { testLocalization } from './testLocalization'; import { testFormat } from './testFormat'; @@ -8,7 +8,7 @@ import { DescribeGregorianAdapterTestSuiteParams, } from './describeGregorianAdapter.types'; -function innerGregorianDescribeAdapter( +function innerGregorianDescribeAdapter( Adapter: new (...args: any) => MuiPickersAdapter, params: DescribeGregorianAdapterParams, ) { @@ -42,15 +42,15 @@ function innerGregorianDescribeAdapter( }); } -type Params = [ +type Params = [ Adapter: new (...args: any) => MuiPickersAdapter, params: DescribeGregorianAdapterParams, ]; type DescribeGregorianAdapter = { - (...args: Params): void; - skip: (...args: Params) => void; - only: (...args: Params) => void; + (...args: Params): void; + skip: (...args: Params) => void; + only: (...args: Params) => void; }; export const describeGregorianAdapter = createDescribe( diff --git a/test/utils/pickers/describeGregorianAdapter/describeGregorianAdapter.types.ts b/test/utils/pickers/describeGregorianAdapter/describeGregorianAdapter.types.ts index 052f0a1969422..2f1c49b76d2db 100644 --- a/test/utils/pickers/describeGregorianAdapter/describeGregorianAdapter.types.ts +++ b/test/utils/pickers/describeGregorianAdapter/describeGregorianAdapter.types.ts @@ -1,6 +1,6 @@ -import { MuiPickersAdapter, PickersTimezone } from '@mui/x-date-pickers/models'; +import { MuiPickersAdapter, PickersTimezone, PickerValidDate } from '@mui/x-date-pickers/models'; -export interface DescribeGregorianAdapterParams { +export interface DescribeGregorianAdapterParams { prepareAdapter?: (adapter: MuiPickersAdapter) => void; formatDateTime: string; getLocaleFromDate?: (value: TDate) => string; @@ -9,13 +9,13 @@ export interface DescribeGregorianAdapterParams { frenchLocale: TLocale; } -export interface DescribeGregorianAdapterTestSuiteParams +export interface DescribeGregorianAdapterTestSuiteParams extends Omit, 'frenchLocale'> { adapter: MuiPickersAdapter; adapterTZ: MuiPickersAdapter; adapterFr: MuiPickersAdapter; } -export type DescribeGregorianAdapterTestSuite = ( +export type DescribeGregorianAdapterTestSuite = ( params: DescribeGregorianAdapterTestSuiteParams, ) => void; diff --git a/test/utils/pickers/describeGregorianAdapter/testCalculations.ts b/test/utils/pickers/describeGregorianAdapter/testCalculations.ts index d3c4bed0632f6..e27fc0f3b458a 100644 --- a/test/utils/pickers/describeGregorianAdapter/testCalculations.ts +++ b/test/utils/pickers/describeGregorianAdapter/testCalculations.ts @@ -1,16 +1,19 @@ import { expect } from 'chai'; -import { MuiPickersAdapter, PickersTimezone } from '@mui/x-date-pickers/models'; +import { MuiPickersAdapter, PickersTimezone, PickerValidDate } from '@mui/x-date-pickers/models'; import { getDateOffset } from 'test/utils/pickers'; import { DescribeGregorianAdapterTestSuite } from './describeGregorianAdapter.types'; import { TEST_DATE_ISO_STRING, TEST_DATE_LOCALE_STRING } from './describeGregorianAdapter.utils'; /** - * To check if the date has the right offset even after changing it's date parts, + * To check if the date has the right offset even after changing its date parts, * we convert it to a different timezone that always has the same offset, * then we check that both dates have the same hour value. */ // We change to -const expectSameTimeInMonacoTZ = (adapter: MuiPickersAdapter, value: TDate) => { +const expectSameTimeInMonacoTZ = ( + adapter: MuiPickersAdapter, + value: TDate, +) => { const valueInMonacoTz = adapter.setTimezone(value, 'Europe/Monaco'); expect(adapter.getHours(value)).to.equal(adapter.getHours(valueInMonacoTz)); }; diff --git a/test/utils/pickers/describeHijriAdapter/describeHijriAdapter.ts b/test/utils/pickers/describeHijriAdapter/describeHijriAdapter.ts index 4592a70a605d7..ff5ecb2af047d 100644 --- a/test/utils/pickers/describeHijriAdapter/describeHijriAdapter.ts +++ b/test/utils/pickers/describeHijriAdapter/describeHijriAdapter.ts @@ -1,11 +1,11 @@ import createDescribe from '@mui-internal/test-utils/createDescribe'; -import { MuiPickersAdapter } from '@mui/x-date-pickers'; +import { MuiPickersAdapter, PickerValidDate } from '@mui/x-date-pickers/models'; import { testCalculations } from './testCalculations'; import { testLocalization } from './testLocalization'; import { testFormat } from './testFormat'; import { DescribeHijriAdapterParams } from './describeHijriAdapter.types'; -function innerJalaliDescribeAdapter( +function innerJalaliDescribeAdapter( Adapter: new (...args: any) => MuiPickersAdapter, params: DescribeHijriAdapterParams, ) { diff --git a/test/utils/pickers/describeHijriAdapter/describeHijriAdapter.types.ts b/test/utils/pickers/describeHijriAdapter/describeHijriAdapter.types.ts index 30fb1493e7683..09c2da3616a89 100644 --- a/test/utils/pickers/describeHijriAdapter/describeHijriAdapter.types.ts +++ b/test/utils/pickers/describeHijriAdapter/describeHijriAdapter.types.ts @@ -1,10 +1,10 @@ -import { MuiPickersAdapter } from '@mui/x-date-pickers/models'; +import { MuiPickersAdapter, PickerValidDate } from '@mui/x-date-pickers/models'; export interface DescribeHijriAdapterParams { before?: () => void; after?: () => void; } -export type DescribeHijriAdapterTestSuite = (params: { +export type DescribeHijriAdapterTestSuite = (params: { adapter: MuiPickersAdapter; }) => void; diff --git a/test/utils/pickers/describeJalaliAdapter/describeJalaliAdapter.ts b/test/utils/pickers/describeJalaliAdapter/describeJalaliAdapter.ts index a0a699b6adf87..a09f6257d4861 100644 --- a/test/utils/pickers/describeJalaliAdapter/describeJalaliAdapter.ts +++ b/test/utils/pickers/describeJalaliAdapter/describeJalaliAdapter.ts @@ -1,11 +1,11 @@ import createDescribe from '@mui-internal/test-utils/createDescribe'; -import { MuiPickersAdapter } from '@mui/x-date-pickers'; +import { MuiPickersAdapter, PickerValidDate } from '@mui/x-date-pickers/models'; import { testCalculations } from './testCalculations'; import { testLocalization } from './testLocalization'; import { testFormat } from './testFormat'; import { DescribeJalaliAdapterParams } from './describeJalaliAdapter.types'; -function innerJalaliDescribeAdapter( +function innerJalaliDescribeAdapter( Adapter: new (...args: any) => MuiPickersAdapter, params: DescribeJalaliAdapterParams, ) { diff --git a/test/utils/pickers/describeJalaliAdapter/describeJalaliAdapter.types.ts b/test/utils/pickers/describeJalaliAdapter/describeJalaliAdapter.types.ts index be7b2904119bd..176319483313f 100644 --- a/test/utils/pickers/describeJalaliAdapter/describeJalaliAdapter.types.ts +++ b/test/utils/pickers/describeJalaliAdapter/describeJalaliAdapter.types.ts @@ -1,10 +1,10 @@ -import { MuiPickersAdapter } from '@mui/x-date-pickers/models'; +import { MuiPickersAdapter, PickerValidDate } from '@mui/x-date-pickers/models'; export interface DescribeJalaliAdapterParams { before?: () => void; after?: () => void; } -export type DescribeJalaliAdapterTestSuite = (params: { +export type DescribeJalaliAdapterTestSuite = (params: { adapter: MuiPickersAdapter; }) => void; diff --git a/test/utils/pickers/misc.ts b/test/utils/pickers/misc.ts index 97a08af557017..14afbe8208742 100644 --- a/test/utils/pickers/misc.ts +++ b/test/utils/pickers/misc.ts @@ -1,5 +1,5 @@ import sinon from 'sinon'; -import { MuiPickersAdapter } from '@mui/x-date-pickers/models'; +import { MuiPickersAdapter, PickerValidDate } from '@mui/x-date-pickers/models'; import { PickerComponentFamily } from './describe.types'; import { OpenPickerParams } from './openPicker'; @@ -48,7 +48,7 @@ export const getExpectedOnChangeCount = ( return getChangeCountForComponentFamily(componentFamily); }; -export const getDateOffset = ( +export const getDateOffset = ( adapter: MuiPickersAdapter, date: TDate, ) => { @@ -57,7 +57,7 @@ export const getDateOffset = ( return cleanUtcHour * 60; }; -export const formatFullTimeValue = ( +export const formatFullTimeValue = ( adapter: MuiPickersAdapter, value: TDate, ) => {