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

package/legacy/YearPicker/PickersYear.js

@@ -0,0 +1,114 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _extends from "@babel/runtime/helpers/esm/extends";
+import * as React from 'react';
+import clsx from 'clsx';
+import { useForkRef, capitalize } from '@mui/material/utils';
+import { alpha, styled } from '@mui/material/styles';
+import { unstable_composeClasses as composeClasses, generateUtilityClass, generateUtilityClasses } from '@mui/material';
+import { WrapperVariantContext } from '../internals/components/wrappers/WrapperVariantContext';
+import { jsx as _jsx } from "react/jsx-runtime";
+export function getPickersYearUtilityClass(slot) {
+  return generateUtilityClass('PrivatePickersYear', slot);
+}
+export var pickersYearClasses = generateUtilityClasses('PrivatePickersYear', ['root', 'modeMobile', 'modeDesktop', 'yearButton', 'disabled', 'selected']);
+
+var useUtilityClasses = function useUtilityClasses(ownerState) {
+  var wrapperVariant = ownerState.wrapperVariant,
+      disabled = ownerState.disabled,
+      selected = ownerState.selected,
+      classes = ownerState.classes;
+  var slots = {
+    root: ['root', wrapperVariant && "mode".concat(capitalize(wrapperVariant))],
+    yearButton: ['yearButton', disabled && 'disabled', selected && 'selected']
+  };
+  return composeClasses(slots, getPickersYearUtilityClass, classes);
+};
+
+var PickersYearRoot = styled('div')(function (_ref) {
+  var ownerState = _ref.ownerState;
+  return _extends({
+    flexBasis: '33.3%',
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center'
+  }, (ownerState == null ? void 0 : ownerState.wrapperVariant) === 'desktop' && {
+    flexBasis: '25%'
+  });
+});
+var PickersYearButton = styled('button')(function (_ref2) {
+  var _extends2;
+
+  var theme = _ref2.theme;
+  return _extends({
+    color: 'unset',
+    backgroundColor: 'transparent',
+    border: 0,
+    outline: 0
+  }, theme.typography.subtitle1, (_extends2 = {
+    margin: '8px 0',
+    height: 36,
+    width: 72,
+    borderRadius: 18,
+    cursor: 'pointer',
+    '&:focus, &:hover': {
+      backgroundColor: alpha(theme.palette.action.active, theme.palette.action.hoverOpacity)
+    }
+  }, _defineProperty(_extends2, "&.".concat(pickersYearClasses.disabled), {
+    color: theme.palette.text.secondary
+  }), _defineProperty(_extends2, "&.".concat(pickersYearClasses.selected), {
+    color: theme.palette.primary.contrastText,
+    backgroundColor: theme.palette.primary.main,
+    '&:focus, &:hover': {
+      backgroundColor: theme.palette.primary.dark
+    }
+  }), _extends2));
+});
+/**
+ * @ignore - internal component.
+ */
+
+export var PickersYear = /*#__PURE__*/React.forwardRef(function PickersYear(props, forwardedRef) {
+  var autoFocus = props.autoFocus,
+      className = props.className,
+      children = props.children,
+      disabled = props.disabled,
+      _onClick = props.onClick,
+      _onKeyDown = props.onKeyDown,
+      selected = props.selected,
+      value = props.value;
+  var ref = React.useRef(null);
+  var refHandle = useForkRef(ref, forwardedRef);
+  var wrapperVariant = React.useContext(WrapperVariantContext);
+
+  var ownerState = _extends({}, props, {
+    wrapperVariant: wrapperVariant
+  });
+
+  var classes = useUtilityClasses(ownerState); // TODO: Can we just forward this to the button?
+
+  React.useEffect(function () {
+    if (autoFocus) {
+      // `ref.current` being `null` would be a bug in MUIu
+      ref.current.focus();
+    }
+  }, [autoFocus]);
+  return /*#__PURE__*/_jsx(PickersYearRoot, {
+    className: clsx(classes.root, className),
+    ownerState: ownerState,
+    children: /*#__PURE__*/_jsx(PickersYearButton, {
+      ref: refHandle,
+      disabled: disabled,
+      type: "button",
+      tabIndex: selected ? 0 : -1,
+      onClick: function onClick(event) {
+        return _onClick(event, value);
+      },
+      onKeyDown: function onKeyDown(event) {
+        return _onKeyDown(event, value);
+      },
+      className: classes.yearButton,
+      ownerState: ownerState,
+      children: children
+    })
+  });
+});

