@mui/x-date-pickers 9.6.0 → 9.8.0

package/PickersActionBar/PickersActionBar.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { DialogActionsProps } from '@mui/material/DialogActions';
+import type { DialogActionsProps } from '@mui/material/DialogActions';
 export type PickersActionBarAction = 'clear' | 'cancel' | 'accept' | 'today' | 'next' | 'nextOrAccept';
 export interface PickersActionBarProps extends DialogActionsProps {
   /**

package/PickersCalendarHeader/PickersCalendarHeader.d.mts

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

package/PickersCalendarHeader/PickersCalendarHeader.d.ts

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

package/PickersCalendarHeader/PickersCalendarHeader.types.d.mts

@@ -1,12 +1,12 @@
-import * as React from 'react';
-import { SlotComponentProps } from '@mui/utils/types';
-import IconButton from '@mui/material/IconButton';
-import SvgIcon from '@mui/material/SvgIcon';
-import { SxProps, Theme } from '@mui/material/styles';
-import { ExportedPickersArrowSwitcherProps, PickersArrowSwitcherSlots, PickersArrowSwitcherSlotProps } from "../internals/components/PickersArrowSwitcher/index.mjs";
-import { MonthValidationOptions } from "../internals/hooks/date-helpers-hooks.mjs";
-import { PickerValidDate, DateView, PickerOwnerState } from "../models/index.mjs";
-import { PickersCalendarHeaderClasses } from "./pickersCalendarHeaderClasses.mjs";
+import type * as React from 'react';
+import type { SlotComponentProps } from '@mui/utils/types';
+import type IconButton from '@mui/material/IconButton';
+import type SvgIcon from '@mui/material/SvgIcon';
+import type { SxProps, Theme } from '@mui/material/styles';
+import type { ExportedPickersArrowSwitcherProps, PickersArrowSwitcherSlots, PickersArrowSwitcherSlotProps } from "../internals/components/PickersArrowSwitcher/index.mjs";
+import type { MonthValidationOptions } from "../internals/hooks/date-helpers-hooks.mjs";
+import type { PickerValidDate, DateView, PickerOwnerState } from "../models/index.mjs";
+import type { PickersCalendarHeaderClasses } from "./pickersCalendarHeaderClasses.mjs";
 export interface PickersCalendarHeaderSlots extends PickersArrowSwitcherSlots {
   /**
    * Button displayed to switch between different calendar views.

package/PickersCalendarHeader/PickersCalendarHeader.types.d.ts

@@ -1,12 +1,12 @@
-import * as React from 'react';
-import { SlotComponentProps } from '@mui/utils/types';
-import IconButton from '@mui/material/IconButton';
-import SvgIcon from '@mui/material/SvgIcon';
-import { SxProps, Theme } from '@mui/material/styles';
-import { ExportedPickersArrowSwitcherProps, PickersArrowSwitcherSlots, PickersArrowSwitcherSlotProps } from "../internals/components/PickersArrowSwitcher/index.js";
-import { MonthValidationOptions } from "../internals/hooks/date-helpers-hooks.js";
-import { PickerValidDate, DateView, PickerOwnerState } from "../models/index.js";
-import { PickersCalendarHeaderClasses } from "./pickersCalendarHeaderClasses.js";
+import type * as React from 'react';
+import type { SlotComponentProps } from '@mui/utils/types';
+import type IconButton from '@mui/material/IconButton';
+import type SvgIcon from '@mui/material/SvgIcon';
+import type { SxProps, Theme } from '@mui/material/styles';
+import type { ExportedPickersArrowSwitcherProps, PickersArrowSwitcherSlots, PickersArrowSwitcherSlotProps } from "../internals/components/PickersArrowSwitcher/index.js";
+import type { MonthValidationOptions } from "../internals/hooks/date-helpers-hooks.js";
+import type { PickerValidDate, DateView, PickerOwnerState } from "../models/index.js";
+import type { PickersCalendarHeaderClasses } from "./pickersCalendarHeaderClasses.js";
 export interface PickersCalendarHeaderSlots extends PickersArrowSwitcherSlots {
   /**
    * Button displayed to switch between different calendar views.

package/PickersLayout/PickersLayout.d.mts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { PickerLayoutOwnerState, PickersLayoutProps } from "./PickersLayout.types.mjs";
-import { PickerValidValue } from "../internals/models/index.mjs";
+import type { PickerLayoutOwnerState, PickersLayoutProps } from "./PickersLayout.types.mjs";
+import type { PickerValidValue } from "../internals/models/index.mjs";
 export declare const PickersLayoutRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
   ownerState: PickerLayoutOwnerState;
 }, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.HTMLAttributes<HTMLDivElement> | keyof React.ClassAttributes<HTMLDivElement>>, {}>;

package/PickersLayout/PickersLayout.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { PickerLayoutOwnerState, PickersLayoutProps } from "./PickersLayout.types.js";
-import { PickerValidValue } from "../internals/models/index.js";
+import type { PickerLayoutOwnerState, PickersLayoutProps } from "./PickersLayout.types.js";
+import type { PickerValidValue } from "../internals/models/index.js";
 export declare const PickersLayoutRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
   ownerState: PickerLayoutOwnerState;
 }, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.HTMLAttributes<HTMLDivElement> | keyof React.ClassAttributes<HTMLDivElement>>, {}>;

package/PickersLayout/PickersLayout.types.d.mts

@@ -1,14 +1,14 @@
-import * as React from 'react';
-import { SxProps, Theme } from '@mui/material/styles';
-import { SlotComponentProps } from '@mui/utils/types';
-import { PickersActionBar, PickersActionBarProps } from "../PickersActionBar/index.mjs";
-import { BaseToolbarProps, ExportedBaseToolbarProps } from "../internals/models/props/toolbar.mjs";
-import { ExportedBaseTabsProps } from "../internals/models/props/tabs.mjs";
-import { PickersLayoutClasses } from "./pickersLayoutClasses.mjs";
-import { PickersShortcutsProps } from "../PickersShortcuts/index.mjs";
-import { ExportedPickersShortcutProps, PickersShortcuts } from "../PickersShortcuts/PickersShortcuts.mjs";
-import { PickerOwnerState } from "../models/index.mjs";
-import { PickerValidValue } from "../internals/models/index.mjs";
+import type * as React from 'react';
+import type { SxProps, Theme } from '@mui/material/styles';
+import type { SlotComponentProps } from '@mui/utils/types';
+import type { PickersActionBar, PickersActionBarProps } from "../PickersActionBar/index.mjs";
+import type { BaseToolbarProps, ExportedBaseToolbarProps } from "../internals/models/props/toolbar.mjs";
+import type { ExportedBaseTabsProps } from "../internals/models/props/tabs.mjs";
+import type { PickersLayoutClasses } from "./pickersLayoutClasses.mjs";
+import type { PickersShortcutsProps } from "../PickersShortcuts/index.mjs";
+import type { ExportedPickersShortcutProps, PickersShortcuts } from "../PickersShortcuts/PickersShortcuts.mjs";
+import type { PickerOwnerState } from "../models/index.mjs";
+import type { PickerValidValue } from "../internals/models/index.mjs";
 export interface ExportedPickersLayoutSlots<TValue extends PickerValidValue> {
   /**
    * Custom component for the action bar, it is placed below the Picker views.

package/PickersLayout/PickersLayout.types.d.ts

@@ -1,14 +1,14 @@
-import * as React from 'react';
-import { SxProps, Theme } from '@mui/material/styles';
-import { SlotComponentProps } from '@mui/utils/types';
-import { PickersActionBar, PickersActionBarProps } from "../PickersActionBar/index.js";
-import { BaseToolbarProps, ExportedBaseToolbarProps } from "../internals/models/props/toolbar.js";
-import { ExportedBaseTabsProps } from "../internals/models/props/tabs.js";
-import { PickersLayoutClasses } from "./pickersLayoutClasses.js";
-import { PickersShortcutsProps } from "../PickersShortcuts/index.js";
-import { ExportedPickersShortcutProps, PickersShortcuts } from "../PickersShortcuts/PickersShortcuts.js";
-import { PickerOwnerState } from "../models/index.js";
-import { PickerValidValue } from "../internals/models/index.js";
+import type * as React from 'react';
+import type { SxProps, Theme } from '@mui/material/styles';
+import type { SlotComponentProps } from '@mui/utils/types';
+import type { PickersActionBar, PickersActionBarProps } from "../PickersActionBar/index.js";
+import type { BaseToolbarProps, ExportedBaseToolbarProps } from "../internals/models/props/toolbar.js";
+import type { ExportedBaseTabsProps } from "../internals/models/props/tabs.js";
+import type { PickersLayoutClasses } from "./pickersLayoutClasses.js";
+import type { PickersShortcutsProps } from "../PickersShortcuts/index.js";
+import type { ExportedPickersShortcutProps, PickersShortcuts } from "../PickersShortcuts/PickersShortcuts.js";
+import type { PickerOwnerState } from "../models/index.js";
+import type { PickerValidValue } from "../internals/models/index.js";
 export interface ExportedPickersLayoutSlots<TValue extends PickerValidValue> {
   /**
    * Custom component for the action bar, it is placed below the Picker views.

package/PickersLayout/usePickerLayout.d.mts

@@ -1,5 +1,5 @@
-import { PickerLayoutOwnerState, PickersLayoutProps, SubComponents } from "./PickersLayout.types.mjs";
-import { PickerValidValue } from "../internals/models/index.mjs";
+import type { PickerLayoutOwnerState, PickersLayoutProps, SubComponents } from "./PickersLayout.types.mjs";
+import type { PickerValidValue } from "../internals/models/index.mjs";
 interface UsePickerLayoutResponse<TValue extends PickerValidValue> extends SubComponents<TValue> {
   ownerState: PickerLayoutOwnerState;
 }

package/PickersLayout/usePickerLayout.d.ts

@@ -1,5 +1,5 @@
-import { PickerLayoutOwnerState, PickersLayoutProps, SubComponents } from "./PickersLayout.types.js";
-import { PickerValidValue } from "../internals/models/index.js";
+import type { PickerLayoutOwnerState, PickersLayoutProps, SubComponents } from "./PickersLayout.types.js";
+import type { PickerValidValue } from "../internals/models/index.js";
 interface UsePickerLayoutResponse<TValue extends PickerValidValue> extends SubComponents<TValue> {
   ownerState: PickerLayoutOwnerState;
 }

package/PickersSectionList/PickersSectionList.types.d.mts

@@ -1,7 +1,7 @@
-import * as React from 'react';
-import { SlotComponentProps } from '@mui/utils/types';
-import { PickersSectionListClasses } from "./pickersSectionListClasses.mjs";
-import { PickerOwnerState } from "../models/index.mjs";
+import type * as React from 'react';
+import type { SlotComponentProps } from '@mui/utils/types';
+import type { PickersSectionListClasses } from "./pickersSectionListClasses.mjs";
+import type { PickerOwnerState } from "../models/index.mjs";
 import type { UseFieldDOMGetters } from "../internals/hooks/useField/useField.types.mjs";
 export interface PickersSectionListSlots {
   root: React.ElementType;

package/PickersSectionList/PickersSectionList.types.d.ts

@@ -1,7 +1,7 @@
-import * as React from 'react';
-import { SlotComponentProps } from '@mui/utils/types';
-import { PickersSectionListClasses } from "./pickersSectionListClasses.js";
-import { PickerOwnerState } from "../models/index.js";
+import type * as React from 'react';
+import type { SlotComponentProps } from '@mui/utils/types';
+import type { PickersSectionListClasses } from "./pickersSectionListClasses.js";
+import type { PickerOwnerState } from "../models/index.js";
 import type { UseFieldDOMGetters } from "../internals/hooks/useField/useField.types.js";
 export interface PickersSectionListSlots {
   root: React.ElementType;

package/PickersShortcuts/PickersShortcuts.d.mts

@@ -1,6 +1,6 @@
-import { ListProps } from '@mui/material/List';
-import { PickerValidValue } from "../internals/models/index.mjs";
-import { PickerChangeImportance } from "../models/pickers.mjs";
+import type { ListProps } from '@mui/material/List';
+import type { PickerValidValue } from "../internals/models/index.mjs";
+import type { PickerChangeImportance } from "../models/pickers.mjs";
 interface PickersShortcutsItemGetValueParams<TValue extends PickerValidValue> {
   isValid: (value: TValue) => boolean;
 }

package/PickersShortcuts/PickersShortcuts.d.ts

@@ -1,6 +1,6 @@
-import { ListProps } from '@mui/material/List';
-import { PickerValidValue } from "../internals/models/index.js";
-import { PickerChangeImportance } from "../models/pickers.js";
+import type { ListProps } from '@mui/material/List';
+import type { PickerValidValue } from "../internals/models/index.js";
+import type { PickerChangeImportance } from "../models/pickers.js";
 interface PickersShortcutsItemGetValueParams<TValue extends PickerValidValue> {
   isValid: (value: TValue) => boolean;
 }

package/PickersTextField/PickersFilledInput/PickersFilledInput.d.mts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { PickersInputBaseProps } from "../PickersInputBase/index.mjs";
-import { PickerTextFieldOwnerState } from "../../models/fields.mjs";
+import type { PickersInputBaseProps } from "../PickersInputBase/index.mjs";
+import type { PickerTextFieldOwnerState } from "../../models/fields.mjs";
 export interface PickersFilledInputProps extends PickersInputBaseProps {
   disableUnderline?: boolean;
   hiddenLabel?: boolean;

package/PickersTextField/PickersFilledInput/PickersFilledInput.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { PickersInputBaseProps } from "../PickersInputBase/index.js";
-import { PickerTextFieldOwnerState } from "../../models/fields.js";
+import type { PickersInputBaseProps } from "../PickersInputBase/index.js";
+import type { PickerTextFieldOwnerState } from "../../models/fields.js";
 export interface PickersFilledInputProps extends PickersInputBaseProps {
   disableUnderline?: boolean;
   hiddenLabel?: boolean;

package/PickersTextField/PickersFilledInput/PickersFilledInput.js

@@ -298,6 +298,7 @@ process.env.NODE_ENV !== "production" ? PickersFilledInput.propTypes /* remove-p
   onClick: _propTypes.default.func.isRequired,
   onInput: _propTypes.default.func.isRequired,
   onKeyDown: _propTypes.default.func.isRequired,
+  onMouseDown: _propTypes.default.func.isRequired,
   onPaste: _propTypes.default.func.isRequired,
   ownerState: _propTypes.default /* @typescript-to-proptypes-ignore */.any,
   readOnly: _propTypes.default.bool,

package/PickersTextField/PickersFilledInput/PickersFilledInput.mjs

@@ -291,6 +291,7 @@ process.env.NODE_ENV !== "production" ? PickersFilledInput.propTypes /* remove-p
   onClick: PropTypes.func.isRequired,
   onInput: PropTypes.func.isRequired,
   onKeyDown: PropTypes.func.isRequired,
+  onMouseDown: PropTypes.func.isRequired,
   onPaste: PropTypes.func.isRequired,
   ownerState: PropTypes /* @typescript-to-proptypes-ignore */.any,
   readOnly: PropTypes.bool,

package/PickersTextField/PickersFilledInput/pickersFilledInputClasses.d.mts

@@ -1,4 +1,4 @@
-import { PickersInputBaseClasses } from "../PickersInputBase/index.mjs";
+import type { PickersInputBaseClasses } from "../PickersInputBase/index.mjs";
 export interface PickersFilledInputClasses extends PickersInputBaseClasses {
   /** Styles applied to the root element unless `disableUnderline={true}`. */
   underline: string;

package/PickersTextField/PickersFilledInput/pickersFilledInputClasses.d.ts

@@ -1,4 +1,4 @@
-import { PickersInputBaseClasses } from "../PickersInputBase/index.js";
+import type { PickersInputBaseClasses } from "../PickersInputBase/index.js";
 export interface PickersFilledInputClasses extends PickersInputBaseClasses {
   /** Styles applied to the root element unless `disableUnderline={true}`. */
   underline: string;

package/PickersTextField/PickersInput/PickersInput.d.mts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { PickersInputBaseProps } from "../PickersInputBase/index.mjs";
-import { PickerTextFieldOwnerState } from "../../models/fields.mjs";
+import type { PickersInputBaseProps } from "../PickersInputBase/index.mjs";
+import type { PickerTextFieldOwnerState } from "../../models/fields.mjs";
 export interface PickersInputProps extends PickersInputBaseProps {
   disableUnderline?: boolean;
 }

package/PickersTextField/PickersInput/PickersInput.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { PickersInputBaseProps } from "../PickersInputBase/index.js";
-import { PickerTextFieldOwnerState } from "../../models/fields.js";
+import type { PickersInputBaseProps } from "../PickersInputBase/index.js";
+import type { PickerTextFieldOwnerState } from "../../models/fields.js";
 export interface PickersInputProps extends PickersInputBaseProps {
   disableUnderline?: boolean;
 }

package/PickersTextField/PickersInput/PickersInput.js

@@ -216,6 +216,7 @@ process.env.NODE_ENV !== "production" ? PickersInput.propTypes /* remove-proptyp
   onClick: _propTypes.default.func.isRequired,
   onInput: _propTypes.default.func.isRequired,
   onKeyDown: _propTypes.default.func.isRequired,
+  onMouseDown: _propTypes.default.func.isRequired,
   onPaste: _propTypes.default.func.isRequired,
   ownerState: _propTypes.default /* @typescript-to-proptypes-ignore */.any,
   readOnly: _propTypes.default.bool,

package/PickersTextField/PickersInput/PickersInput.mjs

@@ -209,6 +209,7 @@ process.env.NODE_ENV !== "production" ? PickersInput.propTypes /* remove-proptyp
   onClick: PropTypes.func.isRequired,
   onInput: PropTypes.func.isRequired,
   onKeyDown: PropTypes.func.isRequired,
+  onMouseDown: PropTypes.func.isRequired,
   onPaste: PropTypes.func.isRequired,
   ownerState: PropTypes /* @typescript-to-proptypes-ignore */.any,
   readOnly: PropTypes.bool,

package/PickersTextField/PickersInput/pickersInputClasses.d.mts

@@ -1,4 +1,4 @@
-import { PickersInputBaseClasses } from "../PickersInputBase/index.mjs";
+import type { PickersInputBaseClasses } from "../PickersInputBase/index.mjs";
 export interface PickersInputClasses extends PickersInputBaseClasses {
   /** Styles applied to the root element unless `disableUnderline={true}`. */
   underline: string;

package/PickersTextField/PickersInput/pickersInputClasses.d.ts

@@ -1,4 +1,4 @@
-import { PickersInputBaseClasses } from "../PickersInputBase/index.js";
+import type { PickersInputBaseClasses } from "../PickersInputBase/index.js";
 export interface PickersInputClasses extends PickersInputBaseClasses {
   /** Styles applied to the root element unless `disableUnderline={true}`. */
   underline: string;

package/PickersTextField/PickersInputBase/PickersInputBase.d.mts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { PickersInputBaseProps } from "./PickersInputBase.types.mjs";
-import { PickerTextFieldOwnerState } from "../../models/fields.mjs";
+import type { PickersInputBaseProps } from "./PickersInputBase.types.mjs";
+import type { PickerTextFieldOwnerState } from "../../models/fields.mjs";
 export declare const PickersInputBaseRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
   ownerState: PickerTextFieldOwnerState;
 }, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.HTMLAttributes<HTMLDivElement> | keyof React.ClassAttributes<HTMLDivElement>>, {}>;

package/PickersTextField/PickersInputBase/PickersInputBase.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { PickersInputBaseProps } from "./PickersInputBase.types.js";
-import { PickerTextFieldOwnerState } from "../../models/fields.js";
+import type { PickersInputBaseProps } from "./PickersInputBase.types.js";
+import type { PickerTextFieldOwnerState } from "../../models/fields.js";
 export declare const PickersInputBaseRoot: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material/styles").Theme> & {
   ownerState: PickerTextFieldOwnerState;
 }, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.HTMLAttributes<HTMLDivElement> | keyof React.ClassAttributes<HTMLDivElement>>, {}>;

package/PickersTextField/PickersInputBase/PickersInputBase.js

@@ -162,7 +162,21 @@ const PickersInputBaseSectionContent = (0, _styles.styled)(_PickersSectionList.U
   // 23px
   letterSpacing: 'inherit',
   width: 'fit-content',
-  outline: 'none'
+  outline: 'none',
+  // Disables Chromium's focus-delegation onto contenteditable descendants
+  // while the field is not focused. The bug is Chromium-only, and applying
+  // `WebkitUserModify` on WebKit breaks Playwright's `fill()` editability
+  // check, so we gate on a Chromium-only CSS property (`-webkit-app-region`,
+  // a Blink/Electron extension WebKit never adopted) via `@supports`.
+  // The WebKit exclusion is empirical, not guaranteed across versions: the
+  // regression guard is the WebKit `fill()` cases in the browser e2e suite,
+  // which would fail if a future WebKit started matching this `@supports`.
+  '@supports (-webkit-app-region: drag)': {
+    [`.${_pickersInputBaseClasses.pickersInputBaseClasses.root}:not(:focus-within) &`]: {
+      WebkitUserModify: 'read-only',
+      userSelect: 'none'
+    }
+  }
 }));
 const PickersInputBaseSectionSeparator = (0, _styles.styled)(_PickersSectionList.Unstable_PickersSectionListSectionSeparator, {
   name: 'MuiPickersInputBase',
@@ -498,6 +512,7 @@ process.env.NODE_ENV !== "production" ? PickersInputBase.propTypes /* remove-pro
   onClick: _propTypes.default.func.isRequired,
   onInput: _propTypes.default.func.isRequired,
   onKeyDown: _propTypes.default.func.isRequired,
+  onMouseDown: _propTypes.default.func.isRequired,
   onPaste: _propTypes.default.func.isRequired,
   ownerState: _propTypes.default /* @typescript-to-proptypes-ignore */.any,
   readOnly: _propTypes.default.bool,

package/PickersTextField/PickersInputBase/PickersInputBase.mjs

@@ -155,7 +155,21 @@ const PickersInputBaseSectionContent = styled(PickersSectionListSectionContent,
   // 23px
   letterSpacing: 'inherit',
   width: 'fit-content',
-  outline: 'none'
+  outline: 'none',
+  // Disables Chromium's focus-delegation onto contenteditable descendants
+  // while the field is not focused. The bug is Chromium-only, and applying
+  // `WebkitUserModify` on WebKit breaks Playwright's `fill()` editability
+  // check, so we gate on a Chromium-only CSS property (`-webkit-app-region`,
+  // a Blink/Electron extension WebKit never adopted) via `@supports`.
+  // The WebKit exclusion is empirical, not guaranteed across versions: the
+  // regression guard is the WebKit `fill()` cases in the browser e2e suite,
+  // which would fail if a future WebKit started matching this `@supports`.
+  '@supports (-webkit-app-region: drag)': {
+    [`.${pickersInputBaseClasses.root}:not(:focus-within) &`]: {
+      WebkitUserModify: 'read-only',
+      userSelect: 'none'
+    }
+  }
 }));
 const PickersInputBaseSectionSeparator = styled(PickersSectionListSectionSeparator, {
   name: 'MuiPickersInputBase',
@@ -491,6 +505,7 @@ process.env.NODE_ENV !== "production" ? PickersInputBase.propTypes /* remove-pro
   onClick: PropTypes.func.isRequired,
   onInput: PropTypes.func.isRequired,
   onKeyDown: PropTypes.func.isRequired,
+  onMouseDown: PropTypes.func.isRequired,
   onPaste: PropTypes.func.isRequired,
   ownerState: PropTypes /* @typescript-to-proptypes-ignore */.any,
   readOnly: PropTypes.bool,

package/PickersTextField/PickersInputBase/PickersInputBase.types.d.mts

@@ -1,8 +1,8 @@
-import * as React from 'react';
-import { SxProps, Theme } from '@mui/material/styles';
-import { MuiEvent } from '@mui/x-internals/types';
-import { PickersSectionListProps, PickersSectionListSlotProps } from "../../PickersSectionList/index.mjs";
-import { PickerTextFieldOwnerState } from "../../models/fields.mjs";
+import type * as React from 'react';
+import type { SxProps, Theme } from '@mui/material/styles';
+import type { MuiEvent } from '@mui/x-internals/types';
+import type { PickersSectionListProps, PickersSectionListSlotProps } from "../../PickersSectionList/index.mjs";
+import type { PickerTextFieldOwnerState } from "../../models/fields.mjs";
 export interface PickersInputPropsUsedByField extends Pick<PickersSectionListProps, 'elements' | 'sectionListRef' | 'contentEditable' | 'tabIndex'> {
   /**
    * Is `true` if the current values equals the empty value.
@@ -11,6 +11,7 @@ export interface PickersInputPropsUsedByField extends Pick<PickersSectionListPro
    */
   areAllSectionsEmpty: boolean;
   onClick: React.MouseEventHandler<HTMLDivElement>;
+  onMouseDown: React.MouseEventHandler<HTMLDivElement>;
   onKeyDown: React.EventHandler<MuiEvent<React.KeyboardEvent<HTMLDivElement>>>;
   onInput: React.FormEventHandler<HTMLDivElement>;
   onPaste: React.ClipboardEventHandler<HTMLDivElement>;

package/PickersTextField/PickersInputBase/PickersInputBase.types.d.ts

@@ -1,8 +1,8 @@
-import * as React from 'react';
-import { SxProps, Theme } from '@mui/material/styles';
-import { MuiEvent } from '@mui/x-internals/types';
-import { PickersSectionListProps, PickersSectionListSlotProps } from "../../PickersSectionList/index.js";
-import { PickerTextFieldOwnerState } from "../../models/fields.js";
+import type * as React from 'react';
+import type { SxProps, Theme } from '@mui/material/styles';
+import type { MuiEvent } from '@mui/x-internals/types';
+import type { PickersSectionListProps, PickersSectionListSlotProps } from "../../PickersSectionList/index.js";
+import type { PickerTextFieldOwnerState } from "../../models/fields.js";
 export interface PickersInputPropsUsedByField extends Pick<PickersSectionListProps, 'elements' | 'sectionListRef' | 'contentEditable' | 'tabIndex'> {
   /**
    * Is `true` if the current values equals the empty value.
@@ -11,6 +11,7 @@ export interface PickersInputPropsUsedByField extends Pick<PickersSectionListPro
    */
   areAllSectionsEmpty: boolean;
   onClick: React.MouseEventHandler<HTMLDivElement>;
+  onMouseDown: React.MouseEventHandler<HTMLDivElement>;
   onKeyDown: React.EventHandler<MuiEvent<React.KeyboardEvent<HTMLDivElement>>>;
   onInput: React.FormEventHandler<HTMLDivElement>;
   onPaste: React.ClipboardEventHandler<HTMLDivElement>;

package/PickersTextField/PickersOutlinedInput/PickersOutlinedInput.d.mts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { PickersInputBaseProps } from "../PickersInputBase/index.mjs";
+import type { PickersInputBaseProps } from "../PickersInputBase/index.mjs";
 export interface PickersOutlinedInputProps extends PickersInputBaseProps {
   notched?: boolean;
 }

package/PickersTextField/PickersOutlinedInput/PickersOutlinedInput.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { PickersInputBaseProps } from "../PickersInputBase/index.js";
+import type { PickersInputBaseProps } from "../PickersInputBase/index.js";
 export interface PickersOutlinedInputProps extends PickersInputBaseProps {
   notched?: boolean;
 }

package/PickersTextField/PickersOutlinedInput/PickersOutlinedInput.js

@@ -115,14 +115,17 @@ const PickersOutlinedInput = exports.PickersOutlinedInput = /*#__PURE__*/React.f
       input: PickersOutlinedInputSectionsContainer
     }, inSlots),
     slotProps: inSlotProps,
-    renderSuffix: state => /*#__PURE__*/(0, _jsxRuntime.jsx)(_Outline.default, {
-      shrink: Boolean(notched || state.adornedStart || state.focused || state.filled),
-      notched: Boolean(notched || state.adornedStart || state.focused || state.filled),
-      className: classes.notchedOutline,
-      label: label != null && label !== '' && muiFormControl?.required ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
-        children: [label, "\u2009", '*']
-      }) : label
-    }),
+    renderSuffix: state => {
+      const isNotched = typeof notched !== 'undefined' ? notched : Boolean(state.adornedStart || state.focused || state.filled);
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Outline.default, {
+        shrink: isNotched,
+        notched: isNotched,
+        className: classes.notchedOutline,
+        label: label != null && label !== '' && muiFormControl?.required ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
+          children: [label, "\u2009", '*']
+        }) : label
+      });
+    },
     label: label,
     classes: classes,
     ref: ref
