@mui/x-date-pickers 5.0.0-alpha.0

package/legacy/internals/components/icons/index.js

@@ -0,0 +1,68 @@
+import { createSvgIcon } from '@mui/material/utils';
+import * as React from 'react';
+/**
+ * @ignore - internal component.
+ */
+
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export var ArrowDropDown = createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M7 10l5 5 5-5z"
+}), 'ArrowDropDown');
+/**
+ * @ignore - internal component.
+ */
+
+export var ArrowLeft = createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M15.41 16.59L10.83 12l4.58-4.59L14 6l-6 6 6 6 1.41-1.41z"
+}), 'ArrowLeft');
+/**
+ * @ignore - internal component.
+ */
+
+export var ArrowRight = createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z"
+}), 'ArrowRight');
+/**
+ * @ignore - internal component.
+ */
+
+export var Calendar = createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M17 12h-5v5h5v-5zM16 1v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2h-1V1h-2zm3 18H5V8h14v11z"
+}), 'Calendar');
+/**
+ * @ignore - internal component.
+ */
+
+export var Clock = createSvgIcon( /*#__PURE__*/_jsxs(React.Fragment, {
+  children: [/*#__PURE__*/_jsx("path", {
+    d: "M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"
+  }), /*#__PURE__*/_jsx("path", {
+    d: "M12.5 7H11v6l5.25 3.15.75-1.23-4.5-2.67z"
+  })]
+}), 'Clock');
+/**
+ * @ignore - internal component.
+ */
+
+export var DateRange = createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M9 11H7v2h2v-2zm4 0h-2v2h2v-2zm4 0h-2v2h2v-2zm2-7h-1V2h-2v2H8V2H6v2H5c-1.11 0-1.99.9-1.99 2L3 20c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 16H5V9h14v11z"
+}), 'DateRange');
+/**
+ * @ignore - internal component.
+ */
+
+export var Pen = createSvgIcon( /*#__PURE__*/_jsx("path", {
+  d: "M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34a.9959.9959 0 00-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z"
+}), 'Pen');
+/**
+ * @ignore - internal component.
+ */
+
+export var Time = createSvgIcon( /*#__PURE__*/_jsxs(React.Fragment, {
+  children: [/*#__PURE__*/_jsx("path", {
+    d: "M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"
+  }), /*#__PURE__*/_jsx("path", {
+    d: "M12.5 7H11v6l5.25 3.15.75-1.23-4.5-2.67z"
+  })]
+}), 'Time');

package/legacy/internals/components/wrappers/DesktopTooltipWrapper.js

@@ -0,0 +1,50 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import { useForkRef } from '@mui/material/utils';
+import { WrapperVariantContext } from './WrapperVariantContext';
+import { executeInTheNextEventLoopTick } from '../../utils/utils';
+import { PickersPopper } from '../PickersPopper';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export function DesktopTooltipWrapper(props) {
+  var children = props.children,
+      DateInputProps = props.DateInputProps,
+      KeyboardDateInputComponent = props.KeyboardDateInputComponent,
+      onDismiss = props.onDismiss,
+      open = props.open,
+      PopperProps = props.PopperProps,
+      TransitionComponent = props.TransitionComponent;
+  var inputContainerRef = React.useRef(null);
+  var popperRef = React.useRef(null);
+
+  var handleBlur = function handleBlur() {
+    executeInTheNextEventLoopTick(function () {
+      var _inputContainerRef$cu, _popperRef$current;
+
+      if ((_inputContainerRef$cu = inputContainerRef.current) != null && _inputContainerRef$cu.contains(document.activeElement) || (_popperRef$current = popperRef.current) != null && _popperRef$current.contains(document.activeElement)) {
+        return;
+      }
+
+      onDismiss();
+    });
+  };
+
+  var inputComponentRef = useForkRef(DateInputProps.ref, inputContainerRef);
+  return /*#__PURE__*/_jsxs(WrapperVariantContext.Provider, {
+    value: "desktop",
+    children: [/*#__PURE__*/_jsx(KeyboardDateInputComponent, _extends({}, DateInputProps, {
+      ref: inputComponentRef,
+      onBlur: handleBlur
+    })), /*#__PURE__*/_jsx(PickersPopper, {
+      role: "tooltip",
+      open: open,
+      containerRef: popperRef,
+      anchorEl: inputContainerRef.current,
+      TransitionComponent: TransitionComponent,
+      PopperProps: PopperProps,
+      onBlur: handleBlur,
+      onClose: onDismiss,
+      children: children
+    })]
+  });
+}