package/legacy/YearPicker/YearPicker.js

@@ -0,0 +1,193 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import { useTheme, styled, useThemeProps as useThemProps } from '@mui/material/styles';
+import { unstable_composeClasses as composeClasses } from '@mui/material';
+import clsx from 'clsx';
+import { PickersYear } from './PickersYear';
+import { useUtils, useNow } from '../internals/hooks/useUtils';
+import { findClosestEnabledDate } from '../internals/utils/date-utils';
+import { WrapperVariantContext } from '../internals/components/wrappers/WrapperVariantContext';
+import { getYearPickerUtilityClass } from './yearPickerClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+
+var useUtilityClasses = function useUtilityClasses(ownerState) {
+  var classes = ownerState.classes;
+  var slots = {
+    root: ['root']
+  };
+  return composeClasses(slots, getYearPickerUtilityClass, classes);
+};
+
+var YearPickerRoot = styled('div', {
+  name: 'MuiYearPicker',
+  slot: 'Root',
+  overridesResolver: function overridesResolver(props, styles) {
+    return styles.root;
+  }
+})({
+  display: 'flex',
+  flexDirection: 'row',
+  flexWrap: 'wrap',
+  overflowY: 'auto',
+  height: '100%',
+  margin: '0 4px'
+});
+export var YearPicker = /*#__PURE__*/React.forwardRef(function YearPicker(inProps, ref) {
+  var props = useThemProps({
+    props: inProps,
+    name: 'MuiYearPicker'
+  });
+  var autoFocus = props.autoFocus,
+      className = props.className,
+      date = props.date,
+      disabled = props.disabled,
+      disableFuture = props.disableFuture,
+      disablePast = props.disablePast,
+      isDateDisabled = props.isDateDisabled,
+      maxDate = props.maxDate,
+      minDate = props.minDate,
+      onChange = props.onChange,
+      onFocusedDayChange = props.onFocusedDayChange,
+      onYearChange = props.onYearChange,
+      readOnly = props.readOnly,
+      shouldDisableYear = props.shouldDisableYear;
+  var ownerState = props;
+  var classes = useUtilityClasses(ownerState);
+  var now = useNow();
+  var theme = useTheme();
+  var utils = useUtils();
+  var selectedDate = date || now;
+  var currentYear = utils.getYear(selectedDate);
+  var wrapperVariant = React.useContext(WrapperVariantContext);
+  var selectedYearRef = React.useRef(null);
+
+  var _React$useState = React.useState(currentYear),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      focusedYear = _React$useState2[0],
+      setFocusedYear = _React$useState2[1];
+
+  var handleYearSelection = function handleYearSelection(event, year) {
+    var isFinish = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'finish';
+
+    if (readOnly) {
+      return;
+    }
+
+    var submitDate = function submitDate(newDate) {
+      onChange(newDate, isFinish);
+
+      if (onFocusedDayChange) {
+        onFocusedDayChange(newDate || now);
+      }
+
+      if (onYearChange) {
+        onYearChange(newDate);
+      }
+    };
+
+    var newDate = utils.setYear(selectedDate, year);
+
+    if (isDateDisabled(newDate)) {
+      var closestEnabledDate = findClosestEnabledDate({
+        utils: utils,
+        date: newDate,
+        minDate: minDate,
+        maxDate: maxDate,
+        disablePast: Boolean(disablePast),
+        disableFuture: Boolean(disableFuture),
+        shouldDisableDate: isDateDisabled
+      });
+      submitDate(closestEnabledDate || now);
+    } else {
+      submitDate(newDate);
+    }
+  };
+
+  var focusYear = React.useCallback(function (year) {
+    if (!isDateDisabled(utils.setYear(selectedDate, year))) {
+      setFocusedYear(year);
+    }
+  }, [selectedDate, isDateDisabled, utils]);
+  var yearsInRow = wrapperVariant === 'desktop' ? 4 : 3;
+
+  var handleKeyDown = function handleKeyDown(event, year) {
+    switch (event.key) {
+      case 'ArrowUp':
+        focusYear(year - yearsInRow);
+        event.preventDefault();
+        break;
+
+      case 'ArrowDown':
+        focusYear(year + yearsInRow);
+        event.preventDefault();
+        break;
+
+      case 'ArrowLeft':
+        focusYear(year + (theme.direction === 'ltr' ? -1 : 1));
+        event.preventDefault();
+        break;
+
+      case 'ArrowRight':
+        focusYear(year + (theme.direction === 'ltr' ? 1 : -1));
+        event.preventDefault();
+        break;
+
+      default:
+        break;
+    }
+  };
+
+  return /*#__PURE__*/_jsx(YearPickerRoot, {
+    ref: ref,
+    className: clsx(classes.root, className),
+    ownerState: ownerState,
+    children: utils.getYearRange(minDate, maxDate).map(function (year) {
+      var yearNumber = utils.getYear(year);
+      var selected = yearNumber === currentYear;
+      return /*#__PURE__*/_jsx(PickersYear, {
+        selected: selected,
+        value: yearNumber,
+        onClick: handleYearSelection,
+        onKeyDown: handleKeyDown,
+        autoFocus: autoFocus && yearNumber === focusedYear,
+        ref: selected ? selectedYearRef : undefined,
+        disabled: disabled || disablePast && utils.isBeforeYear(year, now) || disableFuture && utils.isAfterYear(year, now) || shouldDisableYear && shouldDisableYear(year),
+        children: utils.format(year, 'year')
+      }, utils.format(year, 'year'));
+    })
+  });
+});
+process.env.NODE_ENV !== "production" ? YearPicker.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  autoFocus: PropTypes.bool,
+  classes: PropTypes.object,
+  className: PropTypes.string,
+  date: PropTypes.any,
+  disabled: PropTypes.bool,
+  disableFuture: PropTypes.bool,
+  disablePast: PropTypes.bool,
+  isDateDisabled: PropTypes.func.isRequired,
+  maxDate: PropTypes.any.isRequired,
+  minDate: PropTypes.any.isRequired,
+  onChange: PropTypes.func.isRequired,
+  onFocusedDayChange: PropTypes.func,
+
+  /**
+   * Callback firing on year change @DateIOType.
+   * @param {TDate} year The new year.
+   */
+  onYearChange: PropTypes.func,
+  readOnly: PropTypes.bool,
+
+  /**
+   * Disable specific years dynamically.
+   * Works like `shouldDisableDate` but for year selection view @DateIOType.
+   * @param {TDate} year The year to test.
+   * @returns {boolean} Return `true` if the year should be disabled.
+   */
+  shouldDisableYear: PropTypes.func
+} : void 0;

