Added Statistics calculation

Statistics now show calculated values

node_modules/@mui/x-date-pickers/TimeClock/Clock.d.ts

@@ -0,0 +1,50 @@
+import * as React from 'react';
+import type { PickerSelectionState } from "../internals/hooks/usePicker/index.js";
+import { useMeridiemMode } from "../internals/hooks/date-helpers-hooks.js";
+import { PickerOwnerState, PickerValidDate, TimeView } from "../models/index.js";
+import { ClockClasses } from "./clockClasses.js";
+import { Meridiem } from "../internals/utils/time-utils.js";
+import { FormProps } from "../internals/models/formProps.js";
+export interface ClockProps extends ReturnType<typeof useMeridiemMode>, FormProps {
+  ampm: boolean;
+  ampmInClock: boolean;
+  autoFocus?: boolean;
+  children: readonly React.ReactNode[];
+  isTimeDisabled: (timeValue: number, type: TimeView) => boolean;
+  minutesStep?: number;
+  onChange: (value: number, isFinish?: PickerSelectionState) => void;
+  /**
+   * DOM id that the selected option should have
+   * Should only be `undefined` on the server
+   */
+  selectedId: string | undefined;
+  type: TimeView;
+  /**
+   * The numeric value of the current view.
+   */
+  viewValue: number;
+  /**
+   * The current full date value.
+   */
+  value: PickerValidDate | null;
+  /**
+   * Minimum and maximum value of the clock.
+   */
+  viewRange: [number, number];
+  className?: string;
+  classes?: Partial<ClockClasses>;
+}
+export interface ClockOwnerState extends PickerOwnerState {
+  /**
+   * `true` if the clock is disabled, `false` otherwise.
+   */
+  isClockDisabled: boolean;
+  /**
+   * The current meridiem mode of the clock.
+   */
+  clockMeridiemMode: Meridiem | null;
+}
+/**
+ * @ignore - internal component.
+ */
+export declare function Clock(inProps: ClockProps): React.JSX.Element;

node_modules/@mui/x-date-pickers/TimeClock/Clock.js