package/legacy/internals/components/wrappers/DesktopWrapper.js

@@ -0,0 +1,40 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import { useForkRef } from '@mui/material/utils';
+import { WrapperVariantContext } from './WrapperVariantContext';
+import { PickersPopper } from '../PickersPopper';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export function DesktopWrapper(props) {
+  var children = props.children,
+      DateInputProps = props.DateInputProps,
+      KeyboardDateInputComponent = props.KeyboardDateInputComponent,
+      onDismiss = props.onDismiss,
+      open = props.open,
+      PopperProps = props.PopperProps,
+      PaperProps = props.PaperProps,
+      TransitionComponent = props.TransitionComponent,
+      onClear = props.onClear,
+      clearText = props.clearText,
+      clearable = props.clearable;
+  var ownInputRef = React.useRef(null);
+  var inputRef = useForkRef(DateInputProps.inputRef, ownInputRef);
+  return /*#__PURE__*/_jsxs(WrapperVariantContext.Provider, {
+    value: "desktop",
+    children: [/*#__PURE__*/_jsx(KeyboardDateInputComponent, _extends({}, DateInputProps, {
+      inputRef: inputRef
+    })), /*#__PURE__*/_jsx(PickersPopper, {
+      role: "dialog",
+      open: open,
+      anchorEl: ownInputRef.current,
+      TransitionComponent: TransitionComponent,
+      PopperProps: PopperProps,
+      PaperProps: PaperProps,
+      onClose: onDismiss,
+      onClear: onClear,
+      clearText: clearText,
+      clearable: clearable,
+      children: children
+    })]
+  });
+}

package/legacy/internals/components/wrappers/MobileWrapper.js

@@ -0,0 +1,45 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["cancelText", "children", "clearable", "clearText", "DateInputProps", "DialogProps", "okText", "onAccept", "onClear", "onDismiss", "onSetToday", "open", "PureDateInputComponent", "showTodayButton", "todayText"];
+import * as React from 'react';
+import { WrapperVariantContext } from './WrapperVariantContext';
+import { PickersModalDialog } from '../PickersModalDialog';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export function MobileWrapper(props) {
+  var cancelText = props.cancelText,
+      children = props.children,
+      clearable = props.clearable,
+      clearText = props.clearText,
+      DateInputProps = props.DateInputProps,
+      DialogProps = props.DialogProps,
+      okText = props.okText,
+      onAccept = props.onAccept,
+      onClear = props.onClear,
+      onDismiss = props.onDismiss,
+      onSetToday = props.onSetToday,
+      open = props.open,
+      PureDateInputComponent = props.PureDateInputComponent,
+      showTodayButton = props.showTodayButton,
+      todayText = props.todayText,
+      other = _objectWithoutProperties(props, _excluded);
+
+  return /*#__PURE__*/_jsxs(WrapperVariantContext.Provider, {
+    value: "mobile",
+    children: [/*#__PURE__*/_jsx(PureDateInputComponent, _extends({}, other, DateInputProps)), /*#__PURE__*/_jsx(PickersModalDialog, {
+      cancelText: cancelText,
+      clearable: clearable,
+      clearText: clearText,
+      DialogProps: DialogProps,
+      okText: okText,
+      onAccept: onAccept,
+      onClear: onClear,
+      onDismiss: onDismiss,
+      onSetToday: onSetToday,
+      open: open,
+      showTodayButton: showTodayButton,
+      todayText: todayText,
+      children: children
+    })]
+  });
+}

package/legacy/internals/components/wrappers/ResponsiveWrapper.js