package/legacy/YearPicker/index.js

@@ -0,0 +1,2 @@
+export { YearPicker } from './YearPicker';
+export { yearPickerClasses, getYearPickerUtilityClass } from './yearPickerClasses';

package/legacy/YearPicker/yearPickerClasses.js

@@ -0,0 +1,5 @@
+import { generateUtilityClass, generateUtilityClasses } from '@mui/material';
+export function getYearPickerUtilityClass(slot) {
+  return generateUtilityClass('MuiYearPicker', slot);
+}
+export var yearPickerClasses = generateUtilityClasses('MuiYearPicker', ['root']);

package/legacy/index.js

@@ -0,0 +1,24 @@
+/** @license MUI v5.0.0-alpha.0
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+export * from './CalendarPicker';
+export * from './CalendarPickerSkeleton';
+export * from './ClockPicker';
+export * from './DatePicker';
+export * from './DateTimePicker';
+export * from './DesktopDatePicker';
+export * from './DesktopDateTimePicker';
+export * from './DesktopTimePicker';
+export * from './LocalizationProvider';
+export * from './MobileDatePicker';
+export * from './MobileDateTimePicker';
+export * from './MobileTimePicker';
+export * from './MonthPicker';
+export * from './PickersDay';
+export * from './StaticDatePicker';
+export * from './StaticDateTimePicker';
+export * from './StaticTimePicker';
+export * from './TimePicker';
+export * from './YearPicker';

package/legacy/internals/components/CalendarOrClockPicker/CalendarOrClockPicker.js

@@ -0,0 +1,133 @@
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+import _extends from "@babel/runtime/helpers/esm/extends";
+var _excluded = ["autoFocus", "className", "date", "DateInputProps", "isMobileKeyboardViewOpen", "onDateChange", "onViewChange", "openTo", "orientation", "showToolbar", "toggleMobileKeyboardView", "ToolbarComponent", "toolbarFormat", "toolbarPlaceholder", "toolbarTitle", "views"];
+import * as React from 'react';
+import { styled } from '@mui/material/styles';
+import { useViews } from '../../hooks/useViews';
+import { ClockPicker } from '../../../ClockPicker/ClockPicker';
+import { CalendarPicker } from '../../../CalendarPicker/CalendarPicker';
+import { KeyboardDateInput } from '../KeyboardDateInput';
+import { useIsLandscape } from '../../hooks/useIsLandscape';
+import { WrapperVariantContext } from '../wrappers/WrapperVariantContext';
+import { PickerViewRoot } from '../PickerViewRoot';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export var MobileKeyboardInputView = styled('div')({
+  padding: '16px 24px'
+});
+var PickerRoot = styled('div')(function (_ref) {
+  var ownerState = _ref.ownerState;
+  return _extends({
+    display: 'flex',
+    flexDirection: 'column'
+  }, ownerState.isLandscape && {
+    flexDirection: 'row'
+  });
+});
+var MobileKeyboardTextFieldProps = {
+  fullWidth: true
+};
+
+var isDatePickerView = function isDatePickerView(view) {
+  return view === 'year' || view === 'month' || view === 'day';
+};
+
+var isTimePickerView = function isTimePickerView(view) {
+  return view === 'hours' || view === 'minutes' || view === 'seconds';
+};
+
+export function CalendarOrClockPicker(props) {
+  var autoFocus = props.autoFocus,
+      className = props.className,
+      date = props.date,
+      DateInputProps = props.DateInputProps,
+      isMobileKeyboardViewOpen = props.isMobileKeyboardViewOpen,
+      onDateChange = props.onDateChange,
+      onViewChange = props.onViewChange,
+      openTo = props.openTo,
+      orientation = props.orientation,
+      showToolbar = props.showToolbar,
+      toggleMobileKeyboardView = props.toggleMobileKeyboardView,
+      _props$ToolbarCompone = props.ToolbarComponent,
+      ToolbarComponent = _props$ToolbarCompone === void 0 ? function () {
+    return null;
+  } : _props$ToolbarCompone,
+      toolbarFormat = props.toolbarFormat,
+      toolbarPlaceholder = props.toolbarPlaceholder,
+      toolbarTitle = props.toolbarTitle,
+      views = props.views,
+      other = _objectWithoutProperties(props, _excluded);
+
+  var isLandscape = useIsLandscape(views, orientation);
+  var wrapperVariant = React.useContext(WrapperVariantContext);
+  var toShowToolbar = typeof showToolbar === 'undefined' ? wrapperVariant !== 'desktop' : showToolbar;
+  var handleDateChange = React.useCallback(function (newDate, selectionState) {
+    onDateChange(newDate, wrapperVariant, selectionState);
+  }, [onDateChange, wrapperVariant]);
+  var handleViewChange = React.useCallback(function (newView) {
+    if (isMobileKeyboardViewOpen) {
+      toggleMobileKeyboardView();
+    }
+
+    if (onViewChange) {
+      onViewChange(newView);
+    }
+  }, [isMobileKeyboardViewOpen, onViewChange, toggleMobileKeyboardView]);
+
+  var _useViews = useViews({
+    view: undefined,
+    views: views,
+    openTo: openTo,
+    onChange: handleDateChange,
+    onViewChange: handleViewChange
+  }),
+      openView = _useViews.openView,
+      setOpenView = _useViews.setOpenView,
+      handleChangeAndOpenNext = _useViews.handleChangeAndOpenNext;
+
+  return /*#__PURE__*/_jsxs(PickerRoot, {
+    ownerState: {
+      isLandscape: isLandscape
+    },
+    children: [toShowToolbar && /*#__PURE__*/_jsx(ToolbarComponent, _extends({}, other, {
+      views: views,
+      isLandscape: isLandscape,
+      date: date,
+      onChange: handleDateChange,
+      setOpenView: setOpenView,
+      openView: openView,
+      toolbarTitle: toolbarTitle,
+      toolbarFormat: toolbarFormat,
+      toolbarPlaceholder: toolbarPlaceholder,
+      isMobileKeyboardViewOpen: isMobileKeyboardViewOpen,
+      toggleMobileKeyboardView: toggleMobileKeyboardView
+    })), /*#__PURE__*/_jsx(PickerViewRoot, {
+      children: isMobileKeyboardViewOpen ? /*#__PURE__*/_jsx(MobileKeyboardInputView, {
+        children: /*#__PURE__*/_jsx(KeyboardDateInput, _extends({}, DateInputProps, {
+          ignoreInvalidInputs: true,
+          disableOpenPicker: true,
+          TextFieldProps: MobileKeyboardTextFieldProps
+        }))
+      }) : /*#__PURE__*/_jsxs(React.Fragment, {
+        children: [isDatePickerView(openView) && /*#__PURE__*/_jsx(CalendarPicker, _extends({
+          autoFocus: autoFocus,
+          date: date,
+          onViewChange: setOpenView,
+          onChange: handleChangeAndOpenNext,
+          view: openView // Unclear why the predicate `isDatePickerView` does not imply the casted type
+          ,
+          views: views.filter(isDatePickerView)
+        }, other)), isTimePickerView(openView) && /*#__PURE__*/_jsx(ClockPicker, _extends({}, other, {
+          autoFocus: autoFocus,
+          date: date,
+          view: openView // Unclear why the predicate `isDatePickerView` does not imply the casted type
+          ,
+          views: views.filter(isTimePickerView),
+          onChange: handleChangeAndOpenNext,
+          onViewChange: setOpenView,
+          showViewSwitcher: wrapperVariant === 'desktop'
+        }))]
+      })
+    })]
+  });
+}

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