@@ -0,0 +1,354 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Clock = Clock;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var React = _interopRequireWildcard(require("react"));
+var _clsx = _interopRequireDefault(require("clsx"));
+var _IconButton = _interopRequireDefault(require("@mui/material/IconButton"));
+var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
+var _styles = require("@mui/material/styles");
+var _useEnhancedEffect = _interopRequireDefault(require("@mui/utils/useEnhancedEffect"));
+var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
+var _ClockPointer = require("./ClockPointer");
+var _hooks = require("../hooks");
+var _shared = require("./shared");
+var _clockClasses = require("./clockClasses");
+var _dateUtils = require("../internals/utils/date-utils");
+var _usePickerPrivateContext = require("../internals/hooks/usePickerPrivateContext");
+var _jsxRuntime = require("react/jsx-runtime");
+const useUtilityClasses = (classes, ownerState) => {
+  const slots = {
+    root: ['root'],
+    clock: ['clock'],
+    wrapper: ['wrapper'],
+    squareMask: ['squareMask'],
+    pin: ['pin'],
+    amButton: ['amButton', ownerState.clockMeridiemMode === 'am' && 'selected'],
+    pmButton: ['pmButton', ownerState.clockMeridiemMode === 'pm' && 'selected'],
+    meridiemText: ['meridiemText']
+  };
+  return (0, _composeClasses.default)(slots, _clockClasses.getClockUtilityClass, classes);
+};
+const ClockRoot = (0, _styles.styled)('div', {
+  name: 'MuiClock',
+  slot: 'Root'
+})(({
+  theme
+}) => ({
+  display: 'flex',
+  justifyContent: 'center',
+  alignItems: 'center',
+  margin: theme.spacing(2)
+}));
+const ClockClock = (0, _styles.styled)('div', {
+  name: 'MuiClock',
+  slot: 'Clock'
+})({
+  backgroundColor: 'rgba(0,0,0,.07)',
+  borderRadius: '50%',
+  height: 220,
+  width: 220,
+  flexShrink: 0,
+  position: 'relative',
+  pointerEvents: 'none'
+});
+const ClockWrapper = (0, _styles.styled)('div', {
+  name: 'MuiClock',
+  slot: 'Wrapper'
+})({
+  '&:focus': {
+    outline: 'none'
+  }
+});
+const ClockSquareMask = (0, _styles.styled)('div', {
+  name: 'MuiClock',
+  slot: 'SquareMask'
+})({
+  width: '100%',
+  height: '100%',
+  position: 'absolute',
+  pointerEvents: 'auto',
+  outline: 0,
+  // Disable scroll capabilities.
+  touchAction: 'none',
+  userSelect: 'none',
+  variants: [{
+    props: {
+      isClockDisabled: false
+    },
+    style: {
+      '@media (pointer: fine)': {
+        cursor: 'pointer',
+        borderRadius: '50%'
+      },
+      '&:active': {
+        cursor: 'move'
+      }
+    }
+  }]
+});
+const ClockPin = (0, _styles.styled)('div', {
+  name: 'MuiClock',
+  slot: 'Pin'
+})(({
+  theme
+}) => ({
+  width: 6,
+  height: 6,
+  borderRadius: '50%',
+  backgroundColor: (theme.vars || theme).palette.primary.main,
+  position: 'absolute',
+  top: '50%',
+  left: '50%',
+  transform: 'translate(-50%, -50%)'
+}));
+const meridiemButtonCommonStyles = (theme, clockMeridiemMode) => ({
+  zIndex: 1,
+  bottom: 8,
+  paddingLeft: 4,
+  paddingRight: 4,
+  width: _shared.CLOCK_HOUR_WIDTH,
+  variants: [{
+    props: {
+      clockMeridiemMode
+    },
+    style: {
+      backgroundColor: (theme.vars || theme).palette.primary.main,
+      color: (theme.vars || theme).palette.primary.contrastText,
+      '&:hover': {
+        backgroundColor: (theme.vars || theme).palette.primary.light
+      }
+    }
+  }]
+});
+const ClockAmButton = (0, _styles.styled)(_IconButton.default, {
+  name: 'MuiClock',
+  slot: 'AmButton'
+})(({
+  theme
+}) => (0, _extends2.default)({}, meridiemButtonCommonStyles(theme, 'am'), {
+  // keeping it here to make TS happy
+  position: 'absolute',
+  left: 8
+}));
+const ClockPmButton = (0, _styles.styled)(_IconButton.default, {
+  name: 'MuiClock',
+  slot: 'PmButton'
+})(({
+  theme
+}) => (0, _extends2.default)({}, meridiemButtonCommonStyles(theme, 'pm'), {
+  // keeping it here to make TS happy
+  position: 'absolute',
+  right: 8
+}));
+const ClockMeridiemText = (0, _styles.styled)(_Typography.default, {
+  name: 'MuiClock',
+  slot: 'MeridiemText'
+})({
+  overflow: 'hidden',
+  whiteSpace: 'nowrap',
+  textOverflow: 'ellipsis'
+});
+
+/**
+ * @ignore - internal component.
+ */
+function Clock(inProps) {
+  const props = (0, _styles.useThemeProps)({
+    props: inProps,
+    name: 'MuiClock'
+  });
+  const {
+    ampm,
+    ampmInClock,
+    autoFocus,
+    children,
+    value,
+    handleMeridiemChange,
+    isTimeDisabled,
+    meridiemMode,
+    minutesStep = 1,
+    onChange,
+    selectedId,
+    type,
+    viewValue,
+    viewRange: [minViewValue, maxViewValue],
+    disabled = false,
+    readOnly,
+    className,
+    classes: classesProp
+  } = props;
+  const adapter = (0, _hooks.usePickerAdapter)();
+  const translations = (0, _hooks.usePickerTranslations)();
+  const {
+    ownerState: pickerOwnerState
+  } = (0, _usePickerPrivateContext.usePickerPrivateContext)();
+  const ownerState = (0, _extends2.default)({}, pickerOwnerState, {
+    isClockDisabled: disabled,
+    clockMeridiemMode: meridiemMode
+  });
+  const isMoving = React.useRef(false);
+  const classes = useUtilityClasses(classesProp, ownerState);
+  const isSelectedTimeDisabled = isTimeDisabled(viewValue, type);
+  const isPointerInner = !ampm && type === 'hours' && (viewValue < 1 || viewValue > 12);
+  const handleValueChange = (newValue, isFinish) => {
+    if (disabled || readOnly) {
+      return;
+    }
+    if (isTimeDisabled(newValue, type)) {
+      return;
+    }
+    onChange(newValue, isFinish);
+  };
+  const setTime = (event, isFinish) => {
+    let {
+      offsetX,
+      offsetY
+    } = event;
+    if (offsetX === undefined) {
+      const rect = event.target.getBoundingClientRect();
+      offsetX = event.changedTouches[0].clientX - rect.left;
+      offsetY = event.changedTouches[0].clientY - rect.top;
+    }
+    const newSelectedValue = type === 'seconds' || type === 'minutes' ? (0, _shared.getMinutes)(offsetX, offsetY, minutesStep) : (0, _shared.getHours)(offsetX, offsetY, Boolean(ampm));
+    handleValueChange(newSelectedValue, isFinish);
+  };
+  const handleTouchSelection = event => {
+    isMoving.current = true;
+    setTime(event, 'shallow');
+  };
+  const handleTouchEnd = event => {
+    if (isMoving.current) {
+      setTime(event, 'finish');
+      isMoving.current = false;
+    }
+    event.preventDefault();
+  };
+  const handleMouseMove = event => {
+    // event.buttons & PRIMARY_MOUSE_BUTTON
+    if (event.buttons > 0) {
+      setTime(event.nativeEvent, 'shallow');
+    }
+  };
+  const handleMouseUp = event => {
+    if (isMoving.current) {
+      isMoving.current = false;
+    }
+    setTime(event.nativeEvent, 'finish');
+  };
+  const isPointerBetweenTwoClockValues = type === 'hours' ? false : viewValue % 5 !== 0;
+  const keyboardControlStep = type === 'minutes' ? minutesStep : 1;
+  const 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.
+  (0, _useEnhancedEffect.default)(() => {
+    if (autoFocus) {
+      // The ref not being resolved would be a bug in MUI.
+      listboxRef.current.focus();
+    }
+  }, [autoFocus]);
+  const clampValue = newValue => Math.max(minViewValue, Math.min(maxViewValue, newValue));
+  const circleValue = newValue => (newValue + (maxViewValue + 1)) % (maxViewValue + 1);
+  const handleKeyDown = event => {
+    // TODO: Why this early exit?
+    if (isMoving.current) {
+      return;
+    }
+    switch (event.key) {
+      case 'Home':
+        // reset both hours and minutes
+        handleValueChange(minViewValue, 'partial');
+        event.preventDefault();
+        break;
+      case 'End':
+        handleValueChange(maxViewValue, 'partial');
+        event.preventDefault();
+        break;
+      case 'ArrowUp':
+        handleValueChange(circleValue(viewValue + keyboardControlStep), 'partial');
+        event.preventDefault();
+        break;
+      case 'ArrowDown':
+        handleValueChange(circleValue(viewValue - keyboardControlStep), 'partial');
+        event.preventDefault();
+        break;
+      case 'PageUp':
+        handleValueChange(clampValue(viewValue + 5), 'partial');
+        event.preventDefault();
+        break;
+      case 'PageDown':
+        handleValueChange(clampValue(viewValue - 5), 'partial');
+        event.preventDefault();
+        break;
+      case 'Enter':
+      case ' ':
+        handleValueChange(viewValue, 'finish');
+        event.preventDefault();
+        break;
+      default:
+      // do nothing
+    }
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(ClockRoot, {
+    className: (0, _clsx.default)(classes.root, className),
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(ClockClock, {
+      className: classes.clock,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(ClockSquareMask, {
+        onTouchMove: handleTouchSelection,
+        onTouchStart: handleTouchSelection,
+        onTouchEnd: handleTouchEnd,
+        onMouseUp: handleMouseUp,
+        onMouseMove: handleMouseMove,
+        ownerState: ownerState,
+        className: classes.squareMask
+      }), !isSelectedTimeDisabled && /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(ClockPin, {
+          className: classes.pin
+        }), value != null && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ClockPointer.ClockPointer, {
+          type: type,
+          viewValue: viewValue,
+          isInner: isPointerInner,
+          isBetweenTwoClockValues: isPointerBetweenTwoClockValues
+        })]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(ClockWrapper, {
+        "aria-activedescendant": selectedId,
+        "aria-label": translations.clockLabelText(type, value == null ? null : adapter.format(value, ampm ? 'fullTime12h' : 'fullTime24h')),
+        ref: listboxRef,
+        role: "listbox",
+        onKeyDown: handleKeyDown,
+        tabIndex: 0,
+        className: classes.wrapper,
+        children: children
+      })]
+    }), ampm && ampmInClock && /*#__PURE__*/(0, _jsxRuntime.jsxs)(React.Fragment, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(ClockAmButton, {
+        onClick: readOnly ? undefined : () => handleMeridiemChange('am'),
+        disabled: disabled || meridiemMode === null,
+        ownerState: ownerState,
+        className: classes.amButton,
+        title: (0, _dateUtils.formatMeridiem)(adapter, 'am'),
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ClockMeridiemText, {
+          variant: "caption",
+          className: classes.meridiemText,
+          children: (0, _dateUtils.formatMeridiem)(adapter, 'am')
+        })
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(ClockPmButton, {
+        disabled: disabled || meridiemMode === null,
+        onClick: readOnly ? undefined : () => handleMeridiemChange('pm'),
+        ownerState: ownerState,
+        className: classes.pmButton,
+        title: (0, _dateUtils.formatMeridiem)(adapter, 'pm'),
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ClockMeridiemText, {
+          variant: "caption",
+          className: classes.meridiemText,
+          children: (0, _dateUtils.formatMeridiem)(adapter, 'pm')
+        })
+      })]
+    })]
+  });
+}

node_modules/@mui/x-date-pickers/TimeClock/ClockNumber.d.ts

@@ -0,0 +1,37 @@
+import * as React from 'react';
+import { ClockNumberClasses } from "./clockNumberClasses.js";
+import { PickerOwnerState } from "../models/pickers.js";
+export interface ClockNumberProps extends React.HTMLAttributes<HTMLSpanElement> {
+  'aria-label': string;
+  disabled: boolean;
+  /**
+   * Make sure callers pass an id which. It should be defined if selected.
+   */
+  id: string | undefined;
+  index: number;
+  inner: boolean;
+  label: string;
+  selected: boolean;
+  classes?: Partial<ClockNumberClasses>;
+}
+export interface ClockNumberOwnerState extends PickerOwnerState {
+  /**
+   * `true` if the clock number is in the inner clock ring.
+   * When used with meridiem, all the hours are in the outer ring.
+   * When used without meridiem, the hours from 1 to 12 are in the outer ring and the hours from 13 to 24 are in the inner ring.
+   * The minutes are always in the outer ring.
+   */
+  isClockNumberInInnerRing: boolean;
+  /**
+   * `true` if the clock number is selected.
+   */
+  isClockNumberSelected: boolean;
+  /**
+   * `true` if the clock number is disabled.
+   */
+  isClockNumberDisabled: boolean;
+}
+/**
+ * @ignore - internal component.
+ */
+export declare function ClockNumber(inProps: ClockNumberProps): React.JSX.Element;

