@mui/x-date-pickers 8.0.0-alpha.5 → 8.0.0-alpha.6

package/PickersLayout/PickersLayout.js

@@ -151,16 +151,8 @@ process.env.NODE_ENV !== "production" ? PickersLayout.propTypes = {
   classes: PropTypes.object,
   className: PropTypes.string,
   isValid: PropTypes.func.isRequired,
-  onAccept: PropTypes.func.isRequired,
-  onCancel: PropTypes.func.isRequired,
   onChange: PropTypes.func.isRequired,
-  onClear: PropTypes.func.isRequired,
-  onClose: PropTypes.func.isRequired,
-  onDismiss: PropTypes.func.isRequired,
-  onOpen: PropTypes.func.isRequired,
   onSelectShortcut: PropTypes.func.isRequired,
-  onSetToday: PropTypes.func.isRequired,
-  onViewChange: PropTypes.func.isRequired,
   /**
    * The props used for each component slot.
    * @default {}
@@ -175,8 +167,6 @@ process.env.NODE_ENV !== "production" ? PickersLayout.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]),
-  value: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.object), PropTypes.object]),
-  view: PropTypes.oneOf(['day', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'year']),
-  views: PropTypes.arrayOf(PropTypes.oneOf(['day', 'hours', 'meridiem', 'minutes', 'month', 'seconds', 'year']).isRequired).isRequired
+  value: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.object), PropTypes.object])
 } : void 0;
 export { PickersLayout };

package/PickersLayout/PickersLayout.types.d.ts

@@ -3,16 +3,14 @@ import { SxProps, Theme } from '@mui/material/styles';
 import { SlotComponentProps } from '@mui/utils';
 import { PickersActionBar, PickersActionBarProps } from '../PickersActionBar';
 import { BaseToolbarProps, ExportedBaseToolbarProps } from '../internals/models/props/toolbar';
-import { BaseTabsProps, ExportedBaseTabsProps } from '../internals/models/props/tabs';
+import { ExportedBaseTabsProps } from '../internals/models/props/tabs';
 import { PickersLayoutClasses } from './pickersLayoutClasses';
-import { DateOrTimeViewWithMeridiem } from '../internals/models/common';
 import { PickersShortcutsProps } from '../PickersShortcuts';
 import { ExportedPickersShortcutProps, PickersShortcuts } from '../PickersShortcuts/PickersShortcuts';
 import { PickerOwnerState } from '../models';
 import { PickerValidValue } from '../internals/models';
-import { UsePickerViewsLayoutResponse } from '../internals/hooks/usePicker/usePickerViews';
 import { UsePickerValueLayoutResponse } from '../internals/hooks/usePicker/usePickerValue.types';
-export interface ExportedPickersLayoutSlots<TValue extends PickerValidValue, TView extends DateOrTimeViewWithMeridiem> {
+export interface ExportedPickersLayoutSlots<TValue extends PickerValidValue> {
     /**
      * Custom component for the action bar, it is placed below the picker views.
      * @default PickersActionBar
@@ -27,7 +25,7 @@ export interface ExportedPickersLayoutSlots<TValue extends PickerValidValue, TVi
      * Custom component for wrapping the layout.
      * It wraps the toolbar, views, action bar, and shortcuts.
      */
-    layout?: React.JSXElementConstructor<PickersLayoutProps<TValue, TView> & React.RefAttributes<HTMLDivElement>>;
+    layout?: React.JSXElementConstructor<PickersLayoutProps<TValue> & React.RefAttributes<HTMLDivElement>>;
 }
 export interface PickerLayoutOwnerState extends PickerOwnerState {
     /**
@@ -37,7 +35,7 @@ export interface PickerLayoutOwnerState extends PickerOwnerState {
      */
     layoutDirection: 'ltr' | 'rtl';
 }