@@ -0,0 +1 @@
+export { CalendarOrClockPicker } from './CalendarOrClockPicker';

package/legacy/internals/components/KeyboardDateInput.js

@@ -0,0 +1,57 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["components", "disableOpenPicker", "getOpenDialogAriaText", "InputAdornmentProps", "InputProps", "inputRef", "openPicker", "OpenPickerButtonProps", "renderInput"];
+import * as React from 'react';
+import PropTypes from 'prop-types';
+import IconButton from '@mui/material/IconButton';
+import InputAdornment from '@mui/material/InputAdornment';
+import { useUtils } from '../hooks/useUtils';
+import { Calendar } from './icons';
+import { useMaskedInput } from '../hooks/useMaskedInput';
+import { getTextFieldAriaText } from '../utils/text-field-helper';
+import { jsx as _jsx } from "react/jsx-runtime";
+export var KeyboardDateInput = /*#__PURE__*/React.forwardRef(function KeyboardDateInput(props, ref) {
+  var _props$components = props.components,
+      components = _props$components === void 0 ? {} : _props$components,
+      disableOpenPicker = props.disableOpenPicker,
+      _props$getOpenDialogA = props.getOpenDialogAriaText,
+      getOpenDialogAriaText = _props$getOpenDialogA === void 0 ? getTextFieldAriaText : _props$getOpenDialogA,
+      InputAdornmentProps = props.InputAdornmentProps,
+      InputProps = props.InputProps,
+      inputRef = props.inputRef,
+      openPicker = props.openPicker,
+      OpenPickerButtonProps = props.OpenPickerButtonProps,
+      renderInput = props.renderInput,
+      other = _objectWithoutProperties(props, _excluded);
+
+  var utils = useUtils();
+  var textFieldProps = useMaskedInput(other);
+  var adornmentPosition = (InputAdornmentProps == null ? void 0 : InputAdornmentProps.position) || 'end';
+  var OpenPickerIcon = components.OpenPickerIcon || Calendar;
+  return renderInput(_extends({
+    ref: ref,
+    inputRef: inputRef
+  }, textFieldProps, {
+    InputProps: _extends({}, InputProps, _defineProperty({}, "".concat(adornmentPosition, "Adornment"), disableOpenPicker ? undefined : /*#__PURE__*/_jsx(InputAdornment, _extends({
+      position: adornmentPosition
+    }, InputAdornmentProps, {
+      children: /*#__PURE__*/_jsx(IconButton, _extends({
+        edge: adornmentPosition,
+        disabled: other.disabled || other.readOnly,
+        "aria-label": getOpenDialogAriaText(other.rawValue, utils)
+      }, OpenPickerButtonProps, {
+        onClick: openPicker,
+        children: /*#__PURE__*/_jsx(OpenPickerIcon, {})
+      }))
+    }))))
+  }));
+});
+process.env.NODE_ENV !== "production" ? KeyboardDateInput.propTypes = {
+  acceptRegex: PropTypes.instanceOf(RegExp),
+  getOpenDialogAriaText: PropTypes.func,
+  mask: PropTypes.string,
+  OpenPickerButtonProps: PropTypes.object,
+  renderInput: PropTypes.func.isRequired,
+  rifmFormatter: PropTypes.func
+} : void 0;