node_modules/@mui/x-date-pickers/TimeClock/ClockNumber.js

@@ -0,0 +1,110 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ClockNumber = ClockNumber;
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var React = _interopRequireWildcard(require("react"));
+var _clsx = _interopRequireDefault(require("clsx"));
+var _styles = require("@mui/material/styles");
+var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
+var _shared = require("./shared");
+var _clockNumberClasses = require("./clockNumberClasses");
+var _usePickerPrivateContext = require("../internals/hooks/usePickerPrivateContext");
+var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["className", "classes", "disabled", "index", "inner", "label", "selected"];
+const useUtilityClasses = (classes, ownerState) => {
+  const slots = {
+    root: ['root', ownerState.isClockNumberSelected && 'selected', ownerState.isClockNumberDisabled && 'disabled']
+  };
+  return (0, _composeClasses.default)(slots, _clockNumberClasses.getClockNumberUtilityClass, classes);
+};
+const ClockNumberRoot = (0, _styles.styled)('span', {
+  name: 'MuiClockNumber',
+  slot: 'Root',
+  overridesResolver: (_, styles) => [styles.root, {
+    [`&.${_clockNumberClasses.clockNumberClasses.disabled}`]: styles.disabled
+  }, {
+    [`&.${_clockNumberClasses.clockNumberClasses.selected}`]: styles.selected
+  }]
+})(({
+  theme
+}) => ({
+  height: _shared.CLOCK_HOUR_WIDTH,
+  width: _shared.CLOCK_HOUR_WIDTH,
+  position: 'absolute',
+  left: `calc((100% - ${_shared.CLOCK_HOUR_WIDTH}px) / 2)`,
+  display: 'inline-flex',
+  justifyContent: 'center',
+  alignItems: 'center',
+  borderRadius: '50%',
+  color: (theme.vars || theme).palette.text.primary,
+  fontFamily: theme.typography.fontFamily,
+  '&:focused': {
+    backgroundColor: (theme.vars || theme).palette.background.paper
+  },
+  [`&.${_clockNumberClasses.clockNumberClasses.selected}`]: {
+    color: (theme.vars || theme).palette.primary.contrastText
+  },
+  [`&.${_clockNumberClasses.clockNumberClasses.disabled}`]: {
+    pointerEvents: 'none',
+    color: (theme.vars || theme).palette.text.disabled
+  },
+  variants: [{
+    props: {
+      isClockNumberInInnerRing: true
+    },
+    style: (0, _extends2.default)({}, theme.typography.body2, {
+      color: (theme.vars || theme).palette.text.secondary
+    })
+  }]
+}));
+
+/**
+ * @ignore - internal component.
+ */
+function ClockNumber(inProps) {
+  const props = (0, _styles.useThemeProps)({
+    props: inProps,
+    name: 'MuiClockNumber'
+  });
+  const {
+      className,
+      classes: classesProp,
+      disabled,
+      index,
+      inner,
+      label,
+      selected
+    } = props,
+    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  const {
+    ownerState: pickerOwnerState
+  } = (0, _usePickerPrivateContext.usePickerPrivateContext)();
+  const ownerState = (0, _extends2.default)({}, pickerOwnerState, {
+    isClockNumberInInnerRing: inner,
+    isClockNumberSelected: selected,
+    isClockNumberDisabled: disabled
+  });
+  const classes = useUtilityClasses(classesProp, ownerState);
+  const angle = index % 12 / 12 * Math.PI * 2 - Math.PI / 2;
+  const length = (_shared.CLOCK_WIDTH - _shared.CLOCK_HOUR_WIDTH - 2) / 2 * (inner ? 0.65 : 1);
+  const x = Math.round(Math.cos(angle) * length);
+  const y = Math.round(Math.sin(angle) * length);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(ClockNumberRoot, (0, _extends2.default)({
+    className: (0, _clsx.default)(classes.root, className),
+    "aria-disabled": disabled ? true : undefined,
+    "aria-selected": selected ? true : undefined,
+    role: "option",
+    style: {
+      transform: `translate(${x}px, ${y + (_shared.CLOCK_WIDTH - _shared.CLOCK_HOUR_WIDTH) / 2}px`
+    },
+    ownerState: ownerState
+  }, other, {
+    children: label
+  }));
+}

node_modules/@mui/x-date-pickers/TimeClock/ClockNumbers.d.ts

@@ -0,0 +1,37 @@
+import * as React from 'react';
+import { MuiPickersAdapter, PickerValidDate } from "../models/index.js";
+import type { PickerSelectionState } from "../internals/hooks/usePicker/index.js";
+interface GetHourNumbersOptions {
+  ampm: boolean;
+  value: PickerValidDate | null;
+  getClockNumberText: (hour: string) => string;
+  isDisabled: (value: number) => boolean;
+  onChange: (value: number, isFinish?: PickerSelectionState) => void;
+  /**
+   * DOM id that the selected option should have
+   * Should only be `undefined` on the server
+   */
+  selectedId: string | undefined;
+  adapter: MuiPickersAdapter;
+}
+/**
+ * @ignore - internal component.
+ */
+export declare const getHourNumbers: ({
+  ampm,
+  value,
+  getClockNumberText,
+  isDisabled,
+  selectedId,
+  adapter
+}: GetHourNumbersOptions) => React.JSX.Element[];
+export declare const getMinutesNumbers: ({
+  adapter,
+  value,
+  isDisabled,
+  getClockNumberText,
+  selectedId
+}: Omit<GetHourNumbersOptions, "ampm" | "value"> & {
+  value: number;
+}) => React.JSX.Element[];
+export {};

node_modules/@mui/x-date-pickers/TimeClock/ClockNumbers.js

