Fix

mui · Jan 24, 2025 · 40c8435 · 40c8435
1 parent 51ef7a0
commit 40c8435
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 1 deletion.
diff --git a/...pickers-pro/src/internals/utils/createMultiInputRangeField/createMultiInputRangeField.tsx b/...pickers-pro/src/internals/utils/createMultiInputRangeField/createMultiInputRangeField.tsx
@@ -7,6 +7,7 @@ import Typography from '@mui/material/Typography';
 import { styled, useThemeProps } from '@mui/material/styles';
 import composeClasses from '@mui/utils/composeClasses';
 import useSlotProps from '@mui/utils/useSlotProps';
+import useForkRef from '@mui/utils/useForkRef';
 import { cleanFieldResponse, useFieldOwnerState } from '@mui/x-date-pickers/internals';
 import { useSplitFieldProps } from '@mui/x-date-pickers/hooks';
 import { PickersTextField } from '@mui/x-date-pickers/PickersTextField';
@@ -17,6 +18,7 @@ import {
 } from './createMultiInputRangeField.types';
 import { useMultiInputRangeField } from '../../../hooks/useMultiInputRangeField';
 import { PickerAnyRangeManager } from '../../models/managers';
+import { useNullablePickerContext } from '@mui/x-date-pickers/internals/hooks/useNullablePickerContext';
 
 export function createMultiInputRangeField<TManager extends PickerAnyRangeManager>({
   useManager,
@@ -77,13 +79,15 @@ export function createMultiInputRangeField<TManager extends PickerAnyRangeManage
 
     const classes = useUtilityClasses(classesProp);
     const ownerState = useFieldOwnerState(internalProps as any);
+    const pickerContext = useNullablePickerContext();
+    const handleRef = useForkRef(ref, pickerContext?.rootRef);
 
     const Root = slots?.root ?? MultiInputRangeFieldRoot;
     const rootProps = useSlotProps({
       elementType: Root,
       externalSlotProps: slotProps?.root,
       externalForwardedProps: otherForwardedProps,
-      additionalProps: { ref },
+      additionalProps: { ref: handleRef },
       ownerState,
       className: clsx(className, classes.root),
     });

diff --git a/packages/x-date-pickers/src/internals/components/PickerFieldUI.tsx b/packages/x-date-pickers/src/internals/components/PickerFieldUI.tsx
@@ -1,5 +1,6 @@
 import * as React from 'react';
 import useEventCallback from '@mui/utils/useEventCallback';
+import useForkRef from '@mui/utils/useForkRef';
 import resolveComponentProps from '@mui/utils/resolveComponentProps';
 import MuiTextField, { TextFieldProps } from '@mui/material/TextField';
 import MuiIconButton, { IconButtonProps } from '@mui/material/IconButton';
@@ -206,6 +207,8 @@ export function PickerFieldUI(props: PickerFieldUIProps) {
     ownerState,
   });
 
+  textFieldProps.ref = useForkRef(textFieldProps.ref, pickerContext?.rootRef);
+
   if (!textFieldProps.InputProps) {
     textFieldProps.InputProps = {};
   }