@mui/lab 5.0.0-alpha.74 → 5.0.0-alpha.77

package/legacy/CalendarPicker/PickersFadeTransitionGroup.js

@@ -1,44 +0,0 @@
-import * as React from 'react';
-import clsx from 'clsx';
-import Fade from '@mui/material/Fade';
-import { styled } from '@mui/material/styles';
-import { generateUtilityClasses } from '@mui/base';
-import { TransitionGroup } from 'react-transition-group';
-import { jsx as _jsx } from "react/jsx-runtime";
-var classes = generateUtilityClasses('PrivatePickersFadeTransitionGroup', ['root']);
-var animationDuration = 500;
-var PickersFadeTransitionGroupRoot = styled(TransitionGroup)({
-  display: 'block',
-  position: 'relative'
-});
-/**
- * @ignore - do not document.
- */
-
-var PickersFadeTransitionGroup = function PickersFadeTransitionGroup(_ref) {
-  var children = _ref.children,
-      className = _ref.className,
-      reduceAnimations = _ref.reduceAnimations,
-      transKey = _ref.transKey;
-
-  if (reduceAnimations) {
-    return children;
-  }
-
-  return /*#__PURE__*/_jsx(PickersFadeTransitionGroupRoot, {
-    className: clsx(classes.root, className),
-    children: /*#__PURE__*/_jsx(Fade, {
-      appear: false,
-      mountOnEnter: true,
-      unmountOnExit: true,
-      timeout: {
-        appear: animationDuration,
-        enter: animationDuration / 2,
-        exit: 0
-      },
-      children: children
-    }, transKey)
-  });
-};
-
-export default PickersFadeTransitionGroup;

package/legacy/CalendarPicker/PickersSlideTransition.js

@@ -1,98 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import * as React from 'react';
-import clsx from 'clsx';
-import { styled } from '@mui/material/styles';
-import { generateUtilityClasses } from '@mui/base';
-import { CSSTransition, TransitionGroup } from 'react-transition-group';
-import { jsx as _jsx } from "react/jsx-runtime";
-var classes = generateUtilityClasses('PrivatePickersSlideTransition', ['root', 'slideEnter-left', 'slideEnter-right', 'slideEnterActive', 'slideEnterActive', 'slideExit', 'slideExitActiveLeft-left', 'slideExitActiveLeft-right']);
-export var slideAnimationDuration = 350;
-var PickersSlideTransitionRoot = styled(TransitionGroup)(function (_ref) {
-  var _ref2;
-
-  var theme = _ref.theme;
-  var slideTransition = theme.transitions.create('transform', {
-    duration: slideAnimationDuration,
-    easing: 'cubic-bezier(0.35, 0.8, 0.4, 1)'
-  });
-  return _ref2 = {
-    display: 'block',
-    position: 'relative',
-    overflowX: 'hidden',
-    '& > *': {
-      position: 'absolute',
-      top: 0,
-      right: 0,
-      left: 0
-    }
-  }, _defineProperty(_ref2, "& .".concat(classes['slideEnter-left']), {
-    willChange: 'transform',
-    transform: 'translate(100%)',
-    zIndex: 1
-  }), _defineProperty(_ref2, "& .".concat(classes['slideEnter-right']), {
-    willChange: 'transform',
-    transform: 'translate(-100%)',
-    zIndex: 1
-  }), _defineProperty(_ref2, "& .".concat(classes.slideEnterActive), {
-    transform: 'translate(0%)',
-    transition: slideTransition
-  }), _defineProperty(_ref2, "& .".concat(classes.slideExit), {
-    transform: 'translate(0%)'
-  }), _defineProperty(_ref2, "& .".concat(classes['slideExitActiveLeft-left']), {
-    willChange: 'transform',
-    transform: 'translate(-100%)',
-    transition: slideTransition,
-    zIndex: 0
-  }), _defineProperty(_ref2, "& .".concat(classes['slideExitActiveLeft-right']), {
-    willChange: 'transform',
-    transform: 'translate(100%)',
-    transition: slideTransition,
-    zIndex: 0
-  }), _ref2;
-});
-/**
- * @ignore - do not document.
- */
-
-var PickersSlideTransition = function PickersSlideTransition(_ref3) {
-  var children = _ref3.children,
-      className = _ref3.className,
-      reduceAnimations = _ref3.reduceAnimations,
-      slideDirection = _ref3.slideDirection,
-      transKey = _ref3.transKey,
-      other = _objectWithoutProperties(_ref3, ["children", "className", "reduceAnimations", "slideDirection", "transKey"]);
-
-  if (reduceAnimations) {
-    return /*#__PURE__*/_jsx("div", {
-      className: clsx(classes.root, className),
-      children: children
-    });
-  }
-
-  var transitionClasses = {
-    exit: classes.slideExit,
-    enterActive: classes.slideEnterActive,
-    enter: classes["slideEnter-".concat(slideDirection)],
-    exitActive: classes["slideExitActiveLeft-".concat(slideDirection)]
-  };
-  return /*#__PURE__*/_jsx(PickersSlideTransitionRoot, {
-    className: clsx(classes.root, className),
-    childFactory: function childFactory(element) {
-      return /*#__PURE__*/React.cloneElement(element, {
-        classNames: transitionClasses
-      });
-    },
-    children: /*#__PURE__*/_jsx(CSSTransition, _extends({
-      mountOnEnter: true,
-      unmountOnExit: true,
-      timeout: slideAnimationDuration,
-      classNames: transitionClasses
-    }, other, {
-      children: children
-    }), transKey)
-  });
-};
-
-export default PickersSlideTransition;