@@ -0,0 +1,80 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getMinutesNumbers = exports.getHourNumbers = void 0;
+var React = _interopRequireWildcard(require("react"));
+var _ClockNumber = require("./ClockNumber");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * @ignore - internal component.
+ */
+const getHourNumbers = ({
+  ampm,
+  value,
+  getClockNumberText,
+  isDisabled,
+  selectedId,
+  adapter
+}) => {
+  const currentHours = value ? adapter.getHours(value) : null;
+  const hourNumbers = [];
+  const startHour = ampm ? 1 : 0;
+  const endHour = ampm ? 12 : 23;
+  const isSelected = hour => {
+    if (currentHours === null) {
+      return false;
+    }
+    if (ampm) {
+      if (hour === 12) {
+        return currentHours === 12 || currentHours === 0;
+      }
+      return currentHours === hour || currentHours - 12 === hour;
+    }
+    return currentHours === hour;
+  };
+  for (let hour = startHour; hour <= endHour; hour += 1) {
+    let label = hour.toString();
+    if (hour === 0) {
+      label = '00';
+    }
+    const inner = !ampm && (hour === 0 || hour > 12);
+    label = adapter.formatNumber(label);
+    const selected = isSelected(hour);
+    hourNumbers.push(/*#__PURE__*/(0, _jsxRuntime.jsx)(_ClockNumber.ClockNumber, {
+      id: selected ? selectedId : undefined,
+      index: hour,
+      inner: inner,
+      selected: selected,
+      disabled: isDisabled(hour),
+      label: label,
+      "aria-label": getClockNumberText(label)
+    }, hour));
+  }
+  return hourNumbers;
+};
+exports.getHourNumbers = getHourNumbers;
+const getMinutesNumbers = ({
+  adapter,
+  value,
+  isDisabled,
+  getClockNumberText,
+  selectedId
+}) => {
+  const f = adapter.formatNumber;
+  return [[5, f('05')], [10, f('10')], [15, f('15')], [20, f('20')], [25, f('25')], [30, f('30')], [35, f('35')], [40, f('40')], [45, f('45')], [50, f('50')], [55, f('55')], [0, f('00')]].map(([numberValue, label], index) => {
+    const selected = numberValue === value;
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ClockNumber.ClockNumber, {
+      label: label,
+      id: selected ? selectedId : undefined,
+      index: index + 1,
+      inner: false,
+      disabled: isDisabled(numberValue),
+      selected: selected,
+      "aria-label": getClockNumberText(label)
+    }, numberValue);
+  });
+};
+exports.getMinutesNumbers = getMinutesNumbers;

node_modules/@mui/x-date-pickers/TimeClock/ClockPointer.d.ts

@@ -0,0 +1,31 @@
+import * as React from 'react';
+import { PickerOwnerState, TimeView } from "../models/index.js";
+import { ClockPointerClasses } from "./clockPointerClasses.js";
+export interface ClockPointerProps extends React.HTMLAttributes<HTMLDivElement> {
+  /**
+   * `true` if the pointer is between two clock values.
+   * On the `hours` view, it is always false.
+   * On the `minutes` view, it is true if the pointer is on a value that is not a multiple of 5.
+   */
+  isBetweenTwoClockValues: boolean;
+  isInner: boolean;
+  type: TimeView;
+  viewValue: number;
+  classes?: Partial<ClockPointerClasses>;
+}
+export interface ClockPointerOwnerState extends PickerOwnerState {
+  /**
+   * `true` if the clock pointer should animate.
+   */
+  isClockPointerAnimated: boolean;
+  /**
+   * `true` if the pointer is between two clock values.
+   * On the `hours` view, it is always false.
+   * On the `minutes` view, it is true if the pointer is on a value that is not a multiple of 5.
+   */
+  isClockPointerBetweenTwoValues: boolean;
+}
+/**
+ * @ignore - internal component.
+ */
+export declare function ClockPointer(inProps: ClockPointerProps): React.JSX.Element;

node_modules/@mui/x-date-pickers/TimeClock/ClockPointer.js

@@ -0,0 +1,124 @@
+"use strict";
+'use client';
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ClockPointer = ClockPointer;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var React = _interopRequireWildcard(require("react"));
+var _clsx = _interopRequireDefault(require("clsx"));
+var _styles = require("@mui/material/styles");
+var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
+var _shared = require("./shared");
+var _clockPointerClasses = require("./clockPointerClasses");
+var _usePickerPrivateContext = require("../internals/hooks/usePickerPrivateContext");
+var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["className", "classes", "isBetweenTwoClockValues", "isInner", "type", "viewValue"];
+const useUtilityClasses = classes => {
+  const slots = {
+    root: ['root'],
+    thumb: ['thumb']
+  };
+  return (0, _composeClasses.default)(slots, _clockPointerClasses.getClockPointerUtilityClass, classes);
+};
+const ClockPointerRoot = (0, _styles.styled)('div', {
+  name: 'MuiClockPointer',
+  slot: 'Root'
+})(({
+  theme
+}) => ({
+  width: 2,
+  backgroundColor: (theme.vars || theme).palette.primary.main,
+  position: 'absolute',
+  left: 'calc(50% - 1px)',
+  bottom: '50%',
+  transformOrigin: 'center bottom 0px',
+  variants: [{
+    props: {
+      isClockPointerAnimated: true
+    },
+    style: {
+      transition: theme.transitions.create(['transform', 'height'])
+    }
+  }]
+}));
+const ClockPointerThumb = (0, _styles.styled)('div', {
+  name: 'MuiClockPointer',
+  slot: 'Thumb'
+})(({
+  theme
+}) => ({
+  width: 4,
+  height: 4,
+  backgroundColor: (theme.vars || theme).palette.primary.contrastText,
+  borderRadius: '50%',
+  position: 'absolute',
+  top: -21,
+  left: `calc(50% - ${_shared.CLOCK_HOUR_WIDTH / 2}px)`,
+  border: `${(_shared.CLOCK_HOUR_WIDTH - 4) / 2}px solid ${(theme.vars || theme).palette.primary.main}`,
+  boxSizing: 'content-box',
+  variants: [{
+    props: {
+      isClockPointerBetweenTwoValues: false
+    },
+    style: {
+      backgroundColor: (theme.vars || theme).palette.primary.main
+    }
+  }]
+}));
+
+/**
+ * @ignore - internal component.
+ */
+function ClockPointer(inProps) {
+  const props = (0, _styles.useThemeProps)({
+    props: inProps,
+    name: 'MuiClockPointer'
+  });
+  const {
+      className,
+      classes: classesProp,
+      isBetweenTwoClockValues,
+      isInner,
+      type,
+      viewValue
+    } = props,
+    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  const previousType = React.useRef(type);
+  React.useEffect(() => {
+    previousType.current = type;
+  }, [type]);
+  const {
+    ownerState: pickerOwnerState
+  } = (0, _usePickerPrivateContext.usePickerPrivateContext)();
+  const ownerState = (0, _extends2.default)({}, pickerOwnerState, {
+    isClockPointerAnimated: previousType.current !== type,
+    isClockPointerBetweenTwoValues: isBetweenTwoClockValues
+  });
+  const classes = useUtilityClasses(classesProp);
+  const getAngleStyle = () => {
+    const max = type === 'hours' ? 12 : 60;
+    let angle = 360 / max * viewValue;
+    if (type === 'hours' && viewValue > 12) {
+      angle -= 360; // round up angle to max 360 degrees
+    }
+    return {
+      height: Math.round((isInner ? 0.26 : 0.4) * _shared.CLOCK_WIDTH),
+      transform: `rotateZ(${angle}deg)`
+    };
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(ClockPointerRoot, (0, _extends2.default)({
+    style: getAngleStyle(),
+    className: (0, _clsx.default)(classes.root, className),
+    ownerState: ownerState
+  }, other, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(ClockPointerThumb, {
+      ownerState: ownerState,
+      className: classes.thumb
+    })
+  }));
+}

node_modules/@mui/x-date-pickers/TimeClock/TimeClock.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import { TimeClockProps } from "./TimeClock.types.js";
+type TimeClockComponent = ((props: TimeClockProps & React.RefAttributes<HTMLDivElement>) => React.JSX.Element) & {
+  propTypes?: any;
+};
+/**
+ * Demos:
+ *
+ * - [TimePicker](https://mui.com/x/react-date-pickers/time-picker/)
+ * - [TimeClock](https://mui.com/x/react-date-pickers/time-clock/)
+ *
+ * API:
+ *
+ * - [TimeClock API](https://mui.com/x/api/date-pickers/time-clock/)
+ */
+export declare const TimeClock: TimeClockComponent;
+export {};