package/legacy/internals/components/PickerStaticWrapper/PickerStaticWrapper.js

@@ -0,0 +1,56 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["displayStaticWrapperAs"];
+import * as React from 'react';
+import { styled, useThemeProps } from '@mui/material/styles';
+import { unstable_composeClasses as composeClasses } from '@mui/material';
+import { DIALOG_WIDTH } from '../../constants/dimensions';
+import { WrapperVariantContext, IsStaticVariantContext } from '../wrappers/WrapperVariantContext';
+import { getStaticWrapperUtilityClass } from './pickerStaticWrapperClasses';
+import { jsx as _jsx } from "react/jsx-runtime";
+
+var useUtilityClasses = function useUtilityClasses(ownerState) {
+  var classes = ownerState.classes;
+  var slots = {
+    root: ['root']
+  };
+  return composeClasses(slots, getStaticWrapperUtilityClass, classes);
+};
+
+var PickerStaticWrapperRoot = styled('div', {
+  name: 'MuiPickerStaticWrapper',
+  slot: 'Root',
+  overridesResolver: function overridesResolver(props, styles) {
+    return styles.root;
+  }
+})(function (_ref) {
+  var theme = _ref.theme;
+  return {
+    overflow: 'hidden',
+    minWidth: DIALOG_WIDTH,
+    display: 'flex',
+    flexDirection: 'column',
+    backgroundColor: theme.palette.background.paper
+  };
+});
+export function PickerStaticWrapper(inProps) {
+  var props = useThemeProps({
+    props: inProps,
+    name: 'MuiPickerStaticWrapper'
+  });
+
+  var displayStaticWrapperAs = props.displayStaticWrapperAs,
+      other = _objectWithoutProperties(props, _excluded);
+
+  var classes = useUtilityClasses(props);
+  var isStatic = true;
+  return /*#__PURE__*/_jsx(IsStaticVariantContext.Provider, {
+    value: isStatic,
+    children: /*#__PURE__*/_jsx(WrapperVariantContext.Provider, {
+      value: displayStaticWrapperAs,
+      children: /*#__PURE__*/_jsx(PickerStaticWrapperRoot, _extends({
+        className: classes.root
+      }, other))
+    })
+  });
+}

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

