@mui/x-date-pickers 9.0.0-rc.0 → 9.0.0

package/internals/components/PickerFieldUI.mjs

@@ -2,12 +2,12 @@
 
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["InputProps", "readOnly", "onClear", "clearable", "clearButtonPosition", "openPickerButtonPosition", "openPickerAriaLabel"],
+const _excluded = ["readOnly", "onClear", "clearable", "clearButtonPosition", "openPickerButtonPosition", "openPickerAriaLabel", "InputProps", "inputProps", "InputLabelProps", "FormHelperTextProps"],
   _excluded2 = ["ownerState"],
   _excluded3 = ["ownerState"],
   _excluded4 = ["ownerState"],
   _excluded5 = ["ownerState"],
-  _excluded6 = ["InputProps", "inputProps"];
+  _excluded6 = ["InputProps", "inputProps", "InputLabelProps", "FormHelperTextProps"];
 import * as React from 'react';
 import useEventCallback from '@mui/utils/useEventCallback';
 import useForkRef from '@mui/utils/useForkRef';
@@ -15,41 +15,49 @@ import resolveComponentProps from '@mui/utils/resolveComponentProps';
 import MuiIconButton from '@mui/material/IconButton';
 import MuiInputAdornment from '@mui/material/InputAdornment';
 import useSlotProps from '@mui/utils/useSlotProps';