node_modules/@mui/x-date-pickers/TimeClock/TimeClock.js

@@ -0,0 +1,498 @@
+"use strict";
+'use client';
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TimeClock = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var React = _interopRequireWildcard(require("react"));
+var _clsx = _interopRequireDefault(require("clsx"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _styles = require("@mui/material/styles");
+var _composeClasses = _interopRequireDefault(require("@mui/utils/composeClasses"));
+var _useId = _interopRequireDefault(require("@mui/utils/useId"));
+var _hooks = require("../hooks");
+var _useUtils = require("../internals/hooks/useUtils");
+var _PickersArrowSwitcher = require("../internals/components/PickersArrowSwitcher");
+var _timeUtils = require("../internals/utils/time-utils");
+var _useViews = require("../internals/hooks/useViews");
+var _dateHelpersHooks = require("../internals/hooks/date-helpers-hooks");
+var _PickerViewRoot = require("../internals/components/PickerViewRoot");
+var _timeClockClasses = require("./timeClockClasses");
+var _Clock = require("./Clock");
+var _ClockNumbers = require("./ClockNumbers");
+var _useControlledValue = require("../internals/hooks/useControlledValue");
+var _valueManagers = require("../internals/utils/valueManagers");
+var _useClockReferenceDate = require("../internals/hooks/useClockReferenceDate");
+var _usePickerPrivateContext = require("../internals/hooks/usePickerPrivateContext");
+var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["ampm", "ampmInClock", "autoFocus", "slots", "slotProps", "value", "defaultValue", "referenceDate", "disableIgnoringDatePartForTimeValidation", "maxTime", "minTime", "disableFuture", "disablePast", "minutesStep", "shouldDisableTime", "showViewSwitcher", "onChange", "view", "views", "openTo", "onViewChange", "focusedView", "onFocusedViewChange", "className", "classes", "disabled", "readOnly", "timezone"];
+const useUtilityClasses = classes => {
+  const slots = {
+    root: ['root'],
+    arrowSwitcher: ['arrowSwitcher']
+  };
+  return (0, _composeClasses.default)(slots, _timeClockClasses.getTimeClockUtilityClass, classes);
+};
+const TimeClockRoot = (0, _styles.styled)(_PickerViewRoot.PickerViewRoot, {
+  name: 'MuiTimeClock',
+  slot: 'Root'
+})({
+  display: 'flex',
+  flexDirection: 'column',
+  position: 'relative'
+});
+const TimeClockArrowSwitcher = (0, _styles.styled)(_PickersArrowSwitcher.PickersArrowSwitcher, {
+  name: 'MuiTimeClock',
+  slot: 'ArrowSwitcher'
+})({
+  position: 'absolute',
+  right: 12,
+  top: 15
+});
+const TIME_CLOCK_DEFAULT_VIEWS = ['hours', 'minutes'];
+
+/**
+ * Demos:
+ *
+ * - [TimePicker](https://mui.com/x/react-date-pickers/time-picker/)
+ * - [TimeClock](https://mui.com/x/react-date-pickers/time-clock/)
+ *
+ * API:
+ *
+ * - [TimeClock API](https://mui.com/x/api/date-pickers/time-clock/)
+ */
+const TimeClock = exports.TimeClock = /*#__PURE__*/React.forwardRef(function TimeClock(inProps, ref) {
+  const adapter = (0, _hooks.usePickerAdapter)();
+  const props = (0, _styles.useThemeProps)({
+    props: inProps,
+    name: 'MuiTimeClock'
+  });
+  const {
+      ampm = adapter.is12HourCycleInCurrentLocale(),
+      ampmInClock = false,
+      autoFocus,
+      slots,
+      slotProps,
+      value: valueProp,
+      defaultValue,
+      referenceDate: referenceDateProp,
+      disableIgnoringDatePartForTimeValidation = false,
+      maxTime,
+      minTime,
+      disableFuture,
+      disablePast,
+      minutesStep = 1,
+      shouldDisableTime,
+      showViewSwitcher,
+      onChange,
+      view: inView,
+      views = TIME_CLOCK_DEFAULT_VIEWS,
+      openTo,
+      onViewChange,
+      focusedView,
+      onFocusedViewChange,
+      className,
+      classes: classesProp,
+      disabled,
+      readOnly,
+      timezone: timezoneProp
+    } = props,
+    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  const {
+    value,
+    handleValueChange,
+    timezone
+  } = (0, _useControlledValue.useControlledValue)({
+    name: 'TimeClock',
+    timezone: timezoneProp,
+    value: valueProp,
+    defaultValue,
+    referenceDate: referenceDateProp,
+    onChange,
+    valueManager: _valueManagers.singleItemValueManager
+  });
+  const valueOrReferenceDate = (0, _useClockReferenceDate.useClockReferenceDate)({
+    value,
+    referenceDate: referenceDateProp,
+    adapter,
+    props,
+    timezone
+  });
+  const translations = (0, _hooks.usePickerTranslations)();
+  const now = (0, _useUtils.useNow)(timezone);
+  const selectedId = (0, _useId.default)();
+  const {
+    ownerState
+  } = (0, _usePickerPrivateContext.usePickerPrivateContext)();
+  const {
+    view,
+    setView,
+    previousView,
+    nextView,
+    setValueAndGoToNextView
+  } = (0, _useViews.useViews)({
+    view: inView,
+    views,
+    openTo,
+    onViewChange,
+    onChange: handleValueChange,
+    focusedView,
+    onFocusedViewChange
+  });
+  const {
+    meridiemMode,
+    handleMeridiemChange
+  } = (0, _dateHelpersHooks.useMeridiemMode)(valueOrReferenceDate, ampm, setValueAndGoToNextView);
+  const isTimeDisabled = React.useCallback((rawValue, viewType) => {
+    const isAfter = (0, _timeUtils.createIsAfterIgnoreDatePart)(disableIgnoringDatePartForTimeValidation, adapter);
+    const shouldCheckPastEnd = viewType === 'hours' || viewType === 'minutes' && views.includes('seconds');
+    const containsValidTime = ({
+      start,
+      end
+    }) => {
+      if (minTime && isAfter(minTime, end)) {
+        return false;
+      }
+      if (maxTime && isAfter(start, maxTime)) {
+        return false;
+      }
+      if (disableFuture && isAfter(start, now)) {
+        return false;
+      }
+      if (disablePast && isAfter(now, shouldCheckPastEnd ? end : start)) {
+        return false;
+      }
+      return true;
+    };
+    const isValidValue = (timeValue, step = 1) => {
+      if (timeValue % step !== 0) {
+        return false;
+      }
+      if (shouldDisableTime) {
+        switch (viewType) {
+          case 'hours':
+            return !shouldDisableTime(adapter.setHours(valueOrReferenceDate, timeValue), 'hours');
+          case 'minutes':
+            return !shouldDisableTime(adapter.setMinutes(valueOrReferenceDate, timeValue), 'minutes');
+          case 'seconds':
+            return !shouldDisableTime(adapter.setSeconds(valueOrReferenceDate, timeValue), 'seconds');
+          default:
+            return false;
+        }
+      }
+      return true;
+    };
+    switch (viewType) {
+      case 'hours':
+        {
+          const valueWithMeridiem = (0, _timeUtils.convertValueToMeridiem)(rawValue, meridiemMode, ampm);
+          const dateWithNewHours = adapter.setHours(valueOrReferenceDate, valueWithMeridiem);
+          if (adapter.getHours(dateWithNewHours) !== valueWithMeridiem) {
+            return true;
+          }
+          const start = adapter.setSeconds(adapter.setMinutes(dateWithNewHours, 0), 0);
+          const end = adapter.setSeconds(adapter.setMinutes(dateWithNewHours, 59), 59);
+          return !containsValidTime({
+            start,
+            end
+          }) || !isValidValue(valueWithMeridiem);
+        }
+      case 'minutes':
+        {
+          const dateWithNewMinutes = adapter.setMinutes(valueOrReferenceDate, rawValue);
+          const start = adapter.setSeconds(dateWithNewMinutes, 0);
+          const end = adapter.setSeconds(dateWithNewMinutes, 59);
+          return !containsValidTime({
+            start,
+            end
+          }) || !isValidValue(rawValue, minutesStep);
+        }
+      case 'seconds':
+        {
+          const dateWithNewSeconds = adapter.setSeconds(valueOrReferenceDate, rawValue);
+          const start = dateWithNewSeconds;
+          const end = dateWithNewSeconds;
+          return !containsValidTime({
+            start,
+            end
+          }) || !isValidValue(rawValue);
+        }
+      default:
+        throw new Error('not supported');
+    }
+  }, [ampm, valueOrReferenceDate, disableIgnoringDatePartForTimeValidation, maxTime, meridiemMode, minTime, minutesStep, shouldDisableTime, adapter, disableFuture, disablePast, now, views]);
+  const viewProps = React.useMemo(() => {
+    switch (view) {
+      case 'hours':
+        {
+          const handleHoursChange = (hourValue, isFinish) => {
+            const valueWithMeridiem = (0, _timeUtils.convertValueToMeridiem)(hourValue, meridiemMode, ampm);
+            setValueAndGoToNextView(adapter.setHours(valueOrReferenceDate, valueWithMeridiem), isFinish, 'hours');
+          };
+          const viewValue = adapter.getHours(valueOrReferenceDate);
+          let viewRange;
+          if (ampm) {
+            if (viewValue > 12) {
+              viewRange = [12, 23];
+            } else {
+              viewRange = [0, 11];
+            }
+          } else {
+            viewRange = [0, 23];
+          }
+          return {
+            onChange: handleHoursChange,
+            viewValue,
+            children: (0, _ClockNumbers.getHourNumbers)({
+              value,
+              adapter,
+              ampm,
+              onChange: handleHoursChange,
+              getClockNumberText: translations.hoursClockNumberText,
+              isDisabled: hourValue => disabled || isTimeDisabled(hourValue, 'hours'),
+              selectedId
+            }),
+            viewRange
+          };
+        }
+      case 'minutes':
+        {
+          const minutesValue = adapter.getMinutes(valueOrReferenceDate);
+          const handleMinutesChange = (minuteValue, isFinish) => {
+            setValueAndGoToNextView(adapter.setMinutes(valueOrReferenceDate, minuteValue), isFinish, 'minutes');
+          };
+          return {
+            viewValue: minutesValue,
+            onChange: handleMinutesChange,
+            children: (0, _ClockNumbers.getMinutesNumbers)({
+              adapter,
+              value: minutesValue,
+              onChange: handleMinutesChange,
+              getClockNumberText: translations.minutesClockNumberText,
+              isDisabled: minuteValue => disabled || isTimeDisabled(minuteValue, 'minutes'),
+              selectedId
+            }),
+            viewRange: [0, 59]
+          };
+        }
+      case 'seconds':
+        {
+          const secondsValue = adapter.getSeconds(valueOrReferenceDate);
+          const handleSecondsChange = (secondValue, isFinish) => {
+            setValueAndGoToNextView(adapter.setSeconds(valueOrReferenceDate, secondValue), isFinish, 'seconds');
+          };
+          return {
+            viewValue: secondsValue,
+            onChange: handleSecondsChange,
+            children: (0, _ClockNumbers.getMinutesNumbers)({
+              adapter,
+              value: secondsValue,
+              onChange: handleSecondsChange,
+              getClockNumberText: translations.secondsClockNumberText,
+              isDisabled: secondValue => disabled || isTimeDisabled(secondValue, 'seconds'),
+              selectedId
+            }),
+            viewRange: [0, 59]
+          };
+        }
+      default:
+        throw new Error('You must provide the type for ClockView');
+    }
+  }, [view, adapter, value, ampm, translations.hoursClockNumberText, translations.minutesClockNumberText, translations.secondsClockNumberText, meridiemMode, setValueAndGoToNextView, valueOrReferenceDate, isTimeDisabled, selectedId, disabled]);
+  const classes = useUtilityClasses(classesProp);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(TimeClockRoot, (0, _extends2.default)({
+    ref: ref,
+    className: (0, _clsx.default)(classes.root, className),
+    ownerState: ownerState
+  }, other, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Clock.Clock, (0, _extends2.default)({
+      autoFocus: autoFocus ?? !!focusedView,
+      ampmInClock: ampmInClock && views.includes('hours'),
+      value: value,
+      type: view,
+      ampm: ampm,
+      minutesStep: minutesStep,
+      isTimeDisabled: isTimeDisabled,
+      meridiemMode: meridiemMode,
+      handleMeridiemChange: handleMeridiemChange,
+      selectedId: selectedId,
+      disabled: disabled,
+      readOnly: readOnly
+    }, viewProps)), showViewSwitcher && /*#__PURE__*/(0, _jsxRuntime.jsx)(TimeClockArrowSwitcher, {
+      className: classes.arrowSwitcher,
+      slots: slots,
+      slotProps: slotProps,
+      onGoToPrevious: () => setView(previousView),
+      isPreviousDisabled: !previousView,
+      previousLabel: translations.openPreviousView,
+      onGoToNext: () => setView(nextView),
+      isNextDisabled: !nextView,
+      nextLabel: translations.openNextView,
+      ownerState: ownerState
+    })]
+  }));
+});
+if (process.env.NODE_ENV !== "production") TimeClock.displayName = "TimeClock";
+process.env.NODE_ENV !== "production" ? TimeClock.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
+  // ----------------------------------------------------------------------
+  /**
+   * 12h/24h view for hour selection clock.
+   * @default adapter.is12HourCycleInCurrentLocale()
+   */
+  ampm: _propTypes.default.bool,
+  /**
+   * Display ampm controls under the clock (instead of in the toolbar).
+   * @default false
+   */
+  ampmInClock: _propTypes.default.bool,
+  /**
+   * If `true`, the main element is focused during the first mount.
+   * This main element is:
+   * - the element chosen by the visible view if any (i.e: the selected day on the `day` view).
+   * - the `input` element if there is a field rendered.
+   */
+  autoFocus: _propTypes.default.bool,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: _propTypes.default.object,
+  className: _propTypes.default.string,
+  /**
+   * The default selected value.
+   * Used when the component is not controlled.
+   */
+  defaultValue: _propTypes.default.object,
+  /**
+   * If `true`, the component is disabled.
+   * When disabled, the value cannot be changed and no interaction is possible.
+   * @default false
+   */
+  disabled: _propTypes.default.bool,
+  /**
+   * If `true`, disable values after the current date for date components, time for time components and both for date time components.
+   * @default false
+   */
+  disableFuture: _propTypes.default.bool,
+  /**
+   * Do not ignore date part when validating min/max time.
+   * @default false
+   */
+  disableIgnoringDatePartForTimeValidation: _propTypes.default.bool,
+  /**
+   * If `true`, disable values before the current date for date components, time for time components and both for date time components.
+   * @default false
+   */
+  disablePast: _propTypes.default.bool,
+  /**
+   * Controlled focused view.
+   */
+  focusedView: _propTypes.default.oneOf(['hours', 'minutes', 'seconds']),
+  /**
+   * Maximal selectable time.
+   * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`.
+   */
+  maxTime: _propTypes.default.object,
+  /**
+   * Minimal selectable time.
+   * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`.
+   */
+  minTime: _propTypes.default.object,
+  /**
+   * Step over minutes.
+   * @default 1
+   */
+  minutesStep: _propTypes.default.number,
+  /**
+   * Callback fired when the value changes.
+   * @template TValue The value type. It will be the same type as `value` or `null`. It can be in `[start, end]` format in case of range value.
+   * @template TView The view type. Will be one of date or time views.
+   * @param {TValue} value The new value.
+   * @param {PickerSelectionState | undefined} selectionState Indicates if the date selection is complete.
+   * @param {TView | undefined} selectedView Indicates the view in which the selection has been made.
+   */
+  onChange: _propTypes.default.func,
+  /**
+   * Callback fired on focused view change.
+   * @template TView Type of the view. It will vary based on the Picker type and the `views` it uses.
+   * @param {TView} view The new view to focus or not.
+   * @param {boolean} hasFocus `true` if the view should be focused.
+   */
+  onFocusedViewChange: _propTypes.default.func,
+  /**
+   * Callback fired on view change.
+   * @template TView Type of the view. It will vary based on the Picker type and the `views` it uses.
+   * @param {TView} view The new view.
+   */
+  onViewChange: _propTypes.default.func,
+  /**
+   * The default visible view.
+   * Used when the component view is not controlled.
+   * Must be a valid option from `views` list.
+   */
+  openTo: _propTypes.default.oneOf(['hours', 'minutes', 'seconds']),
+  /**
+   * If `true`, the component is read-only.
+   * When read-only, the value cannot be changed but the user can interact with the interface.
+   * @default false
+   */
+  readOnly: _propTypes.default.bool,
+  /**
+   * The date used to generate the new value when both `value` and `defaultValue` are empty.
+   * @default The closest valid time using the validation props, except callbacks such as `shouldDisableTime`.
+   */
+  referenceDate: _propTypes.default.object,
+  /**
+   * Disable specific time.
+   * @param {PickerValidDate} value The value to check.
+   * @param {TimeView} view The clock type of the timeValue.
+   * @returns {boolean} If `true` the time will be disabled.
+   */
+  shouldDisableTime: _propTypes.default.func,
+  showViewSwitcher: _propTypes.default.bool,
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps: _propTypes.default.object,
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots: _propTypes.default.object,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.object, _propTypes.default.bool])), _propTypes.default.func, _propTypes.default.object]),
+  /**
+   * Choose which timezone to use for the value.
+   * Example: "default", "system", "UTC", "America/New_York".
+   * If you pass values from other timezones to some props, they will be converted to this timezone before being used.
+   * @see See the {@link https://mui.com/x/react-date-pickers/timezone/ timezones documentation} for more details.
+   * @default The timezone of the `value` or `defaultValue` prop is defined, 'default' otherwise.
+   */
+  timezone: _propTypes.default.string,
+  /**
+   * The selected value.
+   * Used when the component is controlled.
+   */
+  value: _propTypes.default.object,
+  /**
+   * The visible view.
+   * Used when the component view is controlled.
+   * Must be a valid option from `views` list.
+   */
+  view: _propTypes.default.oneOf(['hours', 'minutes', 'seconds']),
+  /**
+   * Available views.
+   * @default ['hours', 'minutes']
+   */
+  views: _propTypes.default.arrayOf(_propTypes.default.oneOf(['hours', 'minutes', 'seconds']).isRequired)
+} : void 0;