package/legacy/CalendarPicker/shared.js

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

package/legacy/CalendarPicker/useCalendarState.js

@@ -1,118 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import * as React from 'react';
-import { validateDate } from '../internal/pickers/date-utils';
-import { useUtils, useNow } from '../internal/pickers/hooks/useUtils';
-export var createCalendarStateReducer = function createCalendarStateReducer(reduceAnimations, disableSwitchToMonthOnDayFocus, utils) {
-  return function (state, action) {
-    switch (action.type) {
-      case 'changeMonth':
-        return _extends({}, state, {
-          slideDirection: action.direction,
-          currentMonth: action.newMonth,
-          isMonthSwitchingAnimating: !reduceAnimations
-        });
-
-      case 'finishMonthSwitchingAnimation':
-        return _extends({}, state, {
-          isMonthSwitchingAnimating: false
-        });
-
-      case 'changeFocusedDay':
-        {
-          if (state.focusedDay !== null && utils.isSameDay(action.focusedDay, state.focusedDay)) {
-            return state;
-          }
-
-          var needMonthSwitch = Boolean(action.focusedDay) && !disableSwitchToMonthOnDayFocus && !utils.isSameMonth(state.currentMonth, action.focusedDay);
-          return _extends({}, state, {
-            focusedDay: action.focusedDay,
-            isMonthSwitchingAnimating: needMonthSwitch && !reduceAnimations,
-            currentMonth: needMonthSwitch ? utils.startOfMonth(action.focusedDay) : state.currentMonth,
-            slideDirection: utils.isAfterDay(action.focusedDay, state.currentMonth) ? 'left' : 'right'
-          });
-        }
-
-      default:
-        throw new Error('missing support');
-    }
-  };
-};
-export function useCalendarState(_ref) {
-  var _ref2;
-
-  var date = _ref.date,
-      defaultCalendarMonth = _ref.defaultCalendarMonth,
-      disableFuture = _ref.disableFuture,
-      disablePast = _ref.disablePast,
-      _ref$disableSwitchToM = _ref.disableSwitchToMonthOnDayFocus,
-      disableSwitchToMonthOnDayFocus = _ref$disableSwitchToM === void 0 ? false : _ref$disableSwitchToM,
-      maxDate = _ref.maxDate,
-      minDate = _ref.minDate,
-      onMonthChange = _ref.onMonthChange,
-      reduceAnimations = _ref.reduceAnimations,
-      shouldDisableDate = _ref.shouldDisableDate;
-  var now = useNow();
-  var utils = useUtils();
-  var reducerFn = React.useRef(createCalendarStateReducer(Boolean(reduceAnimations), disableSwitchToMonthOnDayFocus, utils)).current;
-
-  var _React$useReducer = React.useReducer(reducerFn, {
-    isMonthSwitchingAnimating: false,
-    focusedDay: date || now,
-    currentMonth: utils.startOfMonth((_ref2 = date != null ? date : defaultCalendarMonth) != null ? _ref2 : now),
-    slideDirection: 'left'
-  }),
-      calendarState = _React$useReducer[0],
-      dispatch = _React$useReducer[1];
-
-  var handleChangeMonth = React.useCallback(function (payload) {
-    dispatch(_extends({
-      type: 'changeMonth'
-    }, payload));
-
-    if (onMonthChange) {
-      onMonthChange(payload.newMonth);
-    }
-  }, [onMonthChange]);
-  var changeMonth = React.useCallback(function (newDate) {
-    var newDateRequested = newDate != null ? newDate : now;
-
-    if (utils.isSameMonth(newDateRequested, calendarState.currentMonth)) {
-      return;
-    }
-
-    handleChangeMonth({
-      newMonth: utils.startOfMonth(newDateRequested),
-      direction: utils.isAfterDay(newDateRequested, calendarState.currentMonth) ? 'left' : 'right'
-    });
-  }, [calendarState.currentMonth, handleChangeMonth, now, utils]);
-  var isDateDisabled = React.useCallback(function (day) {
-    return validateDate(utils, day, {
-      disablePast: disablePast,
-      disableFuture: disableFuture,
-      minDate: minDate,
-      maxDate: maxDate,
-      shouldDisableDate: shouldDisableDate
-    }) !== null;
-  }, [disableFuture, disablePast, maxDate, minDate, shouldDisableDate, utils]);
-  var onMonthSwitchingAnimationEnd = React.useCallback(function () {
-    dispatch({
-      type: 'finishMonthSwitchingAnimation'
-    });
-  }, []);
-  var changeFocusedDay = React.useCallback(function (newFocusedDate) {
-    if (!isDateDisabled(newFocusedDate)) {
-      dispatch({
-        type: 'changeFocusedDay',
-        focusedDay: newFocusedDate
-      });
-    }
-  }, [isDateDisabled]);
-  return {
-    calendarState: calendarState,
-    changeMonth: changeMonth,
-    changeFocusedDay: changeFocusedDay,
-    isDateDisabled: isDateDisabled,
-    onMonthSwitchingAnimationEnd: onMonthSwitchingAnimationEnd,
-    handleChangeMonth: handleChangeMonth
-  };
-}