@@ -0,0 +1,2 @@
+export { PickerStaticWrapper } from './PickerStaticWrapper';
+export { pickerStaticWrapperClasses, getStaticWrapperUtilityClass } from './pickerStaticWrapperClasses';

package/legacy/internals/components/PickerStaticWrapper/pickerStaticWrapperClasses.js

@@ -0,0 +1,5 @@
+import { generateUtilityClass, generateUtilityClasses } from '@mui/material';
+export function getStaticWrapperUtilityClass(slot) {
+  return generateUtilityClass('MuiPickerStaticWrapper', slot);
+}
+export var pickerStaticWrapperClasses = generateUtilityClasses('MuiPickerStaticWrapper', ['root']);

package/legacy/internals/components/PickerViewRoot/PickerViewRoot.js

@@ -0,0 +1,10 @@
+import { styled } from '@mui/material/styles';
+import { DIALOG_WIDTH, VIEW_HEIGHT } from '../../constants/dimensions';
+export var PickerViewRoot = styled('div')({
+  overflowX: 'hidden',
+  width: DIALOG_WIDTH,
+  maxHeight: VIEW_HEIGHT,
+  display: 'flex',
+  flexDirection: 'column',
+  margin: '0 auto'
+});

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

@@ -0,0 +1 @@
+export { PickerViewRoot } from './PickerViewRoot';