node_modules/@mui/x-date-pickers/TimeClock/TimeClock.types.d.ts

@@ -0,0 +1,36 @@
+import { TimeClockClasses } from "./timeClockClasses.js";
+import { PickersArrowSwitcherSlots, PickersArrowSwitcherSlotProps } from "../internals/components/PickersArrowSwitcher/index.js";
+import { BaseClockProps, ExportedBaseClockProps } from "../internals/models/props/time.js";
+import { TimeView } from "../models/index.js";
+import { TimeViewWithMeridiem } from "../internals/models/index.js";
+export interface ExportedTimeClockProps extends ExportedBaseClockProps {
+  /**
+   * Display ampm controls under the clock (instead of in the toolbar).
+   * @default false
+   */
+  ampmInClock?: boolean;
+}
+export interface TimeClockSlots extends PickersArrowSwitcherSlots {}
+export interface TimeClockSlotProps extends PickersArrowSwitcherSlotProps {}
+export interface TimeClockProps<TView extends TimeViewWithMeridiem = TimeView> extends ExportedTimeClockProps, BaseClockProps<TView> {
+  /**
+   * Available views.
+   * @default ['hours', 'minutes']
+   */
+  views?: readonly TView[];
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes?: Partial<TimeClockClasses>;
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots?: TimeClockSlots;
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps?: TimeClockSlotProps;
+  showViewSwitcher?: boolean;
+}

