Move autoFocus to the field internal props

mui · Jan 15, 2025 · f860cc9 · f860cc9
1 parent a7654f2
commit f860cc9
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 5 deletions.
diff --git a/packages/x-date-pickers/src/hooks/useSplitFieldProps.ts b/packages/x-date-pickers/src/hooks/useSplitFieldProps.ts
@@ -26,6 +26,7 @@ const SHARED_FIELD_INTERNAL_PROP_NAMES = [
   'disabled',
   'readOnly',
   'dateSeparator',
+  'autoFocus',
 ] as const;
 
 type InternalPropNames<TValueType extends PickerValueType> =
@@ -39,7 +40,7 @@ type InternalPropNames<TValueType extends PickerValueType> =
  * - `internalProps` which are used by the various hooks called by the field component.
  * - `forwardedProps` which are passed to the underlying component.
  * Note that some forwarded props might be used by the hooks as well.
- * For instance, hooks like `useDateField` need props like `autoFocus` to know how to behave.
+ * For instance, hooks like `useDateField` need props like `onKeyDown` to merge the default even handler and the one provided by the application.
  * @template TProps, TValueType
  * @param {TProps} props The props received by the field component.
  * @param {TValueType} valueType The type of the field value ('date', 'time', or 'date-time').

diff --git a/packages/x-date-pickers/src/internals/hooks/useField/useField.ts b/packages/x-date-pickers/src/internals/hooks/useField/useField.ts
@@ -47,6 +47,7 @@ export const useField = <
       enableAccessibleFieldDOMStructure = true,
       disabled = false,
       readOnly = false,
+      autoFocus = false,
     },
     forwardedProps: { onKeyDown, error, clearable, onClear },
     fieldValueManager,
@@ -289,6 +290,7 @@ export const useField = <
   const commonAdditionalProps: UseFieldCommonAdditionalProps = {
     disabled,
     readOnly,
+    autoFocus,
     openPickerAriaLabel,
   };
 

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
@@ -126,7 +126,9 @@ export interface UseFieldInternalProps<
 }
 
 export interface UseFieldCommonAdditionalProps
-  extends Required<Pick<UseFieldInternalProps<any, any, any>, 'disabled' | 'readOnly'>> {
+  extends Required<
+    Pick<UseFieldInternalProps<any, any, any>, 'disabled' | 'readOnly' | 'autoFocus'>
+  > {
   /**
    * The aria label to set on the button that opens the picker.
    */
@@ -166,7 +168,6 @@ interface UseFieldV6AdditionalProps
 
 export interface UseFieldV7ForwardedProps {
   focused?: boolean;
-  autoFocus?: boolean;
   sectionListRef?: React.Ref<PickersSectionListRef>;
   onBlur?: () => void;
   onClick?: React.MouseEventHandler;

diff --git a/packages/x-date-pickers/src/internals/hooks/useField/useFieldV7TextField.ts b/packages/x-date-pickers/src/internals/hooks/useField/useFieldV7TextField.ts
@@ -16,7 +16,7 @@ import { useUtils } from '../useUtils';
 
 export const useFieldV7TextField: UseFieldTextField<true> = (params) => {
   const {
-    internalProps: { disabled, readOnly = false },
+    internalProps: { disabled, readOnly = false, autoFocus = false },
     forwardedProps: {
       sectionListRef: inSectionListRef,
       onBlur,
@@ -25,7 +25,6 @@ export const useFieldV7TextField: UseFieldTextField<true> = (params) => {
       onInput,
       onPaste,
       focused: focusedProp,
-      autoFocus = false,
     },
     fieldValueManager,
     applyCharacterEditing,