-export interface ExportedPickersLayoutSlotProps<TValue extends PickerValidValue, TView extends DateOrTimeViewWithMeridiem> {
+export interface ExportedPickersLayoutSlotProps<TValue extends PickerValidValue> {
     /**
      * Props passed down to the action bar component.
      */
@@ -49,20 +47,20 @@ export interface ExportedPickersLayoutSlotProps<TValue extends PickerValidValue,
     /**
      * Props passed down to the layoutRoot component.
      */
-    layout?: Partial<PickersLayoutProps<TValue, TView>>;
+    layout?: Partial<PickersLayoutProps<TValue>>;
 }
-export interface PickersLayoutSlots<TValue extends PickerValidValue, TView extends DateOrTimeViewWithMeridiem> extends ExportedPickersLayoutSlots<TValue, TView> {
+export interface PickersLayoutSlots<TValue extends PickerValidValue> extends ExportedPickersLayoutSlots<TValue> {
     /**
      * Tabs enabling toggling between views.
      */
-    tabs?: React.ElementType<BaseTabsProps<TView>>;
+    tabs?: React.ElementType<{}>;
     /**
      * Custom component for the toolbar.
      * It is placed above the picker views.
      */
-    toolbar?: React.JSXElementConstructor<BaseToolbarProps<TValue, TView>>;
+    toolbar?: React.JSXElementConstructor<BaseToolbarProps<TValue>>;
 }
-export interface PickersLayoutSlotProps<TValue extends PickerValidValue, TView extends DateOrTimeViewWithMeridiem> extends ExportedPickersLayoutSlotProps<TValue, TView> {
+export interface PickersLayoutSlotProps<TValue extends PickerValidValue> extends ExportedPickersLayoutSlotProps<TValue> {
     /**
      * Props passed down to the tabs component.
      */
@@ -72,7 +70,7 @@ export interface PickersLayoutSlotProps<TValue extends PickerValidValue, TView e
      */
     toolbar?: ExportedBaseToolbarProps;
 }
-export interface PickersLayoutProps<TValue extends PickerValidValue, TView extends DateOrTimeViewWithMeridiem> extends UsePickerViewsLayoutResponse<TView>, UsePickerValueLayoutResponse<TValue> {
+export interface PickersLayoutProps<TValue extends PickerValidValue> extends UsePickerValueLayoutResponse<TValue> {
     className?: string;
     children?: React.ReactNode;
     /**
@@ -87,12 +85,12 @@ export interface PickersLayoutProps<TValue extends PickerValidValue, TView exten
      * Overridable component slots.
      * @default {}
      */
-    slots?: PickersLayoutSlots<TValue, TView>;
+    slots?: PickersLayoutSlots<TValue>;
     /**
      * The props used for each component slot.
      * @default {}
      */
-    slotProps?: PickersLayoutSlotProps<TValue, TView>;
+    slotProps?: PickersLayoutSlotProps<TValue>;
 }
 export interface SubComponents<TValue extends PickerValidValue> {
     toolbar: React.ReactElement<ExportedBaseToolbarProps> | null;

package/PickersLayout/usePickerLayout.d.ts

@@ -1,7 +1,7 @@
 import { PickerLayoutOwnerState, PickersLayoutProps, SubComponents } from './PickersLayout.types';
-import { DateOrTimeViewWithMeridiem, PickerValidValue } from '../internals/models';
+import { PickerValidValue } from '../internals/models';
 interface UsePickerLayoutResponse<TValue extends PickerValidValue> extends SubComponents<TValue> {
     ownerState: PickerLayoutOwnerState;
 }
-declare const usePickerLayout: <TValue extends PickerValidValue, TView extends DateOrTimeViewWithMeridiem>(props: PickersLayoutProps<TValue, TView>) => UsePickerLayoutResponse<TValue>;
+declare const usePickerLayout: <TValue extends PickerValidValue>(props: PickersLayoutProps<TValue>) => UsePickerLayoutResponse<TValue>;
 export default usePickerLayout;

package/PickersLayout/usePickerLayout.js

@@ -35,17 +35,11 @@ const usePickerLayout = props => {
   } = usePickerPrivateContext();
   const {
     variant,
-    orientation
+    orientation,
+    view
   } = usePickerContext();
   const isRtl = useRtl();
   const {
-    onAccept,
-    onClear,
-    onCancel,
-    onSetToday,
-    view,
-    views,
-    onViewChange,
     value,
     onChange,
     onSelectShortcut,
@@ -70,10 +64,6 @@ const usePickerLayout = props => {
     elementType: ActionBar,
     externalSlotProps: slotProps?.actionBar,
     additionalProps: {
-      onAccept,
-      onClear,
-      onCancel,
-      onSetToday,
       actions: variant === 'desktop' ? [] : ['cancel', 'accept']
     },
     className: classes.actionBar,
@@ -90,10 +80,7 @@ const usePickerLayout = props => {
       isLandscape: orientation === 'landscape',
       // Will be removed in a follow up PR?
       onChange,
-      value,
-      view,
-      onViewChange,
-      views
+      value
     },
     className: classes.toolbar,
     ownerState
@@ -106,8 +93,6 @@ const usePickerLayout = props => {
   // Tabs
   const Tabs = slots?.tabs;
   const tabs = view && Tabs ? /*#__PURE__*/_jsx(Tabs, _extends({
-    view: view,
-    onViewChange: onViewChange,
     className: classes.tabs
   }, slotProps?.tabs)) : null;
 

package/StaticDatePicker/StaticDatePicker.types.d.ts

@@ -1,10 +1,9 @@
 import { MakeOptional } from '@mui/x-internals/types';
 import { BaseDatePickerProps, BaseDatePickerSlots, BaseDatePickerSlotProps } from '../DatePicker/shared';
 import { StaticOnlyPickerProps, UseStaticPickerSlots, UseStaticPickerSlotProps } from '../internals/hooks/useStaticPicker';
-import { DateView } from '../models';
-export interface StaticDatePickerSlots extends BaseDatePickerSlots, UseStaticPickerSlots<DateView> {
+export interface StaticDatePickerSlots extends BaseDatePickerSlots, UseStaticPickerSlots {
 }
-export interface StaticDatePickerSlotProps extends BaseDatePickerSlotProps, UseStaticPickerSlotProps<DateView> {
+export interface StaticDatePickerSlotProps extends BaseDatePickerSlotProps, UseStaticPickerSlotProps {
 }
 export interface StaticDatePickerProps extends BaseDatePickerProps, MakeOptional<StaticOnlyPickerProps, 'displayStaticWrapperAs'> {
     /**

package/StaticDateTimePicker/StaticDateTimePicker.types.d.ts

@@ -2,9 +2,9 @@ import { MakeOptional } from '@mui/x-internals/types';
 import { BaseDateTimePickerProps, BaseDateTimePickerSlots, BaseDateTimePickerSlotProps } from '../DateTimePicker/shared';
 import { StaticOnlyPickerProps, UseStaticPickerSlots, UseStaticPickerSlotProps } from '../internals/hooks/useStaticPicker';
 import { DateOrTimeView } from '../models';
-export interface StaticDateTimePickerSlots extends BaseDateTimePickerSlots, UseStaticPickerSlots<DateOrTimeView> {
+export interface StaticDateTimePickerSlots extends BaseDateTimePickerSlots, UseStaticPickerSlots {
 }
-export interface StaticDateTimePickerSlotProps extends BaseDateTimePickerSlotProps, UseStaticPickerSlotProps<DateOrTimeView> {
+export interface StaticDateTimePickerSlotProps extends BaseDateTimePickerSlotProps, UseStaticPickerSlotProps {
 }
 export interface StaticDateTimePickerProps extends BaseDateTimePickerProps<DateOrTimeView>, MakeOptional<StaticOnlyPickerProps, 'displayStaticWrapperAs'> {
     /**

package/StaticTimePicker/StaticTimePicker.types.d.ts

@@ -2,9 +2,9 @@ import { MakeOptional } from '@mui/x-internals/types';
 import { BaseTimePickerProps, BaseTimePickerSlots, BaseTimePickerSlotProps } from '../TimePicker/shared';
 import { StaticOnlyPickerProps, UseStaticPickerSlots, UseStaticPickerSlotProps } from '../internals/hooks/useStaticPicker';
 import { TimeView } from '../models';
-export interface StaticTimePickerSlots extends BaseTimePickerSlots, UseStaticPickerSlots<TimeView> {
+export interface StaticTimePickerSlots extends BaseTimePickerSlots, UseStaticPickerSlots {
 }
-export interface StaticTimePickerSlotProps extends BaseTimePickerSlotProps, UseStaticPickerSlotProps<TimeView> {
+export interface StaticTimePickerSlotProps extends BaseTimePickerSlotProps, UseStaticPickerSlotProps {
 }
 export interface StaticTimePickerProps extends BaseTimePickerProps<TimeView>, MakeOptional<StaticOnlyPickerProps, 'displayStaticWrapperAs'> {
     /**

package/TimePicker/TimePicker.types.d.ts

@@ -3,9 +3,9 @@ import { BaseSingleInputFieldProps, PickerValue, TimeViewWithMeridiem } from '..
 import { MobileTimePickerProps, MobileTimePickerSlots, MobileTimePickerSlotProps } from '../MobileTimePicker';
 import { TimeValidationError } from '../models';
 import { ValidateTimeProps } from '../validation/validateTime';
-export interface TimePickerSlots extends DesktopTimePickerSlots, MobileTimePickerSlots<TimeViewWithMeridiem> {
+export interface TimePickerSlots extends DesktopTimePickerSlots, MobileTimePickerSlots {
 }
-export interface TimePickerSlotProps<TEnableAccessibleFieldDOMStructure extends boolean> extends DesktopTimePickerSlotProps<TEnableAccessibleFieldDOMStructure>, MobileTimePickerSlotProps<TimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure> {
+export interface TimePickerSlotProps<TEnableAccessibleFieldDOMStructure extends boolean> extends DesktopTimePickerSlotProps<TEnableAccessibleFieldDOMStructure>, MobileTimePickerSlotProps<TEnableAccessibleFieldDOMStructure> {
 }
 export interface TimePickerProps<TEnableAccessibleFieldDOMStructure extends boolean = true> extends DesktopTimePickerProps<TEnableAccessibleFieldDOMStructure>, Omit<MobileTimePickerProps<TimeViewWithMeridiem, TEnableAccessibleFieldDOMStructure>, 'views'> {
     /**

package/TimePicker/TimePickerToolbar.d.ts

@@ -1,8 +1,8 @@
 import * as React from 'react';
 import { BaseToolbarProps, ExportedBaseToolbarProps } from '../internals/models/props/toolbar';
 import { TimePickerToolbarClasses } from './timePickerToolbarClasses';
-import { PickerValue, TimeViewWithMeridiem } from '../internals/models';
-export interface TimePickerToolbarProps extends BaseToolbarProps<PickerValue, TimeViewWithMeridiem>, ExportedTimePickerToolbarProps {
+import { PickerValue } from '../internals/models';
+export interface TimePickerToolbarProps extends BaseToolbarProps<PickerValue>, ExportedTimePickerToolbarProps {
     ampm?: boolean;
     ampmInClock?: boolean;
 }

package/TimePicker/TimePickerToolbar.js

@@ -2,7 +2,7 @@
 
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["ampm", "ampmInClock", "value", "isLandscape", "onChange", "view", "onViewChange", "views", "className", "classes"];
+const _excluded = ["ampm", "ampmInClock", "value", "isLandscape", "onChange", "className", "classes"];
 import * as React from 'react';
 import clsx from 'clsx';
 import PropTypes from 'prop-types';
@@ -125,9 +125,6 @@ function TimePickerToolbar(inProps) {
       value,
       isLandscape,
       onChange,
-      view,
-      onViewChange,
-      views,
       className,
       classes: classesProp
     } = props,
@@ -138,7 +135,10 @@ function TimePickerToolbar(inProps) {
   const classes = useUtilityClasses(classesProp, ownerState);
   const {
     disabled,
-    readOnly
+    readOnly,
+    view,
+    onViewChange,
+    views
   } = usePickerContext();
   const showAmPmControl = Boolean(ampm && !ampmInClock && views.includes('hours'));
   const {
@@ -223,12 +223,6 @@ process.env.NODE_ENV !== "production" ? TimePickerToolbar.propTypes = {
   hidden: PropTypes.bool,
   isLandscape: PropTypes.bool.isRequired,
   onChange: PropTypes.func.isRequired,
-  /**
-   * Callback called when a toolbar is clicked
-   * @template TView
-   * @param {TView} view The view to open
-   */
-  onViewChange: PropTypes.func.isRequired,
   /**
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
@@ -243,14 +237,6 @@ process.env.NODE_ENV !== "production" ? TimePickerToolbar.propTypes = {
    * @default "––"
    */
   toolbarPlaceholder: PropTypes.node,
-  value: PropTypes.object,
-  /**
-   * Currently visible picker view.
-   */
-  view: PropTypes.oneOf(['hours', 'meridiem', 'minutes', 'seconds']).isRequired,
-  /**
-   * Available views.
-   */
-  views: PropTypes.arrayOf(PropTypes.oneOf(['hours', 'meridiem', 'minutes', 'seconds']).isRequired).isRequired
+  value: PropTypes.object
 } : void 0;
 export { TimePickerToolbar };

package/hooks/index.d.ts

@@ -4,3 +4,4 @@ export { usePickerTranslations } from './usePickerTranslations';
 export { useSplitFieldProps } from './useSplitFieldProps';
 export { useParsedFormat } from './useParsedFormat';
 export { usePickerContext } from './usePickerContext';
+export { usePickerActionsContext } from './usePickerActionsContext';

package/hooks/index.js

@@ -2,4 +2,5 @@ export { useClearableField } from "./useClearableField.js";
 export { usePickerTranslations } from "./usePickerTranslations.js";
 export { useSplitFieldProps } from "./useSplitFieldProps.js";
 export { useParsedFormat } from "./useParsedFormat.js";
-export { usePickerContext } from "./usePickerContext.js";
+export { usePickerContext } from "./usePickerContext.js";
+export { usePickerActionsContext } from "./usePickerActionsContext.js";

package/hooks/usePickerActionsContext.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Returns a subset of the context passed by the picker wrapping the current component.
+ * It only contains the actions and never causes a re-render of the component using it.
+ */
+export declare const usePickerActionsContext: () => import("../internals/components/PickerProvider").PickerActionsContextValue;

package/hooks/usePickerActionsContext.js

@@ -0,0 +1,16 @@
+'use client';
+
+import * as React from 'react';
+import { PickerActionsContext } from "../internals/components/PickerProvider.js";
+
+/**
+ * Returns a subset of the context passed by the picker wrapping the current component.
+ * It only contains the actions and never causes a re-render of the component using it.
+ */
+export const usePickerActionsContext = () => {
+  const value = React.useContext(PickerActionsContext);
+  if (value == null) {
+    throw new Error(['MUI X: The `usePickerActionsContext` can only be called in fields that are used as a slot of a picker component'].join('\n'));
+  }
+  return value;
+};

package/hooks/usePickerContext.d.ts

@@ -1,4 +1,6 @@
+import { PickerContextValue } from '../internals/components/PickerProvider';
+import { DateOrTimeViewWithMeridiem } from '../internals/models';
 /**
  * Returns the context passed by the picker that wraps the current component.
  */
-export declare const usePickerContext: () => import("../internals/components/PickerProvider").PickerContextValue;
+export declare const usePickerContext: <TView extends DateOrTimeViewWithMeridiem = DateOrTimeViewWithMeridiem>() => PickerContextValue<TView>;

package/hooks/usePickerContext.js

@@ -2,7 +2,6 @@
 
 import * as React from 'react';
 import { PickerContext } from "../internals/components/PickerProvider.js";
-
 /**
  * Returns the context passed by the picker that wraps the current component.
  */

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-date-pickers v8.0.0-alpha.5
+ * @mui/x-date-pickers v8.0.0-alpha.6
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/internals/components/PickerProvider.d.ts

@@ -1,9 +1,11 @@
 import * as React from 'react';
 import { PickerOwnerState } from '../../models';
 import { PickersInputLocaleText } from '../../locales';
-import { PickerOrientation, PickerVariant } from '../models';
-import type { UsePickerValueContextValue } from '../hooks/usePicker/usePickerValue.types';
-export declare const PickerContext: React.Context<PickerContextValue | null>;
+import { DateOrTimeViewWithMeridiem, PickerOrientation, PickerVariant } from '../models';
+import type { UsePickerValueActionsContextValue, UsePickerValueContextValue, UsePickerValuePrivateContextValue } from '../hooks/usePicker/usePickerValue.types';
+import { UsePickerViewsContextValue } from '../hooks/usePicker/usePickerViews';
+export declare const PickerContext: React.Context<PickerContextValue<any> | null>;
+export declare const PickerActionsContext: React.Context<PickerActionsContextValue | null>;
 export declare const PickerPrivateContext: React.Context<PickerPrivateContextValue>;
 /**
  * Provides the context for the various parts of a picker component:
@@ -14,12 +16,13 @@ export declare const PickerPrivateContext: React.Context<PickerPrivateContextVal
  */
 export declare function PickerProvider(props: PickerProviderProps): React.JSX.Element;
 export interface PickerProviderProps {
-    contextValue: PickerContextValue;
+    contextValue: PickerContextValue<any>;
+    actionsContextValue: PickerActionsContextValue;
     privateContextValue: PickerPrivateContextValue;
     localeText: PickersInputLocaleText | undefined;
     children: React.ReactNode;
 }
-export interface PickerContextValue extends UsePickerValueContextValue {
+export interface PickerContextValue<TView extends DateOrTimeViewWithMeridiem = DateOrTimeViewWithMeridiem> extends UsePickerValueContextValue, UsePickerViewsContextValue<TView> {
     /**
      * `true` if the picker is disabled, `false` otherwise.
      */
@@ -46,7 +49,9 @@ export interface PickerContextValue extends UsePickerValueContextValue {
      */
     orientation: PickerOrientation;
 }
-export interface PickerPrivateContextValue {
+export interface PickerActionsContextValue extends UsePickerValueActionsContextValue {
+}
+export interface PickerPrivateContextValue extends UsePickerValuePrivateContextValue {
     /**
      * The ownerState of the picker.
      */

package/internals/components/PickerProvider.js

@@ -2,6 +2,7 @@ import * as React from 'react';
 import { LocalizationProvider } from "../../LocalizationProvider/index.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export const PickerContext = /*#__PURE__*/React.createContext(null);
+export const PickerActionsContext = /*#__PURE__*/React.createContext(null);
 export const PickerPrivateContext = /*#__PURE__*/React.createContext({
   ownerState: {
     isPickerDisabled: false,
@@ -10,7 +11,8 @@ export const PickerPrivateContext = /*#__PURE__*/React.createContext({
     isPickerOpen: false,
     pickerVariant: 'desktop',
     pickerOrientation: 'portrait'
-  }
+  },
+  dismissViews: () => {}
 });
 
 /**
@@ -23,17 +25,21 @@ export const PickerPrivateContext = /*#__PURE__*/React.createContext({
 export function PickerProvider(props) {
   const {
     contextValue,
+    actionsContextValue,
     privateContextValue,
     localeText,
     children
   } = props;
   return /*#__PURE__*/_jsx(PickerContext.Provider, {
     value: contextValue,
-    children: /*#__PURE__*/_jsx(PickerPrivateContext.Provider, {
-      value: privateContextValue,
-      children: /*#__PURE__*/_jsx(LocalizationProvider, {
-        localeText: localeText,
-        children: children
+    children: /*#__PURE__*/_jsx(PickerActionsContext.Provider, {
+      value: actionsContextValue,
+      children: /*#__PURE__*/_jsx(PickerPrivateContext.Provider, {
+        value: privateContextValue,
+        children: /*#__PURE__*/_jsx(LocalizationProvider, {
+          localeText: localeText,
+          children: children
+        })
       })
     })
   });

package/internals/components/PickersModalDialog.d.ts

@@ -2,7 +2,6 @@ import * as React from 'react';
 import { DialogProps as MuiDialogProps } from '@mui/material/Dialog';
 import { PaperProps as MuiPaperProps } from '@mui/material/Paper';
 import { TransitionProps as MuiTransitionProps } from '@mui/material/transitions';
-import { UsePickerValueActions } from '../hooks/usePicker/usePickerValue.types';
 export interface PickersModalDialogSlots {
     /**
      * Custom component for the dialog inside which the views are rendered on mobile.
@@ -34,7 +33,7 @@ export interface PickersModalDialogSlotProps {
      */
     mobileTransition?: Partial<MuiTransitionProps>;
 }
-export interface PickersModalDialogProps extends UsePickerValueActions {
+export interface PickersModalDialogProps {
     /**
      * Overridable component slots.
      * @default {}
@@ -45,6 +44,5 @@ export interface PickersModalDialogProps extends UsePickerValueActions {
      * @default {}
      */
     slotProps?: PickersModalDialogSlotProps;
-    open: boolean;
 }
 export declare function PickersModalDialog(props: React.PropsWithChildren<PickersModalDialogProps>): React.JSX.Element;

package/internals/components/PickersModalDialog.js

@@ -5,6 +5,8 @@ import Fade from '@mui/material/Fade';
 import MuiDialog, { dialogClasses } from '@mui/material/Dialog';
 import { styled } from '@mui/material/styles';
 import { DIALOG_WIDTH } from "../constants/dimensions.js";
+import { usePickerContext } from "../../hooks/index.js";
+import { usePickerPrivateContext } from "../hooks/usePickerPrivateContext.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const PickersModalDialogRoot = styled(MuiDialog)({
   [`& .${dialogClasses.container}`]: {
@@ -23,16 +25,20 @@ const PickersModalDialogContent = styled(DialogContent)({
 export function PickersModalDialog(props) {
   const {
     children,
-    onDismiss,
-    open,
     slots,
     slotProps
   } = props;
+  const {
+    open
+  } = usePickerContext();
+  const {
+    dismissViews
+  } = usePickerPrivateContext();
   const Dialog = slots?.dialog ?? PickersModalDialogRoot;
   const Transition = slots?.mobileTransition ?? Fade;
   return /*#__PURE__*/_jsx(Dialog, _extends({
     open: open,
-    onClose: onDismiss
+    onClose: dismissViews
   }, slotProps?.dialog, {
     TransitionComponent: Transition,
     TransitionProps: slotProps?.mobileTransition,

package/internals/components/PickersPopper.d.ts

@@ -5,7 +5,6 @@ import { TrapFocusProps as MuiTrapFocusProps } from '@mui/material/Unstable_Trap
 import { TransitionProps as MuiTransitionProps } from '@mui/material/transitions';
 import { SlotComponentPropsFromProps } from '@mui/x-internals/types';
 import { PickersPopperClasses } from './pickersPopperClasses';
-import { UsePickerValueActions } from '../hooks/usePicker/usePickerValue.types';
 import { PickerOwnerState } from '../../models';
 interface PickerPopperOwnerState extends PickerOwnerState {
     popperPlacement: PopperPlacementType;
@@ -50,10 +49,9 @@ export interface PickersPopperSlotProps {
      */
     popper?: SlotComponentPropsFromProps<PopperProps, {}, PickerPopperOwnerState>;
 }
-export interface PickerPopperProps extends UsePickerValueActions {
+export interface PickerPopperProps {
     role: 'tooltip' | 'dialog';
     anchorEl: MuiPopperProps['anchorEl'];
-    open: MuiPopperProps['open'];
     /**
      * @default "bottom"
      */

package/internals/components/PickersPopper.js

@@ -14,6 +14,7 @@ import { getPickersPopperUtilityClass } from "./pickersPopperClasses.js";
 import { getActiveElement } from "../utils/utils.js";
 import { useDefaultReduceAnimations } from "../hooks/useDefaultReduceAnimations.js";
 import { usePickerPrivateContext } from "../hooks/usePickerPrivateContext.js";
+import { usePickerContext } from "../../hooks/index.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const useUtilityClasses = classes => {
   const slots = {
@@ -210,8 +211,6 @@ export function PickersPopper(inProps) {
     containerRef = null,
     shouldRestoreFocus,
     onBlur,
-    onDismiss,
-    open,
     role,
     placement = 'bottom',
     slots,
@@ -219,17 +218,23 @@ export function PickersPopper(inProps) {
     reduceAnimations: inReduceAnimations,
     classes: classesProp
   } = props;
+  const {
+    open
+  } = usePickerContext();
+  const {
+    dismissViews
+  } = usePickerPrivateContext();
   React.useEffect(() => {
     function handleKeyDown(nativeEvent) {
       if (open && nativeEvent.key === 'Escape') {
-        onDismiss();
+        dismissViews();
       }
     }
     document.addEventListener('keydown', handleKeyDown);
     return () => {
       document.removeEventListener('keydown', handleKeyDown);
     };
-  }, [onDismiss, open]);
+  }, [dismissViews, open]);
   const lastFocusedElementRef = React.useRef(null);
   React.useEffect(() => {
     if (role === 'tooltip' || shouldRestoreFocus && !shouldRestoreFocus()) {
@@ -247,7 +252,7 @@ export function PickersPopper(inProps) {
       });
     }
   }, [open, role, shouldRestoreFocus]);
-  const [clickAwayRef, onPaperClick, onPaperTouchStart] = useClickAwayListener(open, onBlur ?? onDismiss);
+  const [clickAwayRef, onPaperClick, onPaperTouchStart] = useClickAwayListener(open, onBlur ?? dismissViews);
   const paperRef = React.useRef(null);
   const handleRef = useForkRef(paperRef, containerRef);
   const handlePaperRef = useForkRef(handleRef, clickAwayRef);
@@ -264,7 +269,7 @@ export function PickersPopper(inProps) {
     if (event.key === 'Escape') {
       // stop the propagation to avoid closing parent modal
       event.stopPropagation();
-      onDismiss();
+      dismissViews();
     }
   };
   const Transition = slots?.desktopTransition ?? reduceAnimations ? Fade : Grow;

package/internals/components/PickersToolbar.d.ts

@@ -1,14 +1,14 @@
 import * as React from 'react';
 import { BaseToolbarProps } from '../models/props/toolbar';
 import { PickersToolbarClasses } from './pickersToolbarClasses';
-import { DateOrTimeViewWithMeridiem, PickerValidValue } from '../models';
-export interface PickersToolbarProps<TValue extends PickerValidValue, TView extends DateOrTimeViewWithMeridiem> extends Pick<BaseToolbarProps<TValue, TView>, 'isLandscape' | 'hidden' | 'titleId'> {
+import { PickerValidValue } from '../models';
+export interface PickersToolbarProps<TValue extends PickerValidValue> extends Pick<BaseToolbarProps<TValue>, 'isLandscape' | 'hidden' | 'titleId'> {
     className?: string;
     landscapeDirection?: 'row' | 'column';
     toolbarTitle: React.ReactNode;
     classes?: Partial<PickersToolbarClasses>;
 }
-type PickersToolbarComponent = (<TValue extends PickerValidValue, TView extends DateOrTimeViewWithMeridiem>(props: React.PropsWithChildren<PickersToolbarProps<TValue, TView>> & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
+type PickersToolbarComponent = (<TValue extends PickerValidValue>(props: React.PropsWithChildren<PickersToolbarProps<TValue>> & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
     propTypes?: any;
 };
 export declare const PickersToolbar: PickersToolbarComponent;