node_modules/@mui/x-date-pickers/TimeClock/TimeClock.types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

node_modules/@mui/x-date-pickers/TimeClock/clockClasses.d.ts

@@ -0,0 +1,23 @@
+export interface ClockClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to the clock element. */
+  clock: string;
+  /** Styles applied to the wrapper element. */
+  wrapper: string;
+  /** Styles applied to the square mask element. */
+  squareMask: string;
+  /** Styles applied to the pin element. */
+  pin: string;
+  /** Styles applied to the am button element. */
+  amButton: string;
+  /** Styles applied to the pm button element. */
+  pmButton: string;
+  /** Styles applied to the meridiem typography element. */
+  meridiemText: string;
+  /** Styles applied to the selected meridiem button element */
+  selected: string;
+}
+export type ClockClassKey = keyof ClockClasses;
+export declare function getClockUtilityClass(slot: string): string;
+export declare const clockClasses: ClockClasses;

node_modules/@mui/x-date-pickers/TimeClock/clockClasses.js

@@ -0,0 +1,14 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.clockClasses = void 0;
+exports.getClockUtilityClass = getClockUtilityClass;
+var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
+var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
+function getClockUtilityClass(slot) {
+  return (0, _generateUtilityClass.default)('MuiClock', slot);
+}
+const clockClasses = exports.clockClasses = (0, _generateUtilityClasses.default)('MuiClock', ['root', 'clock', 'wrapper', 'squareMask', 'pin', 'amButton', 'pmButton', 'meridiemText', 'selected']);

node_modules/@mui/x-date-pickers/TimeClock/clockNumberClasses.d.ts

@@ -0,0 +1,11 @@
+export interface ClockNumberClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to a selected root element. */
+  selected: string;
+  /** Styles applied to a disabled root element. */
+  disabled: string;
+}
+export type ClockNumberClassKey = keyof ClockNumberClasses;
+export declare function getClockNumberUtilityClass(slot: string): string;
+export declare const clockNumberClasses: ClockNumberClasses;

node_modules/@mui/x-date-pickers/TimeClock/clockNumberClasses.js

@@ -0,0 +1,14 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.clockNumberClasses = void 0;
+exports.getClockNumberUtilityClass = getClockNumberUtilityClass;
+var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
+var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
+function getClockNumberUtilityClass(slot) {
+  return (0, _generateUtilityClass.default)('MuiClockNumber', slot);
+}
+const clockNumberClasses = exports.clockNumberClasses = (0, _generateUtilityClasses.default)('MuiClockNumber', ['root', 'selected', 'disabled']);