@@ -189,6 +192,7 @@ process.env.NODE_ENV !== "production" ? PickersOutlinedInput.propTypes /* remove
   onClick: _propTypes.default.func.isRequired,
   onInput: _propTypes.default.func.isRequired,
   onKeyDown: _propTypes.default.func.isRequired,
+  onMouseDown: _propTypes.default.func.isRequired,
   onPaste: _propTypes.default.func.isRequired,
   ownerState: _propTypes.default /* @typescript-to-proptypes-ignore */.any,
   readOnly: _propTypes.default.bool,

package/PickersTextField/PickersOutlinedInput/PickersOutlinedInput.mjs

@@ -108,14 +108,17 @@ const PickersOutlinedInput = /*#__PURE__*/React.forwardRef(function PickersOutli
       input: PickersOutlinedInputSectionsContainer
     }, inSlots),
     slotProps: inSlotProps,
-    renderSuffix: state => /*#__PURE__*/_jsx(Outline, {
-      shrink: Boolean(notched || state.adornedStart || state.focused || state.filled),
-      notched: Boolean(notched || state.adornedStart || state.focused || state.filled),
-      className: classes.notchedOutline,
-      label: label != null && label !== '' && muiFormControl?.required ? /*#__PURE__*/_jsxs(React.Fragment, {
-        children: [label, "\u2009", '*']
-      }) : label
-    }),
+    renderSuffix: state => {
+      const isNotched = typeof notched !== 'undefined' ? notched : Boolean(state.adornedStart || state.focused || state.filled);
+      return /*#__PURE__*/_jsx(Outline, {
+        shrink: isNotched,
+        notched: isNotched,
+        className: classes.notchedOutline,
+        label: label != null && label !== '' && muiFormControl?.required ? /*#__PURE__*/_jsxs(React.Fragment, {
+          children: [label, "\u2009", '*']
+        }) : label
+      });
+    },
     label: label,
     classes: classes,
     ref: ref
