@mui/x-date-pickers-pro 6.0.2 → 6.0.4

package/CHANGELOG.md

@@ -3,6 +3,121 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 6.0.4
+
+_Mar 30, 2023_
+
+We'd like to offer a big thanks to the 9 contributors who made this release possible. Here are some highlights ✨:
+
+- 🌍 Add Danish (da-DK), and improve Norwegian (nb-NO), Spanish (es-ES), and Swedish (sv-SE) locales
+- 🐞 Bugfixes
+- 📚 Documentation improvements
+
+### `@mui/x-data-grid@v6.0.4` / `@mui/x-data-grid-pro@v6.0.4` / `@mui/x-data-grid-premium@v6.0.4`
+
+#### Changes
+
+- [DataGrid] Fix column header tooltip not showing when the title is truncated (#8433) @rohitnatesh
+- [DataGrid] Fix filter model buttons' display condition (#8415) @MBilalShafi
+- [DataGrid] Fix infinite rerender in a flex parent (#8436) @cherniavskii
+- [DataGrid] Prevent reopening column menu when clicking in the button while it is open (#8286) @tanuj-22
+- [DataGrid] Rename `components` by `slots` in column menu API (#7999) @MBilalShafi
+- [DataGrid] Remove hardcoded CSS classes' usages (#8444) @MBilalShafi
+- [DataGridPremium] Fix aggregation initial state causing issue with quick filter (#8441) @MBilalShafi
+- [l10n] Improve Danish (da-DK) locale (#8368) @BossElijah
+- [l10n] Improve Danish (da-DK) locale (#8378) @BossElijah
+- [l10n] Improve Norwegian (nb-NO) locale (#8367) @BossElijah
+- [l10n] Improve Norwegian (nb-NO) locale (#8409) @BossElijah
+- [l10n] Improve Spanish (es-ES) locale (#8420) @martjanz
+- [l10n] Improve Swedish (sv-SE) locale (#8381) @BossElijah
+
+### `@mui/x-date-pickers@v6.0.4` / `@mui/x-date-pickers-pro@v6.0.4`
+
+#### Changes
+
+- [fields] Add missing tokens to `AdapterDateFnsJalali` (#8402) @flaviendelangle
+- [fields] Clean the active date manager (#8370) @flaviendelangle
+- [fields] Cleanup `useFieldState`  (#8292) @flaviendelangle
+- [fields] Only add RTL characters when needed (#8325) @flaviendelangle
+- [pickers] Add support for single input fields in range pickers  (#7927) @flaviendelangle
+- [pickers] Allows non token characters in format (#8256) @alexfauquette
+- [pickers] Avoid root imports and move public models to the models folder (#8337) @flaviendelangle
+- [pickers] Update `view` when `views` or `openTo` changes (#8361) @LukasTy
+- [l10n] Improve Norwegian (nb-NO) locale (#8382) @BossElijah
+- [l10n] Add Danish (da-DK) locale (#8379) @BossElijah
+- [l10n] Improve Swedish (sv-SE) locale (#8381) @BossElijah
+
+### `@mui/x-codemod@v6.0.4`
+
+#### Changes
+
+- [codemod] Fix `remove-stabilized-experimentalFeatures` codemod (#8289) @alexfauquette
+
+### Docs
+
+- [docs] Fix `GridCellParams` signature in migration guide (#8427) @cherniavskii
+- [docs] Fix "Custom field" demos responsive styles (#8408) @LukasTy
+- [docs] Remove `label` from demos where it reduces clarity (#8416) @LukasTy
+- [docs] Update slots' references in Data Grid migration guide (#8159) @MBilalShafi
+
+### Core
+
+- [charts] Work on typing (#8421) @flaviendelangle
+
+## 6.0.3
+
+_Mar 23, 2023_
+
+We'd like to offer a big thanks to the 11 contributors who made this release possible. Here are some highlights ✨:
+
+- 🌍 Improve Bulgarian (bg-BG), Persian (fa-IR), Polish (pl-PL), and Dutch (nl-NL) locales
+- 🐞 Bugfixes
+- 📚 Documentation improvements
+
+### `@mui/x-data-grid@v6.0.3` / `@mui/x-data-grid-pro@v6.0.3` / `@mui/x-data-grid-premium@v6.0.3`
+
+#### Changes
+
+- [DataGrid] Fix overflow calculation issue in column group headers (#8246) @MBilalShafi
+- [DataGridPro] Fix column reorder glitches (#8335) @cherniavskii
+- [l10n] Improve Bulgarian (bg-BG) locale (#8315) @todevmilen
+- [l10n] Improve Persian (fa-IR) locale (#8268) @fakhamatia
+- [l10n] improve Dutch (nl-NL) locale (#8317) @developenguin
+
+### `@mui/x-date-pickers@v6.0.3` / `@mui/x-date-pickers-pro@v6.0.3`
+
+#### Changes
+
+- [fields] Allow to reset the value from the outside (#8287) @flaviendelangle
+- [fields] Cleanup section order generation (#8290) @flaviendelangle
+- [fields] Fix Safari input selection resetting regression (#8295) @LukasTy
+- [fields] Fix editing when all sections are selected (#8330) @flaviendelangle
+- [fields] Fix iOS browser scroll jumping when entering data (#8328) @LukasTy
+- [fields] New prop `unstableFieldRef` to imperatively interact with the selected sections (#8235) @flaviendelangle
+- [pickers] Align date calendar colors (#8318) @LukasTy
+- [pickers] Support invalid dates from the field (#8298) @flaviendelangle
+- [l10n] Improve Persian (fa-IR) locale (#8268) @fakhamatia
+- [l10n] Improve Polish (pl-PL) locale (#8344) @drmats
+- [l10n] improve Dutch (nl-NL) locale (#8317) @developenguin
+
+### Docs
+
+- [docs] Create examples of pickers with custom fields (#8034) @flaviendelangle
+- [docs] Fix 301 redirections @oliviertassinari
+- [docs] Fix link to React's docs @oliviertassinari
+- [docs] Fix pro license links to point to the same page (#8303) @LukasTy
+- [docs] Give an incentive to upgrade (#8269) @oliviertassinari
+- [docs] Improve contrast on data grid navigation (#8239) @oliviertassinari
+- [docs] Update shortcuts page to use slotProps (#8288) @dcorb
+- [docs] Explain the `shouldDisableTime` migration in more depth (#8348) @LukasTy
+
+### Core
+
+- [core] Remove unused `visx` chart package (#8259) @LukasTy
+- [core] Upgrade monorepo (#8331) @cherniavskii
+- [charts] Project setup (#8308) @alexfauquette
+- [test] Track visual regressions of column menu and filter/column panels (#8095) @cherniavskii
+
 ## 6.0.2
 
 _Mar 16, 2023_
@@ -98,11 +213,9 @@ We'd like to offer a big thanks to the 8 contributors who made this release poss
 
 _Mar 3, 2023_
 
-We're happy to announce the first v6 stable release! 🎉🚀
+We're excited to [announce the first v6 stable release](https://mui.com/blog/mui-x-v6/)! 🎉🚀
 
 This is now the officially supported major version, where we'll keep rolling out new features, bug fixes, and improvements.
-Head over to the [what's new](https://mui.com/x/whats-new/) page to check the highlighted new features.
-
 Migration guides are available with a complete list of the breaking changes:
 
 - [Data Grid](https://mui.com/x/migration/migration-data-grid-v5/)
@@ -119,6 +232,7 @@ We'd like to offer a big thanks to the 12 contributors who made this release pos
   -  experimentalFeatures={{ rowPinning: true }}
    />
   ```
+
 - ⚡️ Improved grid performance by rows and cells memoization (#7846) @m4theushw
 - ✨ Fields have a distinct visual state when empty (#8069) @LukasTy
 - 🌍 Improve Czech (cs-CZ) locale (#8113) @BlastyCZ
@@ -556,14 +670,14 @@ We'd like to offer a big thanks to the 10 contributors who made this release pos
   ```
 
 - The `error` and `onError` props were removed - the grid no longer catches errors during rendering.
-  To catch errors that happen during rendering use the [error boundary](https://reactjs.org/docs/error-boundaries.html).
+  To catch errors that happen during rendering use the [error boundary](https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary).
 
 - The `components.ErrorOverlay` slot was removed.
 
 - The `GridErrorOverlay` component was removed.
 
 - The `componentError` event was removed.
-  Use the [error boundary](https://reactjs.org/docs/error-boundaries.html) to catch errors thrown during rendering.
+  Use the [error boundary](https://react.dev/reference/react/Component#catching-rendering-errors-with-an-error-boundary) to catch errors thrown during rendering.
 
 - The `apiRef.current.showError` method was removed.
   The UI for errors is no longer handled by the grid.

package/DateRangePicker/DateRangePicker.js

@@ -147,6 +147,18 @@ process.env.NODE_ENV !== "production" ? DateRangePicker.propTypes = {
    * Defaults to localized format based on the used `views`.
    */
   format: PropTypes.string,
+  /**
+   * Pass a ref to the `input` element.
+   * Ignored if the field has several inputs.
+   */
+  inputRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({
+    current: PropTypes.object
+  })]),
+  /**
+   * The label content.
+   * Ignored if the field has several inputs.
+   */
+  label: PropTypes.node,
   /**
    * If `true`, calls `renderLoading` instead of rendering the day calendar.
    * Can be used to preload information and show it in calendar.

package/DateRangePicker/DateRangePickerToolbar.d.ts

@@ -3,7 +3,7 @@ import { BaseToolbarProps, ExportedBaseToolbarProps } from '@mui/x-date-pickers/
 import { DateRange } from '../internal/models';
 import { UseRangePositionResponse } from '../internal/hooks/useRangePosition';
 import { DateRangePickerToolbarClasses } from './dateRangePickerToolbarClasses';
-export interface DateRangePickerToolbarProps<TDate> extends Omit<BaseToolbarProps<DateRange<TDate>, 'day'>, 'views' | 'view' | 'onViewChange' | 'onChange' | 'isLandscape'>, UseRangePositionResponse {
+export interface DateRangePickerToolbarProps<TDate> extends Omit<BaseToolbarProps<DateRange<TDate>, 'day'>, 'views' | 'view' | 'onViewChange' | 'onChange' | 'isLandscape'>, Pick<UseRangePositionResponse, 'rangePosition' | 'onRangePositionChange'> {
     classes?: Partial<DateRangePickerToolbarClasses>;
 }
 export interface ExportedDateRangePickerToolbarProps extends ExportedBaseToolbarProps {

package/DateRangePicker/shared.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { LocalizedComponent } from '@mui/x-date-pickers';
+import { LocalizedComponent } from '@mui/x-date-pickers/locales';
 import { DefaultizedProps, BaseDateValidationProps, BasePickerInputProps, PickerViewRendererLookup, UncapitalizeObjectKeys } from '@mui/x-date-pickers/internals';
 import { DateRangeValidationError } from '../internal/hooks/validation/useDateRangeValidation';
 import { DateRange } from '../internal/models';

package/DateRangePickerDay/DateRangePickerDay.js

@@ -80,7 +80,7 @@ const DateRangePickerDayRoot = styled('div', {
 }, ownerState.isHighlighting && {
   borderRadius: 0,
   color: (theme.vars || theme).palette.primary.contrastText,
-  backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.lightChannel} / 0.6)` : alpha(theme.palette.primary.light, 0.6),
+  backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.focusOpacity})` : alpha(theme.palette.primary.main, theme.palette.action.focusOpacity),
   '&:first-of-type': startBorderStyle,
   '&:last-of-type': endBorderStyle
 }, (ownerState.isStartOfHighlighting || ownerState.isFirstVisibleCell) && _extends({}, startBorderStyle, {
@@ -139,7 +139,6 @@ const DateRangePickerDayDay = styled(PickersDay, {
     [`&.${dateRangePickerDayClasses.notSelectedDate}`]: styles.notSelectedDate
   }, styles.day]
 })(({
-  theme,
   ownerState
 }) => _extends({
   // Required to overlap preview border
@@ -147,12 +146,10 @@ const DateRangePickerDayDay = styled(PickersDay, {
   '& > *': {
     transform: 'scale(0.9)'
   }
-}, !ownerState.selected && {
-  backgroundColor: 'transparent'
 }, !ownerState.selected && ownerState.isHighlighting && {
-  color: theme.palette.getContrastText(alpha(theme.palette.primary.light, 0.6)),
+  opacity: 0.7,
   [`&.${pickersDayClasses.dayOutsideMonth}`]: {
-    color: alpha(theme.palette.getContrastText(theme.palette.primary.light), 0.4)
+    opacity: 0.4
   }
 }, ownerState.draggable && {
   cursor: 'grab'

package/DesktopDateRangePicker/DesktopDateRangePicker.js

@@ -155,6 +155,18 @@ DesktopDateRangePicker.propTypes = {
    * Defaults to localized format based on the used `views`.
    */
   format: PropTypes.string,
+  /**
+   * Pass a ref to the `input` element.
+   * Ignored if the field has several inputs.
+   */
+  inputRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({
+    current: PropTypes.object
+  })]),
+  /**
+   * The label content.
+   * Ignored if the field has several inputs.
+   */
+  label: PropTypes.node,
   /**
    * If `true`, calls `renderLoading` instead of rendering the day calendar.
    * Can be used to preload information and show it in calendar.

package/MobileDateRangePicker/MobileDateRangePicker.js

@@ -158,6 +158,18 @@ MobileDateRangePicker.propTypes = {
    * Defaults to localized format based on the used `views`.
    */
   format: PropTypes.string,
+  /**
+   * Pass a ref to the `input` element.
+   * Ignored if the field has several inputs.
+   */
+  inputRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({
+    current: PropTypes.object
+  })]),
+  /**
+   * The label content.
+   * Ignored if the field has several inputs.
+   */
+  label: PropTypes.node,
   /**
    * If `true`, calls `renderLoading` instead of rendering the day calendar.
    * Can be used to preload information and show it in calendar.

package/MultiInputDateRangeField/MultiInputDateRangeField.js

@@ -287,6 +287,8 @@ process.env.NODE_ENV !== "production" ? MultiInputDateRangeField.propTypes = {
    * The system prop, which allows defining system overrides as well as additional CSS styles.
    */
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  unstableEndFieldRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+  unstableStartFieldRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
   /**
    * The selected value.
    * Used when the component is controlled.

package/MultiInputDateRangeField/MultiInputDateRangeField.types.d.ts

@@ -3,22 +3,20 @@ 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 { FieldRef } from '@mui/x-date-pickers/models';
 import { UncapitalizeObjectKeys } from '@mui/x-date-pickers/internals';
 import { UseDateRangeFieldProps } from '../internal/models/dateRange';
 import { RangePosition } from '../internal/models/range';
-export interface UseMultiInputDateRangeFieldParams<TDate, TChildProps extends {}> {
-    sharedProps: Omit<TChildProps, keyof UseMultiInputDateRangeFieldProps<TDate>> & UseMultiInputDateRangeFieldProps<TDate>;
-    startTextFieldProps: TChildProps;
-    endTextFieldProps: TChildProps;
-    startInputRef?: React.Ref<HTMLInputElement>;
-    endInputRef?: React.Ref<HTMLInputElement>;
-}
-export interface UseMultiInputDateRangeFieldProps<TDate> extends UseDateRangeFieldProps<TDate> {
+import { UseMultiInputRangeFieldParams } from '../internal/hooks/useMultiInputRangeField/useMultiInputRangeField.types';
+import { RangeFieldSection } from '../internal/models/fields';
+export type UseMultiInputDateRangeFieldParams<TDate, TTextFieldSlotProps extends {}> = UseMultiInputRangeFieldParams<UseMultiInputDateRangeFieldProps<TDate>, TTextFieldSlotProps>;
+export interface UseMultiInputDateRangeFieldProps<TDate> extends Omit<UseDateRangeFieldProps<TDate>, 'unstableFieldRef'> {
+    unstableStartFieldRef?: React.Ref<FieldRef<RangeFieldSection>>;
+    unstableEndFieldRef?: React.Ref<FieldRef<RangeFieldSection>>;
 }
 export type UseMultiInputDateRangeFieldComponentProps<TDate, TChildProps extends {}> = Omit<TChildProps, keyof UseMultiInputDateRangeFieldProps<TDate>> & UseMultiInputDateRangeFieldProps<TDate>;
-export interface MultiInputDateRangeFieldProps<TDate> extends UseMultiInputDateRangeFieldComponentProps<TDate, Omit<StackProps, 'position'> & {
+export interface MultiInputDateRangeFieldProps<TDate> extends UseMultiInputDateRangeFieldComponentProps<TDate, Omit<StackProps, 'position'>> {
     autoFocus?: boolean;
-}> {
     /**
      * Overridable components.
      * @default {}

package/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.js

@@ -1,6 +1,6 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["slots", "slotProps", "components", "componentsProps", "value", "defaultValue", "format", "onChange", "readOnly", "disabled", "onError", "shouldDisableDate", "minDate", "maxDate", "minTime", "maxTime", "minDateTime", "maxDateTime", "minutesStep", "shouldDisableClock", "shouldDisableTime", "disableFuture", "disablePast", "selectedSections", "onSelectedSectionsChange"],
+const _excluded = ["slots", "slotProps", "components", "componentsProps", "value", "defaultValue", "format", "onChange", "readOnly", "disabled", "onError", "shouldDisableDate", "minDate", "maxDate", "minTime", "maxTime", "minDateTime", "maxDateTime", "minutesStep", "shouldDisableClock", "shouldDisableTime", "disableFuture", "disablePast", "selectedSections", "onSelectedSectionsChange", "unstableStartFieldRef", "unstableEndFieldRef", "autoFocus"],
   _excluded2 = ["onKeyDown", "ref", "readOnly", "inputMode"],
   _excluded3 = ["onKeyDown", "ref", "readOnly", "inputMode"];
 import * as React from 'react';
@@ -65,7 +65,10 @@ const MultiInputDateTimeRangeField = /*#__PURE__*/React.forwardRef(function Mult
       disableFuture,
       disablePast,
       selectedSections,
-      onSelectedSectionsChange
+      onSelectedSectionsChange,
+      unstableStartFieldRef,
+      unstableEndFieldRef,
+      autoFocus
     } = themeProps,
     other = _objectWithoutPropertiesLoose(themeProps, _excluded);
   const slots = innerSlots != null ? innerSlots : uncapitalizeObjectKeys(components);
@@ -85,6 +88,9 @@ const MultiInputDateTimeRangeField = /*#__PURE__*/React.forwardRef(function Mult
   const startTextFieldProps = useSlotProps({
     elementType: TextField,
     externalSlotProps: slotProps == null ? void 0 : slotProps.textField,
+    additionalProps: {
+      autoFocus
+    },
     ownerState: _extends({}, ownerState, {
       position: 'start'
     })
@@ -129,7 +135,9 @@ const MultiInputDateTimeRangeField = /*#__PURE__*/React.forwardRef(function Mult
       startTextFieldProps,
       endTextFieldProps,
       startInputRef: startTextFieldProps.inputRef,
-      endInputRef: endTextFieldProps.inputRef
+      unstableStartFieldRef,
+      endInputRef: endTextFieldProps.inputRef,
+      unstableEndFieldRef
     }),
     {
       startDate: {
@@ -179,6 +187,7 @@ process.env.NODE_ENV !== "production" ? MultiInputDateTimeRangeField.propTypes =
    * @default `utils.is12HourCycleInCurrentLocale()`
    */
   ampm: PropTypes.bool,
+  autoFocus: PropTypes.bool,
   className: PropTypes.string,
   /**
    * Overridable components.
@@ -344,6 +353,8 @@ process.env.NODE_ENV !== "production" ? MultiInputDateTimeRangeField.propTypes =
    * The system prop, which allows defining system overrides as well as additional CSS styles.
    */
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  unstableEndFieldRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+  unstableStartFieldRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
   /**
    * The selected value.
    * Used when the component is controlled.

package/MultiInputDateTimeRangeField/MultiInputDateTimeRangeField.types.d.ts

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { FieldRef } 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';
@@ -6,17 +7,16 @@ import TextField from '@mui/material/TextField';
 import { UncapitalizeObjectKeys } from '@mui/x-date-pickers/internals';
 import { UseDateTimeRangeFieldDefaultizedProps, UseDateTimeRangeFieldProps } from '../internal/models/dateTimeRange';
 import { RangePosition } from '../internal/models/range';
-export interface UseMultiInputDateTimeRangeFieldParams<TDate, TChildProps extends {}> {
-    sharedProps: Omit<TChildProps, keyof UseMultiInputDateTimeRangeFieldProps<TDate>> & UseMultiInputDateTimeRangeFieldProps<TDate>;
-    startTextFieldProps: TChildProps;
-    endTextFieldProps: TChildProps;
-    startInputRef?: React.Ref<HTMLInputElement>;
-    endInputRef?: React.Ref<HTMLInputElement>;
-}
-export interface UseMultiInputDateTimeRangeFieldProps<TDate> extends UseDateTimeRangeFieldProps<TDate> {
+import { RangeFieldSection } from '../internal/models/fields';
+import { UseMultiInputRangeFieldParams } from '../internal/hooks/useMultiInputRangeField/useMultiInputRangeField.types';
+export type UseMultiInputDateTimeRangeFieldParams<TDate, TTextFieldSlotProps extends {}> = UseMultiInputRangeFieldParams<UseMultiInputDateTimeRangeFieldProps<TDate>, TTextFieldSlotProps>;
+export interface UseMultiInputDateTimeRangeFieldProps<TDate> extends Omit<UseDateTimeRangeFieldProps<TDate>, 'unstableFieldRef'> {
+    unstableStartFieldRef?: React.Ref<FieldRef<RangeFieldSection>>;
+    unstableEndFieldRef?: React.Ref<FieldRef<RangeFieldSection>>;
 }
 export type UseMultiInputDateTimeRangeFieldComponentProps<TDate, TChildProps extends {}> = Omit<TChildProps, keyof UseMultiInputDateTimeRangeFieldProps<TDate>> & UseMultiInputDateTimeRangeFieldProps<TDate>;
 export interface MultiInputDateTimeRangeFieldProps<TDate> extends UseMultiInputDateTimeRangeFieldComponentProps<TDate, Omit<StackProps, 'position'>> {
+    autoFocus?: boolean;
     /**
      * Overridable components.
      * @default {}

package/MultiInputTimeRangeField/MultiInputTimeRangeField.js

@@ -1,6 +1,6 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["slots", "slotProps", "components", "componentsProps", "value", "defaultValue", "format", "onChange", "readOnly", "disabled", "onError", "minTime", "maxTime", "minutesStep", "shouldDisableClock", "shouldDisableTime", "disableFuture", "disablePast", "selectedSections", "onSelectedSectionsChange"],
+const _excluded = ["slots", "slotProps", "components", "componentsProps", "value", "defaultValue", "format", "onChange", "readOnly", "disabled", "onError", "minTime", "maxTime", "minutesStep", "shouldDisableClock", "shouldDisableTime", "disableFuture", "disablePast", "selectedSections", "onSelectedSectionsChange", "unstableStartFieldRef", "unstableEndFieldRef", "autoFocus"],
   _excluded2 = ["onKeyDown", "ref", "readOnly", "inputMode"],
   _excluded3 = ["onKeyDown", "ref", "readOnly", "inputMode"];
 import * as React from 'react';
@@ -60,7 +60,10 @@ const MultiInputTimeRangeField = /*#__PURE__*/React.forwardRef(function MultiInp
       disableFuture,
       disablePast,
       selectedSections,
-      onSelectedSectionsChange
+      onSelectedSectionsChange,
+      unstableStartFieldRef,
+      unstableEndFieldRef,
+      autoFocus
     } = themeProps,
     other = _objectWithoutPropertiesLoose(themeProps, _excluded);
   const slots = innerSlots != null ? innerSlots : uncapitalizeObjectKeys(components);
@@ -80,6 +83,9 @@ const MultiInputTimeRangeField = /*#__PURE__*/React.forwardRef(function MultiInp
   const startTextFieldProps = useSlotProps({
     elementType: TextField,
     externalSlotProps: slotProps == null ? void 0 : slotProps.textField,
+    additionalProps: {
+      autoFocus
+    },
     ownerState: _extends({}, ownerState, {
       position: 'start'
     })
@@ -119,7 +125,9 @@ const MultiInputTimeRangeField = /*#__PURE__*/React.forwardRef(function MultiInp
       startTextFieldProps,
       endTextFieldProps,
       startInputRef: startTextFieldProps.inputRef,
-      endInputRef: endTextFieldProps.inputRef
+      unstableStartFieldRef,
+      endInputRef: endTextFieldProps.inputRef,
+      unstableEndFieldRef
     }),
     {
       startDate: {
@@ -169,6 +177,7 @@ process.env.NODE_ENV !== "production" ? MultiInputTimeRangeField.propTypes = {
    * @default `utils.is12HourCycleInCurrentLocale()`
    */
   ampm: PropTypes.bool,
+  autoFocus: PropTypes.bool,
   className: PropTypes.string,
   /**
    * Overridable components.
@@ -310,6 +319,8 @@ process.env.NODE_ENV !== "production" ? MultiInputTimeRangeField.propTypes = {
    * The system prop, which allows defining system overrides as well as additional CSS styles.
    */
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  unstableEndFieldRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+  unstableStartFieldRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
   /**
    * The selected value.
    * Used when the component is controlled.

package/MultiInputTimeRangeField/MultiInputTimeRangeField.types.d.ts

@@ -3,20 +3,20 @@ 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 { FieldRef } from '@mui/x-date-pickers/models';
 import { UncapitalizeObjectKeys } from '@mui/x-date-pickers/internals';
 import { UseTimeRangeFieldDefaultizedProps, UseTimeRangeFieldProps } from '../internal/models/timeRange';
 import { RangePosition } from '../internal/models/range';
-export interface UseMultiInputTimeRangeFieldParams<TDate, TChildProps extends {}> {
-    sharedProps: Omit<TChildProps, keyof UseMultiInputTimeRangeFieldProps<TDate>> & UseMultiInputTimeRangeFieldProps<TDate>;
-    startTextFieldProps: TChildProps;
-    endTextFieldProps: TChildProps;
-    startInputRef?: React.Ref<HTMLInputElement>;
-    endInputRef?: React.Ref<HTMLInputElement>;
-}
-export interface UseMultiInputTimeRangeFieldProps<TDate> extends UseTimeRangeFieldProps<TDate> {
+import { UseMultiInputRangeFieldParams } from '../internal/hooks/useMultiInputRangeField/useMultiInputRangeField.types';
+import { RangeFieldSection } from '../internal/models/fields';
+export type UseMultiInputTimeRangeFieldParams<TDate, TTextFieldSlotProps extends {}> = UseMultiInputRangeFieldParams<UseMultiInputTimeRangeFieldProps<TDate>, TTextFieldSlotProps>;
+export interface UseMultiInputTimeRangeFieldProps<TDate> extends Omit<UseTimeRangeFieldProps<TDate>, 'unstableFieldRef'> {
+    unstableStartFieldRef?: React.Ref<FieldRef<RangeFieldSection>>;
+    unstableEndFieldRef?: React.Ref<FieldRef<RangeFieldSection>>;
 }
 export type UseMultiInputTimeRangeFieldComponentProps<TDate, TChildProps extends {}> = Omit<TChildProps, keyof UseMultiInputTimeRangeFieldProps<TDate>> & UseMultiInputTimeRangeFieldProps<TDate>;
 export interface MultiInputTimeRangeFieldProps<TDate> extends UseMultiInputTimeRangeFieldComponentProps<TDate, Omit<StackProps, 'position'>> {
+    autoFocus?: boolean;
     /**
      * Overridable components.
      * @default {}

package/SingleInputDateRangeField/SingleInputDateRangeField.d.ts

@@ -2,6 +2,7 @@ import * as React from 'react';
 import { SingleInputDateRangeFieldProps } from './SingleInputDateRangeField.types';
 type DateRangeFieldComponent = (<TDate>(props: SingleInputDateRangeFieldProps<TDate> & React.RefAttributes<HTMLInputElement>) => JSX.Element) & {
     propTypes?: any;
+    fieldType?: string;
 };
 declare const SingleInputDateRangeField: DateRangeFieldComponent;
 export { SingleInputDateRangeField };

package/SingleInputDateRangeField/SingleInputDateRangeField.js

@@ -52,6 +52,7 @@ const SingleInputDateRangeField = /*#__PURE__*/React.forwardRef(function SingleI
     })
   }));
 });
+SingleInputDateRangeField.fieldType = 'single-input';
 process.env.NODE_ENV !== "production" ? SingleInputDateRangeField.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
@@ -251,6 +252,10 @@ process.env.NODE_ENV !== "production" ? SingleInputDateRangeField.propTypes = {
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * The ref object used to imperatively interact with the field.
+   */
+  unstableFieldRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
   /**
    * The selected value.
    * Used when the component is controlled.

package/SingleInputDateRangeField/useSingleInputDateRangeField.js

@@ -1,6 +1,6 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["value", "defaultValue", "format", "onChange", "readOnly", "onError", "shouldDisableDate", "minDate", "maxDate", "disableFuture", "disablePast", "selectedSections", "onSelectedSectionsChange"];
+const _excluded = ["value", "defaultValue", "format", "onChange", "readOnly", "onError", "shouldDisableDate", "minDate", "maxDate", "disableFuture", "disablePast", "selectedSections", "onSelectedSectionsChange", "unstableFieldRef"];
 import { useUtils, useDefaultDates, applyDefaultDate, useField } from '@mui/x-date-pickers/internals';
 import { rangeValueManager, rangeFieldValueManager } from '../internal/utils/valueManagers';
 import { validateDateRange } from '../internal/hooks/validation/useDateRangeValidation';
@@ -34,7 +34,8 @@ export const useSingleInputDateRangeField = ({
       disableFuture,
       disablePast,
       selectedSections,
-      onSelectedSectionsChange
+      onSelectedSectionsChange,
+      unstableFieldRef
     } = _useDefaultizedDateRa,
     other = _objectWithoutPropertiesLoose(_useDefaultizedDateRa, _excluded);
   return useField({
@@ -53,7 +54,8 @@ export const useSingleInputDateRangeField = ({
       disableFuture,
       disablePast,
       selectedSections,
-      onSelectedSectionsChange
+      onSelectedSectionsChange,
+      unstableFieldRef
     },
     valueManager: rangeValueManager,
     fieldValueManager: rangeFieldValueManager,

package/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.d.ts

@@ -2,6 +2,7 @@ import * as React from 'react';
 import { SingleInputDateTimeRangeFieldProps } from './SingleInputDateTimeRangeField.types';
 type DateRangeFieldComponent = (<TDate>(props: SingleInputDateTimeRangeFieldProps<TDate> & React.RefAttributes<HTMLInputElement>) => JSX.Element) & {
     propTypes?: any;
+    fieldType?: string;
 };
 declare const SingleInputDateTimeRangeField: DateRangeFieldComponent;
 export { SingleInputDateTimeRangeField };

package/SingleInputDateTimeRangeField/SingleInputDateTimeRangeField.js

@@ -52,6 +52,7 @@ const SingleInputDateTimeRangeField = /*#__PURE__*/React.forwardRef(function Sin
     })
   }));
 });
+SingleInputDateTimeRangeField.fieldType = 'single-input';
 process.env.NODE_ENV !== "production" ? SingleInputDateTimeRangeField.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
@@ -299,6 +300,10 @@ process.env.NODE_ENV !== "production" ? SingleInputDateTimeRangeField.propTypes
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * The ref object used to imperatively interact with the field.
+   */
+  unstableFieldRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
   /**
    * The selected value.
    * Used when the component is controlled.

package/SingleInputDateTimeRangeField/useSingleInputDateTimeRangeField.js

@@ -1,6 +1,6 @@
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 import _extends from "@babel/runtime/helpers/esm/extends";
-const _excluded = ["value", "defaultValue", "format", "onChange", "readOnly", "onError", "shouldDisableDate", "minDate", "maxDate", "disableFuture", "disablePast", "minTime", "maxTime", "minDateTime", "maxDateTime", "minutesStep", "shouldDisableTime", "disableIgnoringDatePartForTimeValidation", "selectedSections", "onSelectedSectionsChange"];
+const _excluded = ["value", "defaultValue", "format", "onChange", "readOnly", "onError", "shouldDisableDate", "minDate", "maxDate", "disableFuture", "disablePast", "minTime", "maxTime", "minDateTime", "maxDateTime", "minutesStep", "shouldDisableTime", "disableIgnoringDatePartForTimeValidation", "selectedSections", "onSelectedSectionsChange", "unstableFieldRef"];
 import { useUtils, useField, applyDefaultDate, useDefaultDates } from '@mui/x-date-pickers/internals';
 import { rangeValueManager, rangeFieldValueManager } from '../internal/utils/valueManagers';
 import { validateDateTimeRange } from '../internal/hooks/validation/useDateTimeRangeValidation';
@@ -44,7 +44,8 @@ export const useSingleInputDateTimeRangeField = ({
       shouldDisableTime,
       disableIgnoringDatePartForTimeValidation,
       selectedSections,
-      onSelectedSectionsChange
+      onSelectedSectionsChange,
+      unstableFieldRef
     } = _useDefaultizedTimeRa,
     other = _objectWithoutPropertiesLoose(_useDefaultizedTimeRa, _excluded);
   return useField({
@@ -68,7 +69,8 @@ export const useSingleInputDateTimeRangeField = ({
       shouldDisableTime,
       disableIgnoringDatePartForTimeValidation,
       selectedSections,
-      onSelectedSectionsChange
+      onSelectedSectionsChange,
+      unstableFieldRef
     },
     valueManager: rangeValueManager,
     fieldValueManager: rangeFieldValueManager,

package/SingleInputTimeRangeField/SingleInputTimeRangeField.d.ts

@@ -2,6 +2,7 @@ import * as React from 'react';
 import { SingleInputTimeRangeFieldProps } from './SingleInputTimeRangeField.types';
 type DateRangeFieldComponent = (<TDate>(props: SingleInputTimeRangeFieldProps<TDate> & React.RefAttributes<HTMLInputElement>) => JSX.Element) & {
     propTypes?: any;
+    fieldType?: string;
 };
 declare const SingleInputTimeRangeField: DateRangeFieldComponent;
 export { SingleInputTimeRangeField };

package/SingleInputTimeRangeField/SingleInputTimeRangeField.js

@@ -52,6 +52,7 @@ const SingleInputTimeRangeField = /*#__PURE__*/React.forwardRef(function SingleI
     })
   }));
 });
+SingleInputTimeRangeField.fieldType = 'single-input';
 process.env.NODE_ENV !== "production" ? SingleInputTimeRangeField.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
@@ -275,6 +276,10 @@ process.env.NODE_ENV !== "production" ? SingleInputTimeRangeField.propTypes = {
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
+  /**
+   * The ref object used to imperatively interact with the field.
+   */
+  unstableFieldRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
   /**
    * The selected value.
    * Used when the component is controlled.