node_modules/@mui/x-date-pickers/TimeClock/clockPointerClasses.d.ts

@@ -0,0 +1,9 @@
+export interface ClockPointerClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to the thumb element. */
+  thumb: string;
+}
+export type ClockPointerClassKey = keyof ClockPointerClasses;
+export declare function getClockPointerUtilityClass(slot: string): string;
+export declare const clockPointerClasses: ClockPointerClasses;

node_modules/@mui/x-date-pickers/TimeClock/clockPointerClasses.js

@@ -0,0 +1,14 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.clockPointerClasses = void 0;
+exports.getClockPointerUtilityClass = getClockPointerUtilityClass;
+var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
+var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
+function getClockPointerUtilityClass(slot) {
+  return (0, _generateUtilityClass.default)('MuiClockPointer', slot);
+}
+const clockPointerClasses = exports.clockPointerClasses = (0, _generateUtilityClasses.default)('MuiClockPointer', ['root', 'thumb']);

node_modules/@mui/x-date-pickers/TimeClock/index.d.ts

@@ -0,0 +1,13 @@
+export { TimeClock } from "./TimeClock.js";
+export type { TimeClockProps, TimeClockSlots, TimeClockSlotProps } from "./TimeClock.types.js";
+export { clockClasses } from "./clockClasses.js";
+export type { ClockClasses, ClockClassKey } from "./clockClasses.js";
+export type { ClockProps } from "./Clock.js";
+export { clockNumberClasses } from "./clockNumberClasses.js";
+export type { ClockNumberClasses, ClockNumberClassKey } from "./clockNumberClasses.js";
+export type { ClockNumberProps } from "./ClockNumber.js";
+export { timeClockClasses, getTimeClockUtilityClass } from "./timeClockClasses.js";
+export type { TimeClockClasses, TimeClockClassKey } from "./timeClockClasses.js";
+export { clockPointerClasses } from "./clockPointerClasses.js";
+export type { ClockPointerClasses, ClockPointerClassKey } from "./clockPointerClasses.js";
+export type { ClockPointerProps } from "./ClockPointer.js";

node_modules/@mui/x-date-pickers/TimeClock/index.js

@@ -0,0 +1,46 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "TimeClock", {
+  enumerable: true,
+  get: function () {
+    return _TimeClock.TimeClock;
+  }
+});
+Object.defineProperty(exports, "clockClasses", {
+  enumerable: true,
+  get: function () {
+    return _clockClasses.clockClasses;
+  }
+});
+Object.defineProperty(exports, "clockNumberClasses", {
+  enumerable: true,
+  get: function () {
+    return _clockNumberClasses.clockNumberClasses;
+  }
+});
+Object.defineProperty(exports, "clockPointerClasses", {
+  enumerable: true,
+  get: function () {
+    return _clockPointerClasses.clockPointerClasses;
+  }
+});
+Object.defineProperty(exports, "getTimeClockUtilityClass", {
+  enumerable: true,
+  get: function () {
+    return _timeClockClasses.getTimeClockUtilityClass;
+  }
+});
+Object.defineProperty(exports, "timeClockClasses", {
+  enumerable: true,
+  get: function () {
+    return _timeClockClasses.timeClockClasses;
+  }
+});
+var _TimeClock = require("./TimeClock");
+var _clockClasses = require("./clockClasses");
+var _clockNumberClasses = require("./clockNumberClasses");
+var _timeClockClasses = require("./timeClockClasses");
+var _clockPointerClasses = require("./clockPointerClasses");

node_modules/@mui/x-date-pickers/TimeClock/shared.d.ts

@@ -0,0 +1,4 @@
+export declare const CLOCK_WIDTH = 220;
+export declare const CLOCK_HOUR_WIDTH = 36;
+export declare const getMinutes: (offsetX: number, offsetY: number, step?: number) => number;
+export declare const getHours: (offsetX: number, offsetY: number, ampm: boolean) => number;

node_modules/@mui/x-date-pickers/TimeClock/shared.js

@@ -0,0 +1,60 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getMinutes = exports.getHours = exports.CLOCK_WIDTH = exports.CLOCK_HOUR_WIDTH = void 0;
+const CLOCK_WIDTH = exports.CLOCK_WIDTH = 220;
+const CLOCK_HOUR_WIDTH = exports.CLOCK_HOUR_WIDTH = 36;
+const clockCenter = {
+  x: CLOCK_WIDTH / 2,
+  y: CLOCK_WIDTH / 2
+};
+const baseClockPoint = {
+  x: clockCenter.x,
+  y: 0
+};
+const cx = baseClockPoint.x - clockCenter.x;
+const cy = baseClockPoint.y - clockCenter.y;
+const rad2deg = rad => rad * (180 / Math.PI);
+const getAngleValue = (step, offsetX, offsetY) => {
+  const x = offsetX - clockCenter.x;
+  const y = offsetY - clockCenter.y;
+  const atan = Math.atan2(cx, cy) - Math.atan2(x, y);
+  let deg = rad2deg(atan);
+  deg = Math.round(deg / step) * step;
+  deg %= 360;
+  const value = Math.floor(deg / step) || 0;
+  const delta = x ** 2 + y ** 2;
+  const distance = Math.sqrt(delta);
+  return {
+    value,
+    distance
+  };
+};
+const getMinutes = (offsetX, offsetY, step = 1) => {
+  const angleStep = step * 6;
+  let {
+    value
+  } = getAngleValue(angleStep, offsetX, offsetY);
+  value = value * step % 60;
+  return value;
+};
+exports.getMinutes = getMinutes;
+const getHours = (offsetX, offsetY, ampm) => {
+  const {
+    value,
+    distance
+  } = getAngleValue(30, offsetX, offsetY);
+  let hour = value || 12;
+  if (!ampm) {
+    if (distance < CLOCK_WIDTH / 2 - CLOCK_HOUR_WIDTH) {
+      hour += 12;
+      hour %= 24;
+    }
+  } else {
+    hour %= 12;
+  }
+  return hour;
+};
+exports.getHours = getHours;

node_modules/@mui/x-date-pickers/TimeClock/timeClockClasses.d.ts

@@ -0,0 +1,9 @@
+export interface TimeClockClasses {
+  /** Styles applied to the root element. */
+  root: string;
+  /** Styles applied to the arrowSwitcher element. */
+  arrowSwitcher: string;
+}
+export type TimeClockClassKey = keyof TimeClockClasses;
+export declare function getTimeClockUtilityClass(slot: string): string;
+export declare const timeClockClasses: TimeClockClasses;

node_modules/@mui/x-date-pickers/TimeClock/timeClockClasses.js

@@ -0,0 +1,14 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getTimeClockUtilityClass = getTimeClockUtilityClass;
+exports.timeClockClasses = void 0;
+var _generateUtilityClass = _interopRequireDefault(require("@mui/utils/generateUtilityClass"));
+var _generateUtilityClasses = _interopRequireDefault(require("@mui/utils/generateUtilityClasses"));
+function getTimeClockUtilityClass(slot) {
+  return (0, _generateUtilityClass.default)('MuiTimeClock', slot);
+}
+const timeClockClasses = exports.timeClockClasses = (0, _generateUtilityClasses.default)('MuiTimeClock', ['root', 'arrowSwitcher']);