@@ -0,0 +1,43 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["cancelText", "clearable", "clearText", "DateInputProps", "desktopModeMediaQuery", "DialogProps", "KeyboardDateInputComponent", "okText", "PopperProps", "PureDateInputComponent", "showTodayButton", "todayText", "TransitionComponent"];
+import * as React from 'react';
+import useMediaQuery from '@mui/material/useMediaQuery';
+import { MobileWrapper } from './MobileWrapper';
+import { DesktopTooltipWrapper } from './DesktopTooltipWrapper';
+import { jsx as _jsx } from "react/jsx-runtime";
+export function ResponsiveTooltipWrapper(props) {
+  var cancelText = props.cancelText,
+      clearable = props.clearable,
+      clearText = props.clearText,
+      DateInputProps = props.DateInputProps,
+      _props$desktopModeMed = props.desktopModeMediaQuery,
+      desktopModeMediaQuery = _props$desktopModeMed === void 0 ? '@media (pointer: fine)' : _props$desktopModeMed,
+      DialogProps = props.DialogProps,
+      KeyboardDateInputComponent = props.KeyboardDateInputComponent,
+      okText = props.okText,
+      PopperProps = props.PopperProps,
+      PureDateInputComponent = props.PureDateInputComponent,
+      showTodayButton = props.showTodayButton,
+      todayText = props.todayText,
+      TransitionComponent = props.TransitionComponent,
+      other = _objectWithoutProperties(props, _excluded);
+
+  var isDesktop = useMediaQuery(desktopModeMediaQuery);
+  return isDesktop ? /*#__PURE__*/_jsx(DesktopTooltipWrapper, _extends({
+    DateInputProps: DateInputProps,
+    KeyboardDateInputComponent: KeyboardDateInputComponent,
+    PopperProps: PopperProps,
+    TransitionComponent: TransitionComponent
+  }, other)) : /*#__PURE__*/_jsx(MobileWrapper, _extends({
+    cancelText: cancelText,
+    clearable: clearable,
+    clearText: clearText,
+    DateInputProps: DateInputProps,
+    DialogProps: DialogProps,
+    okText: okText,
+    PureDateInputComponent: PureDateInputComponent,
+    showTodayButton: showTodayButton,
+    todayText: todayText
+  }, other));
+}

package/legacy/internals/components/wrappers/WrapperProps.js

@@ -0,0 +1 @@
+export {};

package/legacy/internals/components/wrappers/WrapperVariantContext.js

@@ -0,0 +1,12 @@
+import * as React from 'react';
+
+/**
+ * TODO consider getting rid from wrapper variant
+ * @ignore - internal component.
+ */
+export var WrapperVariantContext = /*#__PURE__*/React.createContext(null);
+/**
+ * @ignore - internal component.
+ */
+
+export var IsStaticVariantContext = /*#__PURE__*/React.createContext(false);

package/legacy/internals/constants/dimensions.js

@@ -0,0 +1,4 @@
+export var DAY_SIZE = 36;
+export var DAY_MARGIN = 2;
+export var DIALOG_WIDTH = 320;
+export var VIEW_HEIGHT = 358;

package/legacy/internals/hooks/date-helpers-hooks.js

@@ -0,0 +1,35 @@
+import * as React from 'react';
+import { useUtils } from './useUtils';
+import { getMeridiem, convertToMeridiem } from '../utils/time-utils';
+export function useNextMonthDisabled(month, _ref) {
+  var disableFuture = _ref.disableFuture,
+      maxDate = _ref.maxDate;
+  var utils = useUtils();
+  return React.useMemo(function () {
+    var now = utils.date();
+    var lastEnabledMonth = utils.startOfMonth(disableFuture && utils.isBefore(now, maxDate) ? now : maxDate);
+    return !utils.isAfter(lastEnabledMonth, month);
+  }, [disableFuture, maxDate, month, utils]);
+}
+export function usePreviousMonthDisabled(month, _ref2) {
+  var disablePast = _ref2.disablePast,
+      minDate = _ref2.minDate;
+  var utils = useUtils();
+  return React.useMemo(function () {
+    var now = utils.date();
+    var firstEnabledMonth = utils.startOfMonth(disablePast && utils.isAfter(now, minDate) ? now : minDate);
+    return !utils.isBefore(firstEnabledMonth, month);
+  }, [disablePast, minDate, month, utils]);
+}
+export function useMeridiemMode(date, ampm, onChange) {
+  var utils = useUtils();
+  var meridiemMode = getMeridiem(date, utils);
+  var handleMeridiemChange = React.useCallback(function (mode) {
+    var timeWithMeridiem = convertToMeridiem(date, mode, Boolean(ampm), utils);
+    onChange(timeWithMeridiem, 'partial');
+  }, [ampm, date, onChange, utils]);
+  return {
+    meridiemMode: meridiemMode,
+    handleMeridiemChange: handleMeridiemChange
+  };
+}

package/legacy/internals/hooks/useIsLandscape.js