+import { warnOnce } from '@mui/x-internals/warning';
 import { useFieldOwnerState } from "../hooks/useFieldOwnerState.mjs";
 import { usePickerTranslations } from "../../hooks/index.mjs";
 import { ClearIcon as MuiClearIcon } from "../../icons/index.mjs";
 import { useNullablePickerContext } from "../hooks/useNullablePickerContext.mjs";
 import { PickersTextField } from "../../PickersTextField/index.mjs";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const noop = () => {};
 export const cleanFieldResponse = fieldResponse => {
-  const {
-      InputProps,
+  const _ref = fieldResponse,
+    {
       readOnly,
       onClear,
       clearable,
       clearButtonPosition,
       openPickerButtonPosition,
-      openPickerAriaLabel
-    } = fieldResponse,
-    other = _objectWithoutPropertiesLoose(fieldResponse, _excluded);
-  const mergedInputProps = other?.slotProps?.input ? mergeSlotProps(other?.slotProps?.input, InputProps) : noop;
+      openPickerAriaLabel,
+      // TODO v10: remove
+      // Explicitly discard legacy props that are no longer supported on `PickersTextField`.
+      // Without this, any leftover values would silently leak into `...other` and end up spread
+      // as unknown attributes on the underlying form control.
+      InputProps: legacyInputProps,
+      inputProps: legacyHtmlInputProps,
+      InputLabelProps: legacyInputLabelProps,
+      FormHelperTextProps: legacyFormHelperTextProps
+    } = _ref,
+    other = _objectWithoutPropertiesLoose(_ref, _excluded);
+  if (process.env.NODE_ENV !== 'production') {
+    if (legacyInputProps || legacyHtmlInputProps || legacyInputLabelProps || legacyFormHelperTextProps) {
+      warnOnce(['MUI X: The `InputProps`, `inputProps`, `InputLabelProps` and `FormHelperTextProps` props are no longer supported on Picker / Field components.', 'They have been silently dropped because they would otherwise be forwarded as unknown attributes on the underlying form control.', 'Use the `slotProps` shape instead (`slotProps.input`, `slotProps.htmlInput`, `slotProps.inputLabel`, `slotProps.formHelperText`).', 'See https://mui.com/x/migration/migration-pickers-v8/#textfield-props for migration details.']);
+    }
+  }
   return {
     clearable,
     onClear,
     clearButtonPosition,
     openPickerButtonPosition,
     openPickerAriaLabel,
-    textFieldProps: _extends({}, other, other?.slotProps?.input || other?.slotProps?.htmlInput ? {
+    textFieldProps: _extends({}, other, {
       slotProps: _extends({}, other?.slotProps, {
-        input: ownerState => _extends({}, resolveComponentProps(mergedInputProps, ownerState), {
+        input: _extends({}, other?.slotProps?.input, {
           readOnly
         })
       })
-    } : {
-      InputProps: _extends({}, InputProps ?? {}, {
-        readOnly
-      })
     })
   };
 };
@@ -165,13 +173,14 @@ export function PickerFieldUI(props) {
     ownerState
   });
   textFieldProps.ref = useForkRef(textFieldProps.ref, pickerContext?.rootRef);
-  const additionalTextFieldInputProps = {};
-  const textFieldInputProps = resolveComponentProps(textFieldProps?.slotProps?.input ?? textFieldProps.InputProps, ownerState);
+  const externalInputSlotProps = textFieldProps.slotProps?.input;
+  const additionalInputSlotProps = {};
+  const forkedInputRef = useForkRef(externalInputSlotProps?.ref, pickerContext?.triggerRef);
   if (pickerContext) {
-    additionalTextFieldInputProps.ref = pickerContext.triggerRef;
+    additionalInputSlotProps.ref = forkedInputRef;
   }
-  if (!textFieldInputProps?.startAdornment && (clearButtonPosition === 'start' || openPickerButtonPosition === 'start')) {
-    additionalTextFieldInputProps.startAdornment = /*#__PURE__*/_jsxs(InputAdornment, _extends({}, startInputAdornmentProps, {
+  if (!externalInputSlotProps?.startAdornment && (clearButtonPosition === 'start' || openPickerButtonPosition === 'start')) {
+    additionalInputSlotProps.startAdornment = /*#__PURE__*/_jsxs(InputAdornment, _extends({}, startInputAdornmentProps, {
       children: [openPickerButtonPosition === 'start' && /*#__PURE__*/_jsx(OpenPickerButton, _extends({}, openPickerButtonProps, {
         children: /*#__PURE__*/_jsx(OpenPickerIcon, _extends({}, openPickerIconProps))
       })), clearButtonPosition === 'start' && /*#__PURE__*/_jsx(ClearButton, _extends({}, clearButtonProps, {
@@ -179,8 +188,8 @@ export function PickerFieldUI(props) {
       }))]
     }));
   }
-  if (!textFieldInputProps?.endAdornment && (clearButtonPosition === 'end' || openPickerButtonPosition === 'end')) {
-    additionalTextFieldInputProps.endAdornment = /*#__PURE__*/_jsxs(InputAdornment, _extends({}, endInputAdornmentProps, {
+  if (!externalInputSlotProps?.endAdornment && (clearButtonPosition === 'end' || openPickerButtonPosition === 'end')) {
+    additionalInputSlotProps.endAdornment = /*#__PURE__*/_jsxs(InputAdornment, _extends({}, endInputAdornmentProps, {
       children: [clearButtonPosition === 'end' && /*#__PURE__*/_jsx(ClearButton, _extends({}, clearButtonProps, {
         children: /*#__PURE__*/_jsx(ClearIcon, _extends({}, clearIconProps))
       })), openPickerButtonPosition === 'end' && /*#__PURE__*/_jsx(OpenPickerButton, _extends({}, openPickerButtonProps, {
@@ -189,8 +198,8 @@ export function PickerFieldUI(props) {
     }));
   }
   // handle the case of showing custom `inputAdornment` for Field components
-  if (!additionalTextFieldInputProps?.endAdornment && !additionalTextFieldInputProps?.startAdornment && pickerFieldUIContext.slots.inputAdornment) {
-    additionalTextFieldInputProps.endAdornment = /*#__PURE__*/_jsx(InputAdornment, _extends({}, endInputAdornmentProps));
+  if (!additionalInputSlotProps.endAdornment && !additionalInputSlotProps.startAdornment && pickerFieldUIContext.slots.inputAdornment) {
+    additionalInputSlotProps.endAdornment = /*#__PURE__*/_jsx(InputAdornment, _extends({}, endInputAdornmentProps));
   }
   if (clearButtonPosition != null) {
     textFieldProps.sx = [{
@@ -209,19 +218,10 @@ export function PickerFieldUI(props) {
       }
     }, ...(Array.isArray(textFieldProps.sx) ? textFieldProps.sx : [textFieldProps.sx])];
   }
-  const resolvedTextFieldInputProps = textFieldProps?.slotProps?.input ? resolveComponentProps(mergeSlotProps(textFieldInputProps, additionalTextFieldInputProps), ownerState) : _extends({}, textFieldInputProps, additionalTextFieldInputProps);
-
-  // We need to resolve the `inputProps` since we are messing with those props in this component.
-  textFieldProps.inputProps = textFieldProps?.slotProps?.htmlInput ? resolveComponentProps(textFieldProps.slotProps.htmlInput, ownerState) : textFieldProps.inputProps;
-
-  // Remove the `input` slotProps to avoid them overriding the manually resolved `InputProps`.
-  // `slotProps` would take precedence over `InputProps`.
-  delete textFieldProps?.slotProps?.input;
-  // Remove the `slotProps` on `PickersTextField` as they are not supported.
-  delete textFieldProps?.slotProps;
-  return /*#__PURE__*/_jsx(TextField, _extends({}, textFieldProps, {
-    InputProps: resolvedTextFieldInputProps
-  }));
+  textFieldProps.slotProps = _extends({}, textFieldProps.slotProps, {
+    input: _extends({}, externalInputSlotProps, additionalInputSlotProps)
+  });
+  return /*#__PURE__*/_jsx(TextField, _extends({}, textFieldProps));
 }
 export function mergeSlotProps(slotPropsA, slotPropsB) {
   if (!slotPropsA) {
@@ -249,15 +249,28 @@ export function useFieldTextFieldProps(parameters) {
   const pickerFieldUIContext = React.useContext(PickerFieldUIContext);
   const pickerContext = useNullablePickerContext();
   const ownerState = useFieldOwnerState(externalForwardedProps);
-  const {
-      InputProps,
-      inputProps
-    } = externalForwardedProps,
-    otherExternalForwardedProps = _objectWithoutPropertiesLoose(externalForwardedProps, _excluded6);
+
+  // TODO v10: remove
+  // Strip the legacy `InputProps` / `inputProps` / `InputLabelProps` / `FormHelperTextProps`
+  // before they reach `PickersTextField`, which would silently ignore them. JS users without
+  // TypeScript checks would otherwise see their configuration vanish.
+  const _ref2 = externalForwardedProps ?? {},
+    {
+      InputProps: legacyInputProps,
+      inputProps: legacyHtmlInputProps,
+      InputLabelProps: legacyInputLabelProps,
+      FormHelperTextProps: legacyFormHelperTextProps
+    } = _ref2,
+    sanitizedExternalForwardedProps = _objectWithoutPropertiesLoose(_ref2, _excluded6);
+  if (process.env.NODE_ENV !== 'production') {
+    if (legacyInputProps || legacyHtmlInputProps || legacyInputLabelProps || legacyFormHelperTextProps) {
+      warnOnce(['MUI X: Field components no longer accept the `InputProps`, `inputProps`, `InputLabelProps` and `FormHelperTextProps` props.', 'They have been dropped to avoid leaking unknown attributes onto the underlying form control.', 'Use the nested `slotProps.textField.slotProps.{input,htmlInput,inputLabel,formHelperText}` shape instead.']);
+    }
+  }
   const textFieldProps = useSlotProps({
     elementType: PickersTextField,
     externalSlotProps: mergeSlotProps(pickerFieldUIContext.slotProps.textField, slotProps?.textField),
-    externalForwardedProps: otherExternalForwardedProps,
+    externalForwardedProps: sanitizedExternalForwardedProps,
     additionalProps: {
       ref,
       sx: pickerContext?.rootSx,
@@ -303,10 +316,6 @@ export function useFieldTextFieldProps(parameters) {
       }
     };
   }
-
-  // TODO: Remove when mui/material-ui#35088 will be merged
-  textFieldProps.inputProps = _extends({}, inputProps, textFieldProps.inputProps);
-  textFieldProps.InputProps = _extends({}, InputProps, textFieldProps.InputProps);
   return textFieldProps;
 }
 export function PickerFieldUIContextProvider(props) {

package/models/fields.d.mts

@@ -143,7 +143,7 @@ export type BaseSingleInputPickersTextFieldProps = Omit<UseFieldReturnValue<Base
 /**
  * Props the built-in text field component can receive.
  */
-export type BuiltInFieldTextFieldProps = Partial<Omit<PickersTextFieldProps, keyof ExportedPickersSectionListProps>>;
+export type BuiltInFieldTextFieldProps = Partial<Omit<PickersTextFieldProps, keyof ExportedPickersSectionListProps | 'slots' | 'slotProps'>>;
 export interface PickerTextFieldOwnerState extends FieldOwnerState {
   /**
    * `true` if the value of the field is currently empty.

package/models/fields.d.ts

@@ -143,7 +143,7 @@ export type BaseSingleInputPickersTextFieldProps = Omit<UseFieldReturnValue<Base
 /**
  * Props the built-in text field component can receive.
  */
-export type BuiltInFieldTextFieldProps = Partial<Omit<PickersTextFieldProps, keyof ExportedPickersSectionListProps>>;
+export type BuiltInFieldTextFieldProps = Partial<Omit<PickersTextFieldProps, keyof ExportedPickersSectionListProps | 'slots' | 'slotProps'>>;
 export interface PickerTextFieldOwnerState extends FieldOwnerState {
   /**
    * `true` if the value of the field is currently empty.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-date-pickers",
-  "version": "9.0.0-rc.0",
+  "version": "9.0.0",
   "author": "MUI Team",
   "description": "The community edition of the MUI X Date and Time Picker components.",
   "license": "MIT",
@@ -34,18 +34,18 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.28.6",
-    "@mui/utils": "9.0.0-beta.1",
+    "@mui/utils": "9.0.0",
     "@types/react-transition-group": "^4.4.12",
     "clsx": "^2.1.1",
     "prop-types": "^15.8.1",
     "react-transition-group": "^4.4.5",
-    "@mui/x-internals": "9.0.0-rc.0"
+    "@mui/x-internals": "^9.0.0"
   },
   "peerDependencies": {
     "@emotion/react": "^11.9.0",
     "@emotion/styled": "^11.8.1",
-    "@mui/material": "^7.3.0 || ^9.0.0-beta.0 || ^9.0.0",
-    "@mui/system": "^7.3.0 || ^9.0.0-beta.1",
+    "@mui/material": "^7.3.0 || ^9.0.0",
+    "@mui/system": "^7.3.0 || ^9.0.0",
     "date-fns": "^2.25.0 || ^3.2.0 || ^4.0.0",
     "date-fns-jalali": "^2.13.0-0 || ^3.2.0-0 || ^4.0.0-0",
     "dayjs": "^1.10.7",