package/legacy/CalendarPickerSkeleton/CalendarPickerSkeleton.js

@@ -1,155 +0,0 @@
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-import _extends from "@babel/runtime/helpers/esm/extends";
-import * as React from 'react';
-import PropTypes from 'prop-types';
-import clsx from 'clsx';
-import Skeleton from '@mui/material/Skeleton';
-import { styled, useThemeProps } from '@mui/material/styles';
-import { unstable_composeClasses as composeClasses, generateUtilityClass, generateUtilityClasses } from '@mui/base';
-import { DAY_SIZE, DAY_MARGIN } from '../internal/pickers/constants/dimensions';
-import { jsx as _jsx } from "react/jsx-runtime";
-export function getCalendarPickerSkeletonUtilityClass(slot) {
-  return generateUtilityClass('MuiCalendarPickerSkeleton', slot);
-}
-export var calendarPickerSkeletonClasses = generateUtilityClasses('MuiCalendarPickerSkeleton', ['root', 'week', 'daySkeleton']);
-
-var useUtilityClasses = function useUtilityClasses(ownerState) {
-  var classes = ownerState.classes;
-  var slots = {
-    root: ['root'],
-    week: ['week'],
-    daySkeleton: ['daySkeleton']
-  };
-  return composeClasses(slots, getCalendarPickerSkeletonUtilityClass, classes);
-};
-
-var CalendarPickerSkeletonRoot = styled('div', {
-  name: 'MuiCalendarPickerSkeleton',
-  slot: 'Root',
-  overridesResolver: function overridesResolver(props, styles) {
-    return styles.root;
-  }
-})({
-  alignSelf: 'start'
-});
-var CalendarPickerSkeletonWeek = styled('div', {
-  name: 'MuiCalendarPickerSkeleton',
-  slot: 'Week',
-  overridesResolver: function overridesResolver(props, styles) {
-    return styles.week;
-  }
-})({
-  margin: "".concat(DAY_MARGIN, "px 0"),
-  display: 'flex',
-  justifyContent: 'center'
-});
-var CalendarPickerSkeletonDay = styled(Skeleton, {
-  name: 'MuiCalendarPickerSkeleton',
-  slot: 'Day',
-  overridesResolver: function overridesResolver(props, styles) {
-    return styles.daySkeleton;
-  }
-})(function (_ref) {
-  var ownerState = _ref.ownerState;
-  return _extends({
-    margin: "0 ".concat(DAY_MARGIN, "px")
-  }, ownerState.day === 0 && {
-    visibility: 'hidden'
-  });
-});
-process.env.NODE_ENV !== "production" ? CalendarPickerSkeletonDay.propTypes
-/* remove-proptypes */
-= {
-  // ----------------------------- Warning --------------------------------
-  // | These PropTypes are generated from the TypeScript type definitions |
-  // |     To update them edit TypeScript types and run "yarn proptypes"  |
-  // ----------------------------------------------------------------------
-
-  /**
-   * Optional children to infer width and height from.
-   */
-  children: PropTypes.node,
-
-  /**
-   * @ignore
-   */
-  ownerState: PropTypes.object
-} : void 0;
-var monthMap = [[0, 1, 1, 1, 1, 1, 1], [1, 1, 1, 1, 1, 1, 1], [1, 1, 1, 1, 1, 1, 1], [1, 1, 1, 1, 1, 1, 1], [1, 1, 1, 1, 0, 0, 0]];
-/**
- *
- * Demos:
- *
- * - [Date Picker](https://mui.com/components/date-picker/)
- *
- * API:
- *
- * - [CalendarPickerSkeleton API](https://mui.com/api/calendar-picker-skeleton/)
- */
-
-function CalendarPickerSkeleton(props) {
-  var _useThemeProps = useThemeProps({
-    props: props,
-    name: 'MuiCalendarPickerSkeleton'
-  }),
-      className = _useThemeProps.className,
-      other = _objectWithoutProperties(_useThemeProps, ["className"]);
-
-  var classes = useUtilityClasses(props);
-  return /*#__PURE__*/_jsx(CalendarPickerSkeletonRoot, _extends({
-    className: clsx(classes.root, className)
-  }, other, {
-    children: monthMap.map(function (week, index) {
-      return /*#__PURE__*/_jsx(CalendarPickerSkeletonWeek, {
-        className: classes.week,
-        children: week.map(function (day, index2) {
-          return /*#__PURE__*/_jsx(CalendarPickerSkeletonDay, {
-            variant: "circular",
-            width: DAY_SIZE,
-            height: DAY_SIZE,
-            className: classes.daySkeleton,
-            ownerState: {
-              day: day
-            }
-          }, index2);
-        })
-      }, index);
-    })
-  }));
-}
-/**
- *
- * Demos:
- *
- * - [Date Picker](https://mui.com/components/date-picker/)
- *
- * API:
- *
- * - [CalendarPickerSkeleton API](https://mui.com/api/calendar-picker-skeleton/)
- */
-
-
-process.env.NODE_ENV !== "production" ? CalendarPickerSkeleton.propTypes
-/* remove-proptypes */
-= {
-  // ----------------------------- Warning --------------------------------
-  // | These PropTypes are generated from the TypeScript type definitions |
-  // |     To update them edit TypeScript types and run "yarn proptypes"  |
-  // ----------------------------------------------------------------------
-
-  /**
-   * @ignore
-   */
-  children: PropTypes.node,
-
-  /**
-   * Override or extend the styles applied to the component.
-   */
-  classes: PropTypes.object,
-
-  /**
-   * 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])
-} : void 0;
-export default CalendarPickerSkeleton;

package/legacy/ClockPicker/Clock.js

@@ -1,273 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-
-var _ClockPin, _Typography, _Typography2;
-
-import * as React from 'react';
-import IconButton from '@mui/material/IconButton';
-import Typography from '@mui/material/Typography';
-import { styled } from '@mui/material/styles';
-import { unstable_useEnhancedEffect as useEnhancedEffect } from '@mui/utils';
-import ClockPointer from './ClockPointer';
-import { useUtils } from '../internal/pickers/hooks/useUtils';
-import { WrapperVariantContext } from '../internal/pickers/wrappers/WrapperVariantContext';
-import { getHours, getMinutes } from './shared';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-var ClockRoot = styled('div')(function (_ref) {
-  var theme = _ref.theme;
-  return {
-    display: 'flex',
-    justifyContent: 'center',
-    alignItems: 'center',
-    margin: theme.spacing(2)
-  };
-});
-var ClockClock = styled('div')({
-  backgroundColor: 'rgba(0,0,0,.07)',
-  borderRadius: '50%',
-  height: 220,
-  width: 220,
-  flexShrink: 0,
-  position: 'relative',
-  pointerEvents: 'none'
-});
-var ClockSquareMask = styled('div')({
-  width: '100%',
-  height: '100%',
-  position: 'absolute',
-  pointerEvents: 'auto',
-  outline: 0,
-  // Disable scroll capabilities.
-  touchAction: 'none',
-  userSelect: 'none',
-  '@media (pointer: fine)': {
-    cursor: 'pointer',
-    borderRadius: '50%'
-  },
-  '&:active': {
-    cursor: 'move'
-  }
-});
-var ClockPin = styled('div')(function (_ref2) {
-  var theme = _ref2.theme;
-  return {
-    width: 6,
-    height: 6,
-    borderRadius: '50%',
-    backgroundColor: theme.palette.primary.main,
-    position: 'absolute',
-    top: '50%',
-    left: '50%',
-    transform: 'translate(-50%, -50%)'
-  };
-});
-var ClockAmButton = styled(IconButton)(function (_ref3) {
-  var theme = _ref3.theme,
-      ownerState = _ref3.ownerState;
-  return _extends({
-    zIndex: 1,
-    position: 'absolute',
-    bottom: ownerState.ampmInClock ? 64 : 8,
-    left: 8
-  }, ownerState.meridiemMode === 'am' && {
-    backgroundColor: theme.palette.primary.main,
-    color: theme.palette.primary.contrastText,
-    '&:hover': {
-      backgroundColor: theme.palette.primary.light
-    }
-  });
-});
-var ClockPmButton = styled(IconButton)(function (_ref4) {
-  var theme = _ref4.theme,
-      ownerState = _ref4.ownerState;
-  return _extends({
-    zIndex: 1,
-    position: 'absolute',
-    bottom: ownerState.ampmInClock ? 64 : 8,
-    right: 8
-  }, ownerState.meridiemMode === 'pm' && {
-    backgroundColor: theme.palette.primary.main,
-    color: theme.palette.primary.contrastText,
-    '&:hover': {
-      backgroundColor: theme.palette.primary.light
-    }
-  });
-});
-/**
- * @ignore - internal component.
- */
-
-function Clock(props) {
-  var ampm = props.ampm,
-      ampmInClock = props.ampmInClock,
-      autoFocus = props.autoFocus,
-      children = props.children,
-      date = props.date,
-      getClockLabelText = props.getClockLabelText,
-      handleMeridiemChange = props.handleMeridiemChange,
-      isTimeDisabled = props.isTimeDisabled,
-      meridiemMode = props.meridiemMode,
-      _props$minutesStep = props.minutesStep,
-      minutesStep = _props$minutesStep === void 0 ? 1 : _props$minutesStep,
-      onChange = props.onChange,
-      selectedId = props.selectedId,
-      type = props.type,
-      value = props.value;
-  var ownerState = props;
-  var utils = useUtils();
-  var wrapperVariant = React.useContext(WrapperVariantContext);
-  var isMoving = React.useRef(false);
-  var isSelectedTimeDisabled = isTimeDisabled(value, type);
-  var isPointerInner = !ampm && type === 'hours' && (value < 1 || value > 12);
-
-  var handleValueChange = function handleValueChange(newValue, isFinish) {
-    if (isTimeDisabled(newValue, type)) {
-      return;
-    }
-
-    onChange(newValue, isFinish);
-  };
-
-  var setTime = function setTime(event, isFinish) {
-    var _ref5 = event,
-        offsetX = _ref5.offsetX,
-        offsetY = _ref5.offsetY;
-
-    if (offsetX === undefined) {
-      var rect = event.target.getBoundingClientRect();
-      offsetX = event.changedTouches[0].clientX - rect.left;
-      offsetY = event.changedTouches[0].clientY - rect.top;
-    }
-
-    var newSelectedValue = type === 'seconds' || type === 'minutes' ? getMinutes(offsetX, offsetY, minutesStep) : getHours(offsetX, offsetY, Boolean(ampm));
-    handleValueChange(newSelectedValue, isFinish);
-  };
-
-  var handleTouchMove = function handleTouchMove(event) {
-    isMoving.current = true;
-    setTime(event, 'shallow');
-  };
-
-  var handleTouchEnd = function handleTouchEnd(event) {
-    if (isMoving.current) {
-      setTime(event, 'finish');
-      isMoving.current = false;
-    }
-  };
-
-  var handleMouseMove = function handleMouseMove(event) {
-    // event.buttons & PRIMARY_MOUSE_BUTTON
-    if (event.buttons > 0) {
-      setTime(event.nativeEvent, 'shallow');
-    }
-  };
-
-  var handleMouseUp = function handleMouseUp(event) {
-    if (isMoving.current) {
-      isMoving.current = false;
-    }
-
-    setTime(event.nativeEvent, 'finish');
-  };
-
-  var hasSelected = React.useMemo(function () {
-    if (type === 'hours') {
-      return true;
-    }
-
-    return value % 5 === 0;
-  }, [type, value]);
-  var keyboardControlStep = type === 'minutes' ? minutesStep : 1;
-  var listboxRef = React.useRef(null); // Since this is rendered when a Popper is opened we can't use passive effects.
-  // Focusing in passive effects in Popper causes scroll jump.
-
-  useEnhancedEffect(function () {
-    if (autoFocus) {
-      // The ref not being resolved would be a bug in MUI.
-      listboxRef.current.focus();
-    }
-  }, [autoFocus]);
-
-  var handleKeyDown = function handleKeyDown(event) {
-    // TODO: Why this early exit?
-    if (isMoving.current) {
-      return;
-    }
-
-    switch (event.key) {
-      case 'Home':
-        // annulate both hours and minutes
-        handleValueChange(0, 'partial');
-        event.preventDefault();
-        break;
-
-      case 'End':
-        handleValueChange(type === 'minutes' ? 59 : 23, 'partial');
-        event.preventDefault();
-        break;
-
-      case 'ArrowUp':
-        handleValueChange(value + keyboardControlStep, 'partial');
-        event.preventDefault();
-        break;
-
-      case 'ArrowDown':
-        handleValueChange(value - keyboardControlStep, 'partial');
-        event.preventDefault();
-        break;
-
-      default: // do nothing
-
-    }
-  };
-
-  return /*#__PURE__*/_jsxs(ClockRoot, {
-    children: [/*#__PURE__*/_jsxs(ClockClock, {
-      children: [/*#__PURE__*/_jsx(ClockSquareMask, {
-        onTouchMove: handleTouchMove,
-        onTouchEnd: handleTouchEnd,
-        onMouseUp: handleMouseUp,
-        onMouseMove: handleMouseMove
-      }), !isSelectedTimeDisabled && /*#__PURE__*/_jsxs(React.Fragment, {
-        children: [_ClockPin || (_ClockPin = /*#__PURE__*/_jsx(ClockPin, {})), date && /*#__PURE__*/_jsx(ClockPointer, {
-          type: type,
-          value: value,
-          isInner: isPointerInner,
-          hasSelected: hasSelected
-        })]
-      }), /*#__PURE__*/_jsx("div", {
-        "aria-activedescendant": selectedId,
-        "aria-label": getClockLabelText(type, date, utils),
-        ref: listboxRef,
-        role: "listbox",
-        onKeyDown: handleKeyDown,
-        tabIndex: 0,
-        children: children
-      })]
-    }), ampm && (wrapperVariant === 'desktop' || ampmInClock) && /*#__PURE__*/_jsxs(React.Fragment, {
-      children: [/*#__PURE__*/_jsx(ClockAmButton, {
-        onClick: function onClick() {
-          return handleMeridiemChange('am');
-        },
-        disabled: meridiemMode === null,
-        ownerState: ownerState,
-        children: _Typography || (_Typography = /*#__PURE__*/_jsx(Typography, {
-          variant: "caption",
-          children: "AM"
-        }))
-      }), /*#__PURE__*/_jsx(ClockPmButton, {
-        disabled: meridiemMode === null,
-        onClick: function onClick() {
-          return handleMeridiemChange('pm');
-        },
-        ownerState: ownerState,
-        children: _Typography2 || (_Typography2 = /*#__PURE__*/_jsx(Typography, {
-          variant: "caption",
-          children: "PM"
-        }))
-      })]
-    })]
-  });
-}
-
-export default Clock;