@mui/x-date-pickers 9.6.0 → 9.7.0

package/TimeClock/Clock.d.mts

@@ -1,10 +1,10 @@
 import * as React from 'react';
 import type { PickerSelectionState } from "../internals/hooks/usePicker/index.mjs";
-import { useMeridiemMode } from "../internals/hooks/date-helpers-hooks.mjs";
-import { PickerOwnerState, PickerValidDate, TimeView } from "../models/index.mjs";
-import { ClockClasses } from "./clockClasses.mjs";
-import { Meridiem } from "../internals/utils/time-utils.mjs";
-import { FormProps } from "../internals/models/formProps.mjs";
+import type { useMeridiemMode } from "../internals/hooks/date-helpers-hooks.mjs";
+import type { PickerOwnerState, PickerValidDate, TimeView } from "../models/index.mjs";
+import type { ClockClasses } from "./clockClasses.mjs";
+import type { Meridiem } from "../internals/utils/time-utils.mjs";
+import type { FormProps } from "../internals/models/formProps.mjs";
 export interface ClockProps extends ReturnType<typeof useMeridiemMode>, FormProps {
   ampm: boolean;
   ampmInClock: boolean;

package/TimeClock/Clock.d.ts

@@ -1,10 +1,10 @@
 import * as React from 'react';
 import type { PickerSelectionState } from "../internals/hooks/usePicker/index.js";
-import { useMeridiemMode } from "../internals/hooks/date-helpers-hooks.js";
-import { PickerOwnerState, PickerValidDate, TimeView } from "../models/index.js";
-import { ClockClasses } from "./clockClasses.js";
-import { Meridiem } from "../internals/utils/time-utils.js";
-import { FormProps } from "../internals/models/formProps.js";
+import type { useMeridiemMode } from "../internals/hooks/date-helpers-hooks.js";
+import type { PickerOwnerState, PickerValidDate, TimeView } from "../models/index.js";
+import type { ClockClasses } from "./clockClasses.js";
+import type { Meridiem } from "../internals/utils/time-utils.js";
+import type { FormProps } from "../internals/models/formProps.js";
 export interface ClockProps extends ReturnType<typeof useMeridiemMode>, FormProps {
   ampm: boolean;
   ampmInClock: boolean;

package/TimeClock/Clock.js

@@ -14,6 +14,8 @@ var _IconButton = _interopRequireDefault(require("@mui/material/IconButton"));
 var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
 var _styles = require("@mui/material/styles");
 var _useEnhancedEffect = _interopRequireDefault(require("@mui/utils/useEnhancedEffect"));
+var _useEventCallback = _interopRequireDefault(require("@mui/utils/useEventCallback"));
+var _ownerDocument = _interopRequireDefault(require("@mui/utils/ownerDocument"));
 var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
 var _ClockPointer = require("./ClockPointer");
 var _hooks = require("../hooks");
@@ -194,6 +196,9 @@ function Clock(inProps) {
     clockMeridiemMode: meridiemMode
   });
   const isMoving = React.useRef(false);
+  const activePointerIdRef = React.useRef(null);
+  const squareMaskRef = React.useRef(null);
+  const removeDragListenersRef = React.useRef(undefined);
   const classes = useUtilityClasses(classesProp, ownerState);
   const isSelectedTimeDisabled = isTimeDisabled(viewValue, type);
   const isPointerInner = !ampm && type === 'hours' && (viewValue < 1 || viewValue > 12);
@@ -207,40 +212,81 @@ function Clock(inProps) {
     onChange(newValue, isFinish);
   };
   const setTime = (event, isFinish) => {
-    let {
-      offsetX,
-      offsetY
-    } = event;
-    if (offsetX === undefined) {
-      const rect = event.target.getBoundingClientRect();
-      offsetX = event.changedTouches[0].clientX - rect.left;
-      offsetY = event.changedTouches[0].clientY - rect.top;
+    const mask = squareMaskRef.current;
+    // The document-level listeners can briefly outlive the mask during unmount:
+    // React detaches refs before the cleanup effect removes the listeners, so a
+    // pointer event firing in that window would otherwise dereference a null ref.
+    if (!mask) {
+      return;
     }
+
+    // Resolve the pointer coordinates relative to the clock mask rather than from
+    // `offsetX`/`offsetY`: the `pointermove`/`pointerup` listeners live on the
+    // document (see `handlePointerDown`), so the event target can be any element
+    // once the pointer leaves the clock.
+    const rect = mask.getBoundingClientRect();
+    const offsetX = event.clientX - rect.left;
+    const offsetY = event.clientY - rect.top;
     const newSelectedValue = type === 'seconds' || type === 'minutes' ? (0, _shared.getMinutes)(offsetX, offsetY, minutesStep) : (0, _shared.getHours)(offsetX, offsetY, Boolean(ampm));
     handleValueChange(newSelectedValue, isFinish);
   };
-  const handleTouchSelection = event => {
-    isMoving.current = true;
-    setTime(event, 'shallow');
+
+  // Pointer events are the single source of truth for mouse, touch and pen. The
+  // move/up/cancel listeners are attached to the document so a drag keeps
+  // tracking and commits even when the pointer is released outside the clock.
+  const stopTracking = () => {
+    isMoving.current = false;
+    activePointerIdRef.current = null;
+    // Idempotent: the cleanup clears its own ref, so calling `stopTracking` twice
+    // (e.g. a `pointercancel` racing a `pointerup`) is a safe no-op.
+    removeDragListenersRef.current?.();
   };
-  const handleTouchEnd = event => {
-    if (isMoving.current) {
-      setTime(event, 'finish');
-      isMoving.current = false;
+  const handleDocumentPointerMove = (0, _useEventCallback.default)(event => {
+    if (event.pointerId !== activePointerIdRef.current) {
+      return;
     }
     event.preventDefault();
-  };
-  const handleMouseMove = event => {
-    // event.buttons & PRIMARY_MOUSE_BUTTON
-    if (event.buttons > 0) {
-      setTime(event.nativeEvent, 'shallow');
+    setTime(event, 'shallow');
+  });
+  const handleDocumentPointerUp = (0, _useEventCallback.default)(event => {
+    if (event.pointerId !== activePointerIdRef.current) {
+      return;
     }
-  };
-  const handleMouseUp = event => {
-    if (isMoving.current) {
-      isMoving.current = false;
+    stopTracking();
+    setTime(event, 'finish');
+  });
+  const handleDocumentPointerCancel = (0, _useEventCallback.default)(event => {
+    if (event.pointerId !== activePointerIdRef.current) {
+      return;
+    }
+    // The gesture was interrupted by the user agent: drop it without committing.
+    stopTracking();
+  });
+  const handlePointerDown = event => {
+    // Ignore secondary buttons (middle = 1, right = 2), secondary multi-touch
+    // pointers and interactions that can't change the value. `> 0` rather than
+    // `!== 0` keeps the gesture permissive when `event.button` is left unset by a
+    // synthetic event (some test environments), matching `useDragRange`.
+    if (event.button > 0 || event.isPrimary === false || disabled || readOnly) {
+      return;
     }
-    setTime(event.nativeEvent, 'finish');
+
+    // A fresh primary pointerdown ends any previous gesture whose pointerup was
+    // lost, fully resetting its state before starting the new one.
+    stopTracking();
+    isMoving.current = true;
+    activePointerIdRef.current = event.pointerId;
+    const doc = (0, _ownerDocument.default)(squareMaskRef.current);
+    doc.addEventListener('pointermove', handleDocumentPointerMove);
+    doc.addEventListener('pointerup', handleDocumentPointerUp);
+    doc.addEventListener('pointercancel', handleDocumentPointerCancel);
+    removeDragListenersRef.current = () => {
+      doc.removeEventListener('pointermove', handleDocumentPointerMove);
+      doc.removeEventListener('pointerup', handleDocumentPointerUp);
+      doc.removeEventListener('pointercancel', handleDocumentPointerCancel);
+      removeDragListenersRef.current = undefined;
+    };
+    setTime(event.nativeEvent, 'shallow');
   };
   const isPointerBetweenTwoClockValues = type === 'hours' ? false : viewValue % 5 !== 0;
   const keyboardControlStep = type === 'minutes' ? minutesStep : 1;
@@ -253,6 +299,9 @@ function Clock(inProps) {
       listboxRef.current.focus();
     }
   }, [autoFocus]);
+
+  // Clean up the document-level pointer listeners if the clock unmounts mid-drag.
+  React.useEffect(() => () => removeDragListenersRef.current?.(), []);
   const clampValue = newValue => Math.max(minViewValue, Math.min(maxViewValue, newValue));
   const circleValue = newValue => (newValue + (maxViewValue + 1)) % (maxViewValue + 1);
   const handleKeyDown = event => {
@@ -300,11 +349,8 @@ function Clock(inProps) {
     children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(ClockClock, {
       className: classes.clock,
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(ClockSquareMask, {
-        onTouchMove: handleTouchSelection,
-        onTouchStart: handleTouchSelection,
-        onTouchEnd: handleTouchEnd,
-        onMouseUp: handleMouseUp,
-        onMouseMove: handleMouseMove,
+        ref: squareMaskRef,
+        onPointerDown: handlePointerDown,
         ownerState: ownerState,
         className: classes.squareMask
       }), !isSelectedTimeDisabled && /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {

package/TimeClock/Clock.mjs

@@ -7,6 +7,8 @@ import IconButton from '@mui/material/IconButton';
 import Typography from '@mui/material/Typography';
 import { styled, useThemeProps } from '@mui/material/styles';
 import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
+import useEventCallback from '@mui/utils/useEventCallback';
+import ownerDocument from '@mui/utils/ownerDocument';
 import composeClasses from '@mui/utils/composeClasses';
 import { ClockPointer } from "./ClockPointer.mjs";
 import { usePickerAdapter, usePickerTranslations } from "../hooks/index.mjs";
@@ -187,6 +189,9 @@ export function Clock(inProps) {
     clockMeridiemMode: meridiemMode
   });
   const isMoving = React.useRef(false);
+  const activePointerIdRef = React.useRef(null);
+  const squareMaskRef = React.useRef(null);
+  const removeDragListenersRef = React.useRef(undefined);
   const classes = useUtilityClasses(classesProp, ownerState);
   const isSelectedTimeDisabled = isTimeDisabled(viewValue, type);
   const isPointerInner = !ampm && type === 'hours' && (viewValue < 1 || viewValue > 12);
@@ -200,40 +205,81 @@ export function Clock(inProps) {
     onChange(newValue, isFinish);
   };
   const setTime = (event, isFinish) => {
-    let {
-      offsetX,
-      offsetY
-    } = event;
-    if (offsetX === undefined) {
-      const rect = event.target.getBoundingClientRect();
-      offsetX = event.changedTouches[0].clientX - rect.left;
-      offsetY = event.changedTouches[0].clientY - rect.top;
+    const mask = squareMaskRef.current;
+    // The document-level listeners can briefly outlive the mask during unmount:
+    // React detaches refs before the cleanup effect removes the listeners, so a
+    // pointer event firing in that window would otherwise dereference a null ref.
+    if (!mask) {
+      return;
     }
+
+    // Resolve the pointer coordinates relative to the clock mask rather than from
+    // `offsetX`/`offsetY`: the `pointermove`/`pointerup` listeners live on the
+    // document (see `handlePointerDown`), so the event target can be any element
+    // once the pointer leaves the clock.
+    const rect = mask.getBoundingClientRect();
+    const offsetX = event.clientX - rect.left;
+    const offsetY = event.clientY - rect.top;
     const newSelectedValue = type === 'seconds' || type === 'minutes' ? getMinutes(offsetX, offsetY, minutesStep) : getHours(offsetX, offsetY, Boolean(ampm));
     handleValueChange(newSelectedValue, isFinish);
   };
-  const handleTouchSelection = event => {
-    isMoving.current = true;
-    setTime(event, 'shallow');
+
+  // Pointer events are the single source of truth for mouse, touch and pen. The
+  // move/up/cancel listeners are attached to the document so a drag keeps
+  // tracking and commits even when the pointer is released outside the clock.
+  const stopTracking = () => {
+    isMoving.current = false;
+    activePointerIdRef.current = null;
+    // Idempotent: the cleanup clears its own ref, so calling `stopTracking` twice
+    // (e.g. a `pointercancel` racing a `pointerup`) is a safe no-op.
+    removeDragListenersRef.current?.();
   };
-  const handleTouchEnd = event => {
-    if (isMoving.current) {
-      setTime(event, 'finish');
-      isMoving.current = false;
+  const handleDocumentPointerMove = useEventCallback(event => {
+    if (event.pointerId !== activePointerIdRef.current) {
+      return;
     }
     event.preventDefault();
-  };
-  const handleMouseMove = event => {
-    // event.buttons & PRIMARY_MOUSE_BUTTON
-    if (event.buttons > 0) {
-      setTime(event.nativeEvent, 'shallow');
+    setTime(event, 'shallow');
+  });
+  const handleDocumentPointerUp = useEventCallback(event => {
+    if (event.pointerId !== activePointerIdRef.current) {
+      return;
     }
-  };
-  const handleMouseUp = event => {
-    if (isMoving.current) {
-      isMoving.current = false;
+    stopTracking();
+    setTime(event, 'finish');
+  });
+  const handleDocumentPointerCancel = useEventCallback(event => {
+    if (event.pointerId !== activePointerIdRef.current) {
+      return;
+    }
+    // The gesture was interrupted by the user agent: drop it without committing.
+    stopTracking();
+  });
+  const handlePointerDown = event => {
+    // Ignore secondary buttons (middle = 1, right = 2), secondary multi-touch
+    // pointers and interactions that can't change the value. `> 0` rather than
+    // `!== 0` keeps the gesture permissive when `event.button` is left unset by a
+    // synthetic event (some test environments), matching `useDragRange`.
+    if (event.button > 0 || event.isPrimary === false || disabled || readOnly) {
+      return;
     }
-    setTime(event.nativeEvent, 'finish');
+
+    // A fresh primary pointerdown ends any previous gesture whose pointerup was
+    // lost, fully resetting its state before starting the new one.
+    stopTracking();
+    isMoving.current = true;
+    activePointerIdRef.current = event.pointerId;
+    const doc = ownerDocument(squareMaskRef.current);
+    doc.addEventListener('pointermove', handleDocumentPointerMove);
+    doc.addEventListener('pointerup', handleDocumentPointerUp);
+    doc.addEventListener('pointercancel', handleDocumentPointerCancel);
+    removeDragListenersRef.current = () => {
+      doc.removeEventListener('pointermove', handleDocumentPointerMove);
+      doc.removeEventListener('pointerup', handleDocumentPointerUp);
+      doc.removeEventListener('pointercancel', handleDocumentPointerCancel);
+      removeDragListenersRef.current = undefined;
+    };
+    setTime(event.nativeEvent, 'shallow');
   };
   const isPointerBetweenTwoClockValues = type === 'hours' ? false : viewValue % 5 !== 0;
   const keyboardControlStep = type === 'minutes' ? minutesStep : 1;
@@ -246,6 +292,9 @@ export function Clock(inProps) {
       listboxRef.current.focus();
     }
   }, [autoFocus]);
+
+  // Clean up the document-level pointer listeners if the clock unmounts mid-drag.
+  React.useEffect(() => () => removeDragListenersRef.current?.(), []);
   const clampValue = newValue => Math.max(minViewValue, Math.min(maxViewValue, newValue));
   const circleValue = newValue => (newValue + (maxViewValue + 1)) % (maxViewValue + 1);
   const handleKeyDown = event => {
@@ -293,11 +342,8 @@ export function Clock(inProps) {
     children: [/*#__PURE__*/_jsxs(ClockClock, {
       className: classes.clock,
       children: [/*#__PURE__*/_jsx(ClockSquareMask, {
-        onTouchMove: handleTouchSelection,
-        onTouchStart: handleTouchSelection,
-        onTouchEnd: handleTouchEnd,
-        onMouseUp: handleMouseUp,
-        onMouseMove: handleMouseMove,
+        ref: squareMaskRef,
+        onPointerDown: handlePointerDown,
         ownerState: ownerState,
         className: classes.squareMask
       }), !isSelectedTimeDisabled && /*#__PURE__*/_jsxs(React.Fragment, {

package/TimeClock/ClockNumber.d.mts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { ClockNumberClasses } from "./clockNumberClasses.mjs";
-import { PickerOwnerState } from "../models/pickers.mjs";
+import type { ClockNumberClasses } from "./clockNumberClasses.mjs";
+import type { PickerOwnerState } from "../models/pickers.mjs";
 export interface ClockNumberProps extends React.HTMLAttributes<HTMLSpanElement> {
   'aria-label': string;
   disabled: boolean;

package/TimeClock/ClockNumber.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { ClockNumberClasses } from "./clockNumberClasses.js";
-import { PickerOwnerState } from "../models/pickers.js";
+import type { ClockNumberClasses } from "./clockNumberClasses.js";
+import type { PickerOwnerState } from "../models/pickers.js";
 export interface ClockNumberProps extends React.HTMLAttributes<HTMLSpanElement> {
   'aria-label': string;
   disabled: boolean;

package/TimeClock/ClockNumbers.d.mts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { MuiPickersAdapter, PickerValidDate } from "../models/index.mjs";
+import type { MuiPickersAdapter, PickerValidDate } from "../models/index.mjs";
 import type { PickerSelectionState } from "../internals/hooks/usePicker/index.mjs";
 interface GetHourNumbersOptions {
   ampm: boolean;

package/TimeClock/ClockNumbers.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { MuiPickersAdapter, PickerValidDate } from "../models/index.js";
+import type { MuiPickersAdapter, PickerValidDate } from "../models/index.js";
 import type { PickerSelectionState } from "../internals/hooks/usePicker/index.js";
 interface GetHourNumbersOptions {
   ampm: boolean;

package/TimeClock/ClockPointer.d.mts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { PickerOwnerState, TimeView } from "../models/index.mjs";
-import { ClockPointerClasses } from "./clockPointerClasses.mjs";
+import type { PickerOwnerState, TimeView } from "../models/index.mjs";
+import type { ClockPointerClasses } from "./clockPointerClasses.mjs";
 export interface ClockPointerProps extends React.HTMLAttributes<HTMLDivElement> {
   /**
    * `true` if the pointer is between two clock values.

package/TimeClock/ClockPointer.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { PickerOwnerState, TimeView } from "../models/index.js";
-import { ClockPointerClasses } from "./clockPointerClasses.js";
+import type { PickerOwnerState, TimeView } from "../models/index.js";
+import type { ClockPointerClasses } from "./clockPointerClasses.js";
 export interface ClockPointerProps extends React.HTMLAttributes<HTMLDivElement> {
   /**
    * `true` if the pointer is between two clock values.

package/TimeClock/TimeClock.d.mts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { TimeClockProps } from "./TimeClock.types.mjs";
+import type { TimeClockProps } from "./TimeClock.types.mjs";
 type TimeClockComponent = ((props: TimeClockProps & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
   propTypes?: any;
 };

package/TimeClock/TimeClock.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { TimeClockProps } from "./TimeClock.types.js";
+import type { TimeClockProps } from "./TimeClock.types.js";
 type TimeClockComponent = ((props: TimeClockProps & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
   propTypes?: any;
 };

package/TimeClock/TimeClock.types.d.mts

@@ -1,8 +1,8 @@
-import { TimeClockClasses } from "./timeClockClasses.mjs";
-import { PickersArrowSwitcherSlots, PickersArrowSwitcherSlotProps } from "../internals/components/PickersArrowSwitcher/index.mjs";
-import { BaseClockProps, ExportedBaseClockProps } from "../internals/models/props/time.mjs";
-import { TimeView } from "../models/index.mjs";
-import { TimeViewWithMeridiem } from "../internals/models/index.mjs";
+import type { TimeClockClasses } from "./timeClockClasses.mjs";
+import type { PickersArrowSwitcherSlots, PickersArrowSwitcherSlotProps } from "../internals/components/PickersArrowSwitcher/index.mjs";
+import type { BaseClockProps, ExportedBaseClockProps } from "../internals/models/props/time.mjs";
+import type { TimeView } from "../models/index.mjs";
+import type { TimeViewWithMeridiem } from "../internals/models/index.mjs";
 export interface ExportedTimeClockProps extends ExportedBaseClockProps {
   /**
    * Display ampm controls under the clock (instead of in the toolbar).

package/TimeClock/TimeClock.types.d.ts

@@ -1,8 +1,8 @@
-import { TimeClockClasses } from "./timeClockClasses.js";
-import { PickersArrowSwitcherSlots, PickersArrowSwitcherSlotProps } from "../internals/components/PickersArrowSwitcher/index.js";
-import { BaseClockProps, ExportedBaseClockProps } from "../internals/models/props/time.js";
-import { TimeView } from "../models/index.js";
-import { TimeViewWithMeridiem } from "../internals/models/index.js";
+import type { TimeClockClasses } from "./timeClockClasses.js";
+import type { PickersArrowSwitcherSlots, PickersArrowSwitcherSlotProps } from "../internals/components/PickersArrowSwitcher/index.js";
+import type { BaseClockProps, ExportedBaseClockProps } from "../internals/models/props/time.js";
+import type { TimeView } from "../models/index.js";
+import type { TimeViewWithMeridiem } from "../internals/models/index.js";
 export interface ExportedTimeClockProps extends ExportedBaseClockProps {
   /**
    * Display ampm controls under the clock (instead of in the toolbar).

package/TimeField/TimeField.d.mts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { TimeFieldProps } from "./TimeField.types.mjs";
+import type { TimeFieldProps } from "./TimeField.types.mjs";
 type TimeFieldComponent = ((props: TimeFieldProps & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
   propTypes?: any;
 };

package/TimeField/TimeField.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { TimeFieldProps } from "./TimeField.types.js";
+import type { TimeFieldProps } from "./TimeField.types.js";
 type TimeFieldComponent = ((props: TimeFieldProps & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
   propTypes?: any;
 };

package/TimeField/TimeField.js

@@ -226,6 +226,7 @@ process.env.NODE_ENV !== "production" ? TimeField.propTypes /* remove-proptypes
   onFocus: _propTypes.default.func,
   onInput: _propTypes.default.func,
   onKeyDown: _propTypes.default.func,
+  onMouseDown: _propTypes.default.func,
   onPaste: _propTypes.default.func,
   /**
    * Callback fired when the selected sections change.

package/TimeField/TimeField.mjs

@@ -219,6 +219,7 @@ process.env.NODE_ENV !== "production" ? TimeField.propTypes /* remove-proptypes
   onFocus: PropTypes.func,
   onInput: PropTypes.func,
   onKeyDown: PropTypes.func,
+  onMouseDown: PropTypes.func,
   onPaste: PropTypes.func,
   /**
    * Callback fired when the selected sections change.

package/TimeField/TimeField.types.d.mts

@@ -1,10 +1,10 @@
-import { MakeOptional } from '@mui/x-internals/types';
-import { UseFieldInternalProps } from "../internals/hooks/useField/index.mjs";
-import { TimeValidationError, BuiltInFieldTextFieldProps } from "../models/index.mjs";
-import { ExportedValidateTimeProps } from "../validation/validateTime.mjs";
-import { AmPmProps } from "../internals/models/props/time.mjs";
-import { PickerValue } from "../internals/models/index.mjs";
-import { ExportedPickerFieldUIProps, PickerFieldUISlotProps, PickerFieldUISlots } from "../internals/components/PickerFieldUI.mjs";
+import type { MakeOptional } from '@mui/x-internals/types';
+import type { UseFieldInternalProps } from "../internals/hooks/useField/index.mjs";
+import type { TimeValidationError, BuiltInFieldTextFieldProps } from "../models/index.mjs";
+import type { ExportedValidateTimeProps } from "../validation/validateTime.mjs";
+import type { AmPmProps } from "../internals/models/props/time.mjs";
+import type { PickerValue } from "../internals/models/index.mjs";
+import type { ExportedPickerFieldUIProps, PickerFieldUISlotProps, PickerFieldUISlots } from "../internals/components/PickerFieldUI.mjs";
 export interface UseTimeFieldProps extends MakeOptional<UseFieldInternalProps<PickerValue, TimeValidationError>, 'format'>, ExportedValidateTimeProps, ExportedPickerFieldUIProps, AmPmProps {}
 export type TimeFieldProps = UseTimeFieldProps & Omit<BuiltInFieldTextFieldProps, keyof UseTimeFieldProps> & {
   /**

package/TimeField/TimeField.types.d.ts

@@ -1,10 +1,10 @@
-import { MakeOptional } from '@mui/x-internals/types';
-import { UseFieldInternalProps } from "../internals/hooks/useField/index.js";
-import { TimeValidationError, BuiltInFieldTextFieldProps } from "../models/index.js";
-import { ExportedValidateTimeProps } from "../validation/validateTime.js";
-import { AmPmProps } from "../internals/models/props/time.js";
-import { PickerValue } from "../internals/models/index.js";
-import { ExportedPickerFieldUIProps, PickerFieldUISlotProps, PickerFieldUISlots } from "../internals/components/PickerFieldUI.js";
+import type { MakeOptional } from '@mui/x-internals/types';
+import type { UseFieldInternalProps } from "../internals/hooks/useField/index.js";
+import type { TimeValidationError, BuiltInFieldTextFieldProps } from "../models/index.js";
+import type { ExportedValidateTimeProps } from "../validation/validateTime.js";
+import type { AmPmProps } from "../internals/models/props/time.js";
+import type { PickerValue } from "../internals/models/index.js";
+import type { ExportedPickerFieldUIProps, PickerFieldUISlotProps, PickerFieldUISlots } from "../internals/components/PickerFieldUI.js";
 export interface UseTimeFieldProps extends MakeOptional<UseFieldInternalProps<PickerValue, TimeValidationError>, 'format'>, ExportedValidateTimeProps, ExportedPickerFieldUIProps, AmPmProps {}
 export type TimeFieldProps = UseTimeFieldProps & Omit<BuiltInFieldTextFieldProps, keyof UseTimeFieldProps> & {
   /**

package/TimeField/useTimeField.d.mts

@@ -1,2 +1,2 @@
-import { UseTimeFieldProps } from "./TimeField.types.mjs";
+import type { UseTimeFieldProps } from "./TimeField.types.mjs";
 export declare const useTimeField: <TProps extends UseTimeFieldProps>(props: TProps) => import("../internals/index.mjs").UseFieldReturnValue<TProps>;

package/TimeField/useTimeField.d.ts

@@ -1,2 +1,2 @@
-import { UseTimeFieldProps } from "./TimeField.types.js";
+import type { UseTimeFieldProps } from "./TimeField.types.js";
 export declare const useTimeField: <TProps extends UseTimeFieldProps>(props: TProps) => import("../internals/index.js").UseFieldReturnValue<TProps>;

package/TimePicker/TimePicker.d.mts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { TimePickerProps } from "./TimePicker.types.mjs";
+import type { TimePickerProps } from "./TimePicker.types.mjs";
 type TimePickerComponent = ((props: TimePickerProps & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
   propTypes?: any;
 };

package/TimePicker/TimePicker.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { TimePickerProps } from "./TimePicker.types.js";
+import type { TimePickerProps } from "./TimePicker.types.js";
 type TimePickerComponent = ((props: TimePickerProps & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
   propTypes?: any;
 };

package/TimePicker/TimePicker.types.d.mts

@@ -1,7 +1,7 @@
-import { DesktopTimePickerProps, DesktopTimePickerSlots, DesktopTimePickerSlotProps } from "../DesktopTimePicker/index.mjs";
-import { BaseSingleInputFieldProps, TimeViewWithMeridiem } from "../internals/models/index.mjs";
-import { MobileTimePickerProps, MobileTimePickerSlots, MobileTimePickerSlotProps } from "../MobileTimePicker/index.mjs";
-import { ValidateTimeProps } from "../validation/validateTime.mjs";
+import type { DesktopTimePickerProps, DesktopTimePickerSlots, DesktopTimePickerSlotProps } from "../DesktopTimePicker/index.mjs";
+import type { BaseSingleInputFieldProps, TimeViewWithMeridiem } from "../internals/models/index.mjs";
+import type { MobileTimePickerProps, MobileTimePickerSlots, MobileTimePickerSlotProps } from "../MobileTimePicker/index.mjs";
+import type { ValidateTimeProps } from "../validation/validateTime.mjs";
 export interface TimePickerSlots extends DesktopTimePickerSlots, MobileTimePickerSlots {}
 export interface TimePickerSlotProps extends DesktopTimePickerSlotProps, MobileTimePickerSlotProps {}
 export interface TimePickerProps extends DesktopTimePickerProps, Omit<MobileTimePickerProps<TimeViewWithMeridiem>, 'views'> {

package/TimePicker/TimePicker.types.d.ts

@@ -1,7 +1,7 @@
-import { DesktopTimePickerProps, DesktopTimePickerSlots, DesktopTimePickerSlotProps } from "../DesktopTimePicker/index.js";
-import { BaseSingleInputFieldProps, TimeViewWithMeridiem } from "../internals/models/index.js";
-import { MobileTimePickerProps, MobileTimePickerSlots, MobileTimePickerSlotProps } from "../MobileTimePicker/index.js";
-import { ValidateTimeProps } from "../validation/validateTime.js";
+import type { DesktopTimePickerProps, DesktopTimePickerSlots, DesktopTimePickerSlotProps } from "../DesktopTimePicker/index.js";
+import type { BaseSingleInputFieldProps, TimeViewWithMeridiem } from "../internals/models/index.js";
+import type { MobileTimePickerProps, MobileTimePickerSlots, MobileTimePickerSlotProps } from "../MobileTimePicker/index.js";
+import type { ValidateTimeProps } from "../validation/validateTime.js";
 export interface TimePickerSlots extends DesktopTimePickerSlots, MobileTimePickerSlots {}
 export interface TimePickerSlotProps extends DesktopTimePickerSlotProps, MobileTimePickerSlotProps {}
 export interface TimePickerProps extends DesktopTimePickerProps, Omit<MobileTimePickerProps<TimeViewWithMeridiem>, 'views'> {

package/TimePicker/TimePickerToolbar.d.mts

@@ -1,5 +1,5 @@
-import { BaseToolbarProps, ExportedBaseToolbarProps } from "../internals/models/props/toolbar.mjs";
-import { TimePickerToolbarClasses } from "./timePickerToolbarClasses.mjs";
+import type { BaseToolbarProps, ExportedBaseToolbarProps } from "../internals/models/props/toolbar.mjs";
+import type { TimePickerToolbarClasses } from "./timePickerToolbarClasses.mjs";
 export interface TimePickerToolbarProps extends BaseToolbarProps, ExportedTimePickerToolbarProps {
   ampm?: boolean;
   ampmInClock?: boolean;

package/TimePicker/TimePickerToolbar.d.ts

@@ -1,5 +1,5 @@
-import { BaseToolbarProps, ExportedBaseToolbarProps } from "../internals/models/props/toolbar.js";
-import { TimePickerToolbarClasses } from "./timePickerToolbarClasses.js";
+import type { BaseToolbarProps, ExportedBaseToolbarProps } from "../internals/models/props/toolbar.js";
+import type { TimePickerToolbarClasses } from "./timePickerToolbarClasses.js";
 export interface TimePickerToolbarProps extends BaseToolbarProps, ExportedTimePickerToolbarProps {
   ampm?: boolean;
   ampmInClock?: boolean;

package/TimePicker/shared.d.mts

@@ -1,15 +1,15 @@
 import * as React from 'react';
-import { DefaultizedProps } from '@mui/x-internals/types';
-import { TimeClockSlots, TimeClockSlotProps } from "../TimeClock/TimeClock.types.mjs";
-import { BasePickerInputProps } from "../internals/models/props/basePickerProps.mjs";
-import { LocalizedComponent } from "../locales/utils/pickersLocaleTextApi.mjs";
-import { TimePickerToolbarProps, ExportedTimePickerToolbarProps } from "./TimePickerToolbar.mjs";
-import { TimeValidationError } from "../models/index.mjs";
-import { PickerViewRendererLookup } from "../internals/hooks/usePicker/index.mjs";
-import { TimeViewRendererProps } from "../timeViewRenderers/index.mjs";
-import { BaseClockProps, ExportedBaseClockProps } from "../internals/models/props/time.mjs";
-import { PickerValue, TimeViewWithMeridiem } from "../internals/models/index.mjs";
-import { ValidateTimePropsToDefault } from "../validation/validateTime.mjs";
+import type { DefaultizedProps } from '@mui/x-internals/types';
+import type { TimeClockSlots, TimeClockSlotProps } from "../TimeClock/TimeClock.types.mjs";
+import type { BasePickerInputProps } from "../internals/models/props/basePickerProps.mjs";
+import type { LocalizedComponent } from "../locales/utils/pickersLocaleTextApi.mjs";
+import type { TimePickerToolbarProps, ExportedTimePickerToolbarProps } from "./TimePickerToolbar.mjs";
+import type { TimeValidationError } from "../models/index.mjs";
+import type { PickerViewRendererLookup } from "../internals/hooks/usePicker/index.mjs";
+import type { TimeViewRendererProps } from "../timeViewRenderers/index.mjs";
+import type { BaseClockProps, ExportedBaseClockProps } from "../internals/models/props/time.mjs";
+import type { PickerValue, TimeViewWithMeridiem } from "../internals/models/index.mjs";
+import type { ValidateTimePropsToDefault } from "../validation/validateTime.mjs";
 export interface BaseTimePickerSlots extends TimeClockSlots {
   /**
    * Custom component for the toolbar rendered above the views.