@@ -0,0 +1,47 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import * as React from 'react';
+import { unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';
+import { arrayIncludes } from '../utils/utils';
+
+function getOrientation() {
+  if (typeof window === 'undefined') {
+    return 'portrait';
+  }
+
+  if (window.screen && window.screen.orientation && window.screen.orientation.angle) {
+    return Math.abs(window.screen.orientation.angle) === 90 ? 'landscape' : 'portrait';
+  } // Support IOS safari
+
+
+  if (window.orientation) {
+    return Math.abs(Number(window.orientation)) === 90 ? 'landscape' : 'portrait';
+  }
+
+  return 'portrait';
+}
+
+export var useIsLandscape = function useIsLandscape(views, customOrientation) {
+  var _React$useState = React.useState(getOrientation),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      orientation = _React$useState2[0],
+      setOrientation = _React$useState2[1];
+
+  useEnhancedEffect(function () {
+    var eventHandler = function eventHandler() {
+      setOrientation(getOrientation());
+    };
+
+    window.addEventListener('orientationchange', eventHandler);
+    return function () {
+      window.removeEventListener('orientationchange', eventHandler);
+    };
+  }, []);
+
+  if (arrayIncludes(views, ['hours', 'minutes', 'seconds'])) {
+    // could not display 13:34:44 in landscape mode
+    return false;
+  }
+
+  var orientationToUse = customOrientation || orientation;
+  return orientationToUse === 'landscape';
+};

package/legacy/internals/hooks/useMaskedInput.js

@@ -0,0 +1,107 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import * as React from 'react';
+import { useRifm } from 'rifm';
+import { useUtils } from './useUtils';
+import { createDelegatedEventHandler } from '../utils/utils';
+import { maskedDateFormatter, getDisplayDate, checkMaskIsValidForCurrentFormat } from '../utils/text-field-helper';
+export var useMaskedInput = function useMaskedInput(_ref) {
+  var _ref$acceptRegex = _ref.acceptRegex,
+      acceptRegex = _ref$acceptRegex === void 0 ? /[\d]/gi : _ref$acceptRegex,
+      disabled = _ref.disabled,
+      disableMaskedInput = _ref.disableMaskedInput,
+      ignoreInvalidInputs = _ref.ignoreInvalidInputs,
+      inputFormat = _ref.inputFormat,
+      inputProps = _ref.inputProps,
+      label = _ref.label,
+      mask = _ref.mask,
+      onChange = _ref.onChange,
+      rawValue = _ref.rawValue,
+      readOnly = _ref.readOnly,
+      rifmFormatter = _ref.rifmFormatter,
+      TextFieldProps = _ref.TextFieldProps,
+      validationError = _ref.validationError;
+  var utils = useUtils();
+
+  var _React$useState = React.useState(false),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      isFocused = _React$useState2[0],
+      setIsFocused = _React$useState2[1];
+
+  var formatHelperText = utils.getFormatHelperText(inputFormat);
+  var shouldUseMaskedInput = React.useMemo(function () {
+    // formatting of dates is a quite slow thing, so do not make useless .format calls
+    if (!mask || disableMaskedInput) {
+      return false;
+    }
+
+    return checkMaskIsValidForCurrentFormat(mask, inputFormat, acceptRegex, utils);
+  }, [acceptRegex, disableMaskedInput, inputFormat, mask, utils]);
+  var formatter = React.useMemo(function () {
+    return shouldUseMaskedInput && mask ? maskedDateFormatter(mask, acceptRegex) : function (st) {
+      return st;
+    };
+  }, [acceptRegex, mask, shouldUseMaskedInput]); // TODO: Implement with controlled vs uncontrolled `rawValue`
+
+  var currentInputValue = getDisplayDate(utils, rawValue, inputFormat);
+
+  var _React$useState3 = React.useState(currentInputValue),
+      _React$useState4 = _slicedToArray(_React$useState3, 2),
+      innerInputValue = _React$useState4[0],
+      setInnerInputValue = _React$useState4[1];
+
+  var previousInputValueRef = React.useRef(currentInputValue);
+  React.useEffect(function () {
+    previousInputValueRef.current = currentInputValue;
+  }, [currentInputValue]);
+  var notTyping = !isFocused;
+  var valueChanged = previousInputValueRef.current !== currentInputValue; // Update the input value only if the value changed outside of typing
+
+  if (notTyping && valueChanged && (rawValue === null || utils.isValid(rawValue))) {
+    if (currentInputValue !== innerInputValue) {
+      setInnerInputValue(currentInputValue);
+    }
+  }
+
+  var handleChange = function handleChange(text) {
+    var finalString = text === '' || text === mask ? '' : text;
+    setInnerInputValue(finalString);
+    var date = finalString === null ? null : utils.parse(finalString, inputFormat);
+
+    if (ignoreInvalidInputs && !utils.isValid(date)) {
+      return;
+    }
+
+    onChange(date, finalString || undefined);
+  };
+
+  var rifmProps = useRifm({
+    value: innerInputValue,
+    onChange: handleChange,
+    format: rifmFormatter || formatter
+  });
+  var inputStateArgs = shouldUseMaskedInput ? rifmProps : {
+    value: innerInputValue,
+    onChange: function onChange(event) {
+      handleChange(event.currentTarget.value);
+    }
+  };
+  return _extends({
+    label: label,
+    disabled: disabled,
+    error: validationError,
+    inputProps: _extends({}, inputStateArgs, {
+      disabled: disabled,
+      placeholder: formatHelperText,
+      readOnly: readOnly,
+      type: shouldUseMaskedInput ? 'tel' : 'text'
+    }, inputProps, {
+      onFocus: createDelegatedEventHandler(function () {
+        setIsFocused(true);
+      }, inputProps == null ? void 0 : inputProps.onFocus),
+      onBlur: createDelegatedEventHandler(function () {
+        setIsFocused(false);
+      }, inputProps == null ? void 0 : inputProps.onBlur)
+    })
+  }, TextFieldProps);
+};

package/legacy/internals/hooks/useOpenState.js

@@ -0,0 +1,42 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import * as React from 'react';
+export var useOpenState = function useOpenState(_ref) {
+  var open = _ref.open,
+      onOpen = _ref.onOpen,
+      onClose = _ref.onClose;
+  var isControllingOpenProp = React.useRef(typeof open === 'boolean').current;
+
+  var _React$useState = React.useState(false),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      openState = _React$useState2[0],
+      setIsOpenState = _React$useState2[1]; // It is required to update inner state in useEffect in order to avoid situation when
+  // Our component is not mounted yet, but `open` state is set to `true` (e.g. initially opened)
+
+
+  React.useEffect(function () {
+    if (isControllingOpenProp) {
+      if (typeof open !== 'boolean') {
+        throw new Error('You must not mix controlling and uncontrolled mode for `open` prop');
+      }
+
+      setIsOpenState(open);
+    }
+  }, [isControllingOpenProp, open]);
+  var setIsOpen = React.useCallback(function (newIsOpen) {
+    if (!isControllingOpenProp) {
+      setIsOpenState(newIsOpen);
+    }
+
+    if (newIsOpen && onOpen) {
+      onOpen();
+    }
+
+    if (!newIsOpen && onClose) {
+      onClose();
+    }
+  }, [isControllingOpenProp, onOpen, onClose]);
+  return {
+    isOpen: openState,
+    setIsOpen: setIsOpen
+  };
+};

package/legacy/internals/hooks/usePickerState.js

@@ -0,0 +1,147 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import * as React from 'react';
+import { useOpenState } from './useOpenState';
+import { useUtils } from './useUtils';
+export var usePickerState = function usePickerState(props, valueManager) {
+  var disableCloseOnSelect = props.disableCloseOnSelect,
+      onAccept = props.onAccept,
+      onChange = props.onChange,
+      value = props.value;
+  var utils = useUtils();
+
+  var _useOpenState = useOpenState(props),
+      isOpen = _useOpenState.isOpen,
+      setIsOpen = _useOpenState.setIsOpen;
+
+  function initDraftableDate(date) {
+    return {
+      committed: date,
+      draft: date
+    };
+  }
+
+  var parsedDateValue = valueManager.parseInput(utils, value);
+
+  var _React$useReducer = React.useReducer(function (state, action) {
+    switch (action.type) {
+      case 'reset':
+        return initDraftableDate(action.payload);
+
+      case 'update':
+        return _extends({}, state, {
+          draft: action.payload
+        });
+
+      default:
+        return state;
+    }
+  }, parsedDateValue, initDraftableDate),
+      _React$useReducer2 = _slicedToArray(_React$useReducer, 2),
+      draftState = _React$useReducer2[0],
+      dispatch = _React$useReducer2[1];
+
+  if (!valueManager.areValuesEqual(utils, draftState.committed, parsedDateValue)) {
+    dispatch({
+      type: 'reset',
+      payload: parsedDateValue
+    });
+  }
+
+  var _React$useState = React.useState(draftState.committed),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      initialDate = _React$useState2[0],
+      setInitialDate = _React$useState2[1]; // Mobile keyboard view is a special case.
+  // When it's open picker should work like closed, cause we are just showing text field
+
+
+  var _React$useState3 = React.useState(false),
+      _React$useState4 = _slicedToArray(_React$useState3, 2),
+      isMobileKeyboardViewOpen = _React$useState4[0],
+      setMobileKeyboardViewOpen = _React$useState4[1];
+
+  var acceptDate = React.useCallback(function (acceptedDate, needClosePicker) {
+    onChange(acceptedDate);
+
+    if (needClosePicker) {
+      setIsOpen(false);
+      setInitialDate(acceptedDate);
+
+      if (onAccept) {
+        onAccept(acceptedDate);
+      }
+    }
+  }, [onAccept, onChange, setIsOpen]);
+  var wrapperProps = React.useMemo(function () {
+    return {
+      open: isOpen,
+      onClear: function onClear() {
+        return acceptDate(valueManager.emptyValue, true);
+      },
+      onAccept: function onAccept() {
+        return acceptDate(draftState.draft, true);
+      },
+      onDismiss: function onDismiss() {
+        return acceptDate(initialDate, true);
+      },
+      onSetToday: function onSetToday() {
+        var now = utils.date();
+        dispatch({
+          type: 'update',
+          payload: now
+        });
+        acceptDate(now, !disableCloseOnSelect);
+      }
+    };
+  }, [acceptDate, disableCloseOnSelect, isOpen, utils, draftState.draft, valueManager.emptyValue, initialDate]);
+  var pickerProps = React.useMemo(function () {
+    return {
+      date: draftState.draft,
+      isMobileKeyboardViewOpen: isMobileKeyboardViewOpen,
+      toggleMobileKeyboardView: function toggleMobileKeyboardView() {
+        return setMobileKeyboardViewOpen(!isMobileKeyboardViewOpen);
+      },
+      onDateChange: function onDateChange(newDate, wrapperVariant) {
+        var selectionState = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'partial';
+        dispatch({
+          type: 'update',
+          payload: newDate
+        });
+
+        if (selectionState === 'partial') {
+          acceptDate(newDate, false);
+        }
+
+        if (selectionState === 'finish') {
+          var shouldCloseOnSelect = !(disableCloseOnSelect != null ? disableCloseOnSelect : wrapperVariant === 'mobile');
+          acceptDate(newDate, shouldCloseOnSelect);
+        } // if selectionState === "shallow" do nothing (we already update the draft state)
+
+      }
+    };
+  }, [acceptDate, disableCloseOnSelect, isMobileKeyboardViewOpen, draftState.draft]);
+  var inputProps = React.useMemo(function () {
+    return {
+      onChange: onChange,
+      open: isOpen,
+      rawValue: value,
+      openPicker: function openPicker() {
+        return setIsOpen(true);
+      }
+    };
+  }, [onChange, isOpen, value, setIsOpen]);
+  var pickerState = {
+    pickerProps: pickerProps,
+    inputProps: inputProps,
+    wrapperProps: wrapperProps
+  };
+  React.useDebugValue(pickerState, function () {
+    return {
+      MuiPickerState: {
+        pickerDraft: draftState,
+        other: pickerState
+      }
+    };
+  });
+  return pickerState;
+};

package/legacy/internals/hooks/useUtils.js

@@ -0,0 +1,24 @@
+import * as React from 'react';
+import { MuiPickersAdapterContext } from '../../LocalizationProvider/LocalizationProvider';
+
+var useLocalizationContext = function useLocalizationContext() {
+  var localization = React.useContext(MuiPickersAdapterContext);
+
+  if (localization === null) {
+    throw new Error('MUI: Can not find utils in context. It looks like you forgot to wrap your component in LocalizationProvider, or pass dateAdapter prop directly.');
+  }
+
+  return localization;
+};
+
+export var useUtils = function useUtils() {
+  return useLocalizationContext().utils;
+};
+export var useDefaultDates = function useDefaultDates() {
+  return useLocalizationContext().defaultDates;
+};
+export var useNow = function useNow() {
+  var utils = useUtils();
+  var now = React.useRef(utils.date());
+  return now.current;
+};