@@ -182,6 +185,7 @@ process.env.NODE_ENV !== "production" ? PickersOutlinedInput.propTypes /* remove
   onClick: PropTypes.func.isRequired,
   onInput: PropTypes.func.isRequired,
   onKeyDown: PropTypes.func.isRequired,
+  onMouseDown: PropTypes.func.isRequired,
   onPaste: PropTypes.func.isRequired,
   ownerState: PropTypes /* @typescript-to-proptypes-ignore */.any,
   readOnly: PropTypes.bool,

package/PickersTextField/PickersOutlinedInput/pickersOutlinedInputClasses.d.mts

@@ -1,4 +1,4 @@
-import { PickersInputBaseClasses } from "../PickersInputBase/index.mjs";
+import type { PickersInputBaseClasses } from "../PickersInputBase/index.mjs";
 export interface PickersOutlinedInputClasses extends PickersInputBaseClasses {
   /** Styles applied to the NotchedOutline element. */
   notchedOutline: string;

package/PickersTextField/PickersOutlinedInput/pickersOutlinedInputClasses.d.ts

@@ -1,4 +1,4 @@
-import { PickersInputBaseClasses } from "../PickersInputBase/index.js";
+import type { PickersInputBaseClasses } from "../PickersInputBase/index.js";
 export interface PickersOutlinedInputClasses extends PickersInputBaseClasses {
   /** Styles applied to the NotchedOutline element. */
   notchedOutline: string;

package/PickersTextField/PickersTextField.js

@@ -28,7 +28,7 @@ var _PickersInput = require("./PickersInput");
 var _useFieldOwnerState = require("../internals/hooks/useFieldOwnerState");
 var _usePickerTextFieldOwnerState = require("./usePickerTextFieldOwnerState");
 var _jsxRuntime = require("react/jsx-runtime");
-const _excluded = ["onFocus", "onBlur", "className", "classes", "color", "disabled", "error", "variant", "required", "hiddenLabel", "inputRef", "sectionListRef", "elements", "areAllSectionsEmpty", "onClick", "onKeyDown", "onKeyUp", "onPaste", "onInput", "endAdornment", "startAdornment", "tabIndex", "contentEditable", "focused", "value", "onChange", "fullWidth", "id", "name", "helperText", "label", "slots", "slotProps", "data-active-range-position"];
+const _excluded = ["onFocus", "onBlur", "className", "classes", "color", "disabled", "error", "variant", "required", "hiddenLabel", "inputRef", "sectionListRef", "elements", "areAllSectionsEmpty", "onClick", "onMouseDown", "onKeyDown", "onKeyUp", "onPaste", "onInput", "endAdornment", "startAdornment", "tabIndex", "contentEditable", "focused", "value", "onChange", "fullWidth", "id", "name", "helperText", "label", "slots", "slotProps", "data-active-range-position"];
 const VARIANT_COMPONENT = {
   standard: _PickersInput.PickersInput,
   filled: _PickersFilledInput.PickersFilledInput,
@@ -82,6 +82,7 @@ const PickersTextField = exports.PickersTextField = /*#__PURE__*/React.forwardRe
       elements,
       areAllSectionsEmpty,
       onClick,
+      onMouseDown,
       onKeyDown,
       onKeyUp,
       onPaste,
@@ -176,6 +177,7 @@ const PickersTextField = exports.PickersTextField = /*#__PURE__*/React.forwardRe
         elements: elements,
         areAllSectionsEmpty: areAllSectionsEmpty,
         onClick: onClick,
+        onMouseDown: onMouseDown,
         onKeyDown: onKeyDown,
         onKeyUp: onKeyUp,
         onInput: onInput,
@@ -307,6 +309,7 @@ process.env.NODE_ENV !== "production" ? PickersTextField.propTypes /* remove-pro
   onFocus: _propTypes.default.func.isRequired,
   onInput: _propTypes.default.func.isRequired,
   onKeyDown: _propTypes.default.func.isRequired,
+  onMouseDown: _propTypes.default.func.isRequired,
   onPaste: _propTypes.default.func.isRequired,
   readOnly: _propTypes.default.bool,
   /**