@hybridcore/ui 1.6.0 → 1.6.2

package/dist/components/range-selector/styled.js

@@ -0,0 +1,4294 @@
+import { styled as A, Box as fe, TextField as Ke, Typography as xo, IconButton as tt, FormControl as nt } from "@mui/material";
+import { ArrowForward as st } from "@mui/icons-material";
+import { _ as X, a as u } from "../../objectWithoutPropertiesLoose-DJteAcBH.js";
+import * as T from "react";
+import { P as e } from "../../index-C__OZmYy.js";
+import { g as we, a as De, u as ne, w as Ie, f as he, x as rt, y as wo, v as at, m as lt, c as je, h as Do, l as Ye, s as so, n as it, d as Ne, z as ct, T as ut, P as dt, A as mt, B as Po, j as So, k as pt, r as Re, C as bt, o as ko, p as ft, E as ht, F as Tt, G as gt, H as yt, I as vt, J as Ct, K as xt, L as wt, M as bo, N as Dt, q as Pt, t as St, D as kt } from "../../useMobilePicker-CY8ndYRL.js";
+import { jsx as y, jsxs as z } from "react/jsx-runtime";
+import { s as M, g as ro, a as ao, b as Mo, u as lo, c as io } from "../../generateUtilityClasses-C3ivN9Ie.js";
+import { r as Mt } from "../../index-DH6qsPBn.js";
+import { c as pe } from "../../clsx-OuTLNxxd.js";
+import { u as Ro } from "../../Select-DHUl_uG3.js";
+import { u as Oo, r as Io } from "../../Paper-BkQLdsCI.js";
+import { a as Rt, b as Je, r as Ot } from "../../TransitionGroupContext-BDAp2T0O.js";
+import { d as No } from "../../debounce-46wSf_lW.js";
+import { a as Bo, o as It } from "../../ownerWindow-wg6foiOE.js";
+import { u as _e } from "../../Modal-MUZygjmQ.js";
+import { c as Fo } from "../../createSvgIcon-Ch_cT8az.js";
+import { B as Eo } from "../../ButtonBase-BEF7oTOe.js";
+import { u as Nt } from "../../unsupportedProp-DuqR2hj9.js";
+import { T as to } from "../../Typography-DgsSLCFC.js";
+import { B as Bt } from "../../Button-C5yquWAB.js";
+import { T as Ft } from "../../TextField-e2oKaUN1.js";
+import { I as $o } from "../../IconButton-BoGwbvrP.js";
+let Me;
+function Vo() {
+  if (Me)
+    return Me;
+  const o = document.createElement("div"), t = document.createElement("div");
+  return t.style.width = "10px", t.style.height = "1px", o.appendChild(t), o.dir = "rtl", o.style.fontSize = "14px", o.style.width = "4px", o.style.height = "1px", o.style.position = "absolute", o.style.top = "-1000px", o.style.overflow = "scroll", document.body.appendChild(o), Me = "reverse", o.scrollLeft > 0 ? Me = "default" : (o.scrollLeft = 1, o.scrollLeft === 0 && (Me = "negative")), document.body.removeChild(o), Me;
+}
+function Et(o, t) {
+  const s = o.scrollLeft;
+  if (t !== "rtl")
+    return s;
+  switch (Vo()) {
+    case "negative":
+      return o.scrollWidth - o.clientWidth + s;
+    case "reverse":
+      return o.scrollWidth - o.clientWidth - s;
+    default:
+      return s;
+  }
+}
+function $t(o) {
+  return De("MuiPickersToolbarText", o);
+}
+const fo = we("MuiPickersToolbarText", ["root", "selected"]), Vt = ["className", "selected", "value"], _t = (o) => {
+  const {
+    classes: t,
+    selected: s
+  } = o;
+  return he({
+    root: ["root", s && "selected"]
+  }, $t, t);
+}, Lt = M(to, {
+  name: "MuiPickersToolbarText",
+  slot: "Root",
+  overridesResolver: (o, t) => [t.root, {
+    [`&.${fo.selected}`]: t.selected
+  }]
+})(({
+  theme: o
+}) => ({
+  transition: o.transitions.create("color"),
+  color: (o.vars || o).palette.text.secondary,
+  [`&.${fo.selected}`]: {
+    color: (o.vars || o).palette.text.primary
+  }
+})), _o = /* @__PURE__ */ T.forwardRef(function(t, s) {
+  const a = ne({
+    props: t,
+    name: "MuiPickersToolbarText"
+  }), {
+    className: r,
+    value: n
+  } = a, l = X(a, Vt), i = _t(a);
+  return /* @__PURE__ */ y(Lt, u({
+    ref: s,
+    className: Ie(r, i.root),
+    component: "span"
+  }, l, {
+    children: n
+  }));
+}), jt = ["align", "className", "selected", "typographyClassName", "value", "variant"], Wt = (o) => {
+  const {
+    classes: t
+  } = o;
+  return he({
+    root: ["root"]
+  }, rt, t);
+}, Ht = M(Bt, {
+  name: "MuiPickersToolbarButton",
+  slot: "Root",
+  overridesResolver: (o, t) => t.root
+})({
+  padding: 0,
+  minWidth: 16,
+  textTransform: "none"
+}), xe = /* @__PURE__ */ T.forwardRef(function(t, s) {
+  const a = ne({
+    props: t,
+    name: "MuiPickersToolbarButton"
+  }), {
+    align: r,
+    className: n,
+    selected: l,
+    typographyClassName: i,
+    value: c,
+    variant: d
+  } = a, v = X(a, jt), p = Wt(a);
+  return /* @__PURE__ */ y(Ht, u({
+    variant: "text",
+    ref: s,
+    className: Ie(n, p.root)
+  }, v, {
+    children: /* @__PURE__ */ y(_o, {
+      align: r,
+      className: i,
+      variant: d,
+      value: c,
+      selected: l
+    })
+  }));
+}), zt = ({
+  adapter: o,
+  value: t,
+  props: s
+}) => {
+  const {
+    minTime: a,
+    maxTime: r,
+    minutesStep: n,
+    shouldDisableClock: l,
+    shouldDisableTime: i,
+    disableIgnoringDatePartForTimeValidation: c = !1,
+    disablePast: d,
+    disableFuture: v
+  } = s, p = o.utils.date(), f = o.utils.date(t), g = wo(c, o.utils);
+  if (t === null)
+    return null;
+  switch (!0) {
+    case !o.utils.isValid(t):
+      return "invalidDate";
+    case !!(a && g(a, t)):
+      return "minTime";
+    case !!(r && g(t, r)):
+      return "maxTime";
+    case !!(v && o.utils.isAfter(f, p)):
+      return "disableFuture";
+    case !!(d && o.utils.isBefore(f, p)):
+      return "disablePast";
+    case !!(i && i(t, "hours")):
+      return "shouldDisableTime-hours";
+    case !!(i && i(t, "minutes")):
+      return "shouldDisableTime-minutes";
+    case !!(i && i(t, "seconds")):
+      return "shouldDisableTime-seconds";
+    case !!(l && l(o.utils.getHours(t), "hours")):
+      return "shouldDisableClock-hours";
+    case !!(l && l(o.utils.getMinutes(t), "minutes")):
+      return "shouldDisableClock-minutes";
+    case !!(l && l(o.utils.getSeconds(t), "seconds")):
+      return "shouldDisableClock-seconds";
+    case !!(n && o.utils.getMinutes(t) % n !== 0):
+      return "minutesStep";
+    default:
+      return null;
+  }
+}, co = ({
+  props: o,
+  value: t,
+  adapter: s
+}) => {
+  const a = at({
+    adapter: s,
+    value: t,
+    props: o
+  });
+  return a !== null ? a : zt({
+    adapter: s,
+    value: t,
+    props: o
+  });
+}, At = ["value", "defaultValue", "format", "formatDensity", "shouldRespectLeadingZeros", "onChange", "readOnly", "onError", "shouldDisableDate", "shouldDisableMonth", "shouldDisableYear", "minDate", "maxDate", "disableFuture", "disablePast", "minTime", "maxTime", "minDateTime", "maxDateTime", "minutesStep", "disableIgnoringDatePartForTimeValidation", "shouldDisableClock", "shouldDisableTime", "selectedSections", "onSelectedSectionsChange", "ampm", "unstableFieldRef"], Ut = (o) => {
+  var t, s, a, r, n, l, i, c;
+  const d = je(), v = Do(), f = ((t = o.ampm) != null ? t : d.is12HourCycleInCurrentLocale()) ? d.formats.keyboardDateTime12h : d.formats.keyboardDateTime24h;
+  return u({}, o, {
+    disablePast: (s = o.disablePast) != null ? s : !1,
+    disableFuture: (a = o.disableFuture) != null ? a : !1,
+    format: (r = o.format) != null ? r : f,
+    disableIgnoringDatePartForTimeValidation: !!(o.minDateTime || o.maxDateTime),
+    minDate: Ye(d, (n = o.minDateTime) != null ? n : o.minDate, v.minDate),
+    maxDate: Ye(d, (l = o.maxDateTime) != null ? l : o.maxDate, v.maxDate),
+    minTime: (i = o.minDateTime) != null ? i : o.minTime,
+    maxTime: (c = o.maxDateTime) != null ? c : o.maxTime
+  });
+}, qt = ({
+  props: o,
+  inputRef: t
+}) => {
+  const s = Ut(o), {
+    value: a,
+    defaultValue: r,
+    format: n,
+    formatDensity: l,
+    shouldRespectLeadingZeros: i,
+    onChange: c,
+    readOnly: d,
+    onError: v,
+    shouldDisableDate: p,
+    shouldDisableMonth: f,
+    shouldDisableYear: g,
+    minDate: x,
+    maxDate: m,
+    disableFuture: C,
+    disablePast: N,
+    minTime: P,
+    maxTime: F,
+    minutesStep: B,
+    disableIgnoringDatePartForTimeValidation: O,
+    shouldDisableClock: w,
+    shouldDisableTime: j,
+    selectedSections: W,
+    onSelectedSectionsChange: I,
+    ampm: $,
+    unstableFieldRef: G
+  } = s, ae = X(s, At);
+  return lt({
+    inputRef: t,
+    forwardedProps: ae,
+    internalProps: {
+      value: a,
+      defaultValue: r,
+      format: n,
+      formatDensity: l,
+      shouldRespectLeadingZeros: i,
+      onChange: c,
+      readOnly: d,
+      onError: v,
+      shouldDisableDate: p,
+      shouldDisableMonth: f,
+      shouldDisableYear: g,
+      minDate: x,
+      maxDate: m,
+      disableFuture: C,
+      disablePast: N,
+      minTime: P,
+      maxTime: F,
+      minutesStep: B,
+      shouldDisableClock: w,
+      shouldDisableTime: j,
+      disableIgnoringDatePartForTimeValidation: O,
+      selectedSections: W,
+      onSelectedSectionsChange: I,
+      ampm: $,
+      unstableFieldRef: G
+    },
+    valueManager: so,
+    fieldValueManager: it,
+    validator: co,
+    valueType: "date-time"
+  });
+}, Yt = ["components", "componentsProps", "slots", "slotProps", "InputProps", "inputProps"], Kt = ["inputRef"], Xt = ["ref", "onPaste", "inputMode", "readOnly"], uo = /* @__PURE__ */ T.forwardRef(function(t, s) {
+  var a, r, n;
+  const l = ne({
+    props: t,
+    name: "MuiDateTimeField"
+  }), {
+    components: i,
+    componentsProps: c,
+    slots: d,
+    slotProps: v,
+    InputProps: p,
+    inputProps: f
+  } = l, g = X(l, Yt), x = l, m = (a = (r = d == null ? void 0 : d.textField) != null ? r : i == null ? void 0 : i.TextField) != null ? a : Ft, C = _e({
+    elementType: m,
+    externalSlotProps: (n = v == null ? void 0 : v.textField) != null ? n : c == null ? void 0 : c.textField,
+    externalForwardedProps: g,
+    ownerState: x
+  }), {
+    inputRef: N
+  } = C, P = X(C, Kt);
+  P.inputProps = u({}, P.inputProps, f), P.InputProps = u({}, P.InputProps, p);
+  const F = qt({
+    props: P,
+    inputRef: N
+  }), {
+    ref: B,
+    onPaste: O,
+    inputMode: w,
+    readOnly: j
+  } = F, W = X(F, Xt);
+  return /* @__PURE__ */ y(m, u({
+    ref: s
+  }, W, {
+    InputProps: u({}, W.InputProps, {
+      readOnly: j
+    }),
+    inputProps: u({}, W.inputProps, {
+      inputMode: w,
+      onPaste: O,
+      ref: B
+    })
+  }));
+});
+process.env.NODE_ENV !== "production" && (uo.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  /**
+   * 12h/24h view for hour selection clock.
+   * @default `utils.is12HourCycleInCurrentLocale()`
+   */
+  ampm: e.bool,
+  /**
+   * If `true`, the `input` element is focused during the first mount.
+   * @default false
+   */
+  autoFocus: e.bool,
+  className: e.string,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#adding-new-colors).
+   * @default 'primary'
+   */
+  color: e.oneOf(["error", "info", "primary", "secondary", "success", "warning"]),
+  /**
+   * Overridable components.
+   * @default {}
+   * @deprecated Please use `slots`.
+   */
+  components: e.object,
+  /**
+   * The props used for each component slot.
+   * @default {}
+   * @deprecated Please use `slotProps`.
+   */
+  componentsProps: e.object,
+  /**
+   * The default value. Use when the component is not controlled.
+   */
+  defaultValue: e.any,
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: e.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: e.bool,
+  /**
+   * Do not ignore date part when validating min/max time.
+   * @default false
+   */
+  disableIgnoringDatePartForTimeValidation: e.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: e.bool,
+  /**
+   * If `true`, the component is displayed in focused state.
+   */
+  focused: e.bool,
+  /**
+   * Format of the date when rendered in the input(s).
+   */
+  format: e.string,
+  /**
+   * Density of the format when rendered in the input.
+   * Setting `formatDensity` to `"spacious"` will add a space before and after each `/`, `-` and `.` character.
+   * @default "dense"
+   */
+  formatDensity: e.oneOf(["dense", "spacious"]),
+  /**
+   * Props applied to the [`FormHelperText`](/material-ui/api/form-helper-text/) element.
+   */
+  FormHelperTextProps: e.object,
+  /**
+   * If `true`, the input will take up the full width of its container.
+   * @default false
+   */
+  fullWidth: e.bool,
+  /**
+   * The helper text content.
+   */
+  helperText: e.node,
+  /**
+   * If `true`, the label is hidden.
+   * This is used to increase density for a `FilledInput`.
+   * Be sure to add `aria-label` to the `input` element.
+   * @default false
+   */
+  hiddenLabel: e.bool,
+  /**
+   * The id of the `input` element.
+   * Use this prop to make `label` and `helperText` accessible for screen readers.
+   */
+  id: e.string,
+  /**
+   * Props applied to the [`InputLabel`](/material-ui/api/input-label/) element.
+   * Pointer events like `onClick` are enabled if and only if `shrink` is `true`.
+   */
+  InputLabelProps: e.object,
+  /**
+   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
+   */
+  inputProps: e.object,
+  /**
+   * Props applied to the Input element.
+   * It will be a [`FilledInput`](/material-ui/api/filled-input/),
+   * [`OutlinedInput`](/material-ui/api/outlined-input/) or [`Input`](/material-ui/api/input/)
+   * component depending on the `variant` prop value.
+   */
+  InputProps: e.object,
+  /**
+   * Pass a ref to the `input` element.
+   */
+  inputRef: e.oneOfType([e.func, e.shape({
+    current: e.any.isRequired
+  })]),
+  /**
+   * The label content.
+   */
+  label: e.node,
+  /**
+   * If `dense` or `normal`, will adjust vertical spacing of this and contained components.
+   * @default 'none'
+   */
+  margin: e.oneOf(["dense", "none", "normal"]),
+  /**
+   * Maximal selectable date.
+   */
+  maxDate: e.any,
+  /**
+   * Maximal selectable moment of time with binding to date, to set max time in each day use `maxTime`.
+   */
+  maxDateTime: e.any,
+  /**
+   * Maximal selectable time.
+   * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`.
+   */
+  maxTime: e.any,
+  /**
+   * Minimal selectable date.
+   */
+  minDate: e.any,
+  /**
+   * Minimal selectable moment of time with binding to date, to set min time in each day use `minTime`.
+   */
+  minDateTime: e.any,
+  /**
+   * Minimal selectable time.
+   * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`.
+   */
+  minTime: e.any,
+  /**
+   * Step over minutes.
+   * @default 1
+   */
+  minutesStep: e.number,
+  /**
+   * Name attribute of the `input` element.
+   */
+  name: e.string,
+  onBlur: e.func,
+  /**
+   * Callback fired when the value changes.
+   * @template TValue The value type. Will be either the same type as `value` or `null`. Can be in `[start, end]` format in case of range value.
+   * @template TError The validation error type. Will be either `string` or a `null`. Can be in `[start, end]` format in case of range value.
+   * @param {TValue} value The new value.
+   * @param {FieldChangeHandlerContext<TError>} context The context containing the validation result of the current value.
+   */
+  onChange: e.func,
+  /**
+   * Callback fired when the error associated to the current value changes.
+   * @template TValue The value type. Will be either the same type as `value` or `null`. Can be in `[start, end]` format in case of range value.
+   * @template TError The validation error type. Will be either `string` or a `null`. Can be in `[start, end]` format in case of range value.
+   * @param {TError} error The new error.
+   * @param {TValue} value The value associated to the error.
+   */
+  onError: e.func,
+  onFocus: e.func,
+  /**
+   * Callback fired when the selected sections change.
+   * @param {FieldSelectedSections} newValue The new selected sections.
+   */
+  onSelectedSectionsChange: e.func,
+  /**
+   * It prevents the user from changing the value of the field
+   * (not from interacting with the field).
+   * @default false
+   */
+  readOnly: e.bool,
+  /**
+   * If `true`, the label is displayed as required and the `input` element is required.
+   * @default false
+   */
+  required: e.bool,
+  /**
+   * The currently selected sections.
+   * This prop accept four formats:
+   * 1. If a number is provided, the section at this index will be selected.
+   * 2. If an object with a `startIndex` and `endIndex` properties are provided, the sections between those two indexes will be selected.
+   * 3. If a string of type `FieldSectionType` is provided, the first section with that name will be selected.
+   * 4. If `null` is provided, no section will be selected
+   * If not provided, the selected sections will be handled internally.
+   */
+  selectedSections: e.oneOfType([e.oneOf(["all", "day", "hours", "meridiem", "minutes", "month", "seconds", "weekDay", "year"]), e.number, e.shape({
+    endIndex: e.number.isRequired,
+    startIndex: e.number.isRequired
+  })]),
+  /**
+   * Disable specific clock time.
+   * @param {number} clockValue The value to check.
+   * @param {TimeView} view The clock type of the timeValue.
+   * @returns {boolean} If `true` the time will be disabled.
+   * @deprecated Consider using `shouldDisableTime`.
+   */
+  shouldDisableClock: e.func,
+  /**
+   * Disable specific date.
+   * @template TDate
+   * @param {TDate} day The date to test.
+   * @returns {boolean} If `true` the date will be disabled.
+   */
+  shouldDisableDate: e.func,
+  /**
+   * Disable specific month.
+   * @template TDate
+   * @param {TDate} month The month to test.
+   * @returns {boolean} If `true`, the month will be disabled.
+   */
+  shouldDisableMonth: e.func,
+  /**
+   * Disable specific time.
+   * @template TDate
+   * @param {TDate} value The value to check.
+   * @param {TimeView} view The clock type of the timeValue.
+   * @returns {boolean} If `true` the time will be disabled.
+   */
+  shouldDisableTime: e.func,
+  /**
+   * Disable specific year.
+   * @template TDate
+   * @param {TDate} year The year to test.
+   * @returns {boolean} If `true`, the year will be disabled.
+   */
+  shouldDisableYear: e.func,
+  /**
+   * If `true`, the format will respect the leading zeroes (e.g: on dayjs, the format `M/D/YYYY` will render `8/16/2018`)
+   * If `false`, the format will always add leading zeroes (e.g: on dayjs, the format `M/D/YYYY` will render `08/16/2018`)
+   *
+   * Warning n°1: Luxon is not able to respect the leading zeroes when using macro tokens (e.g: "DD"), so `shouldRespectLeadingZeros={true}` might lead to inconsistencies when using `AdapterLuxon`.
+   *
+   * Warning n°2: When `shouldRespectLeadingZeros={true}`, the field will add an invisible character on the sections containing a single digit to make sure `onChange` is fired.
+   * If you need to get the clean value from the input, you can remove this character using `input.value.replace(/\u200e/g, '')`.
+   *
+   * Warning n°3: When used in strict mode, dayjs and moment require to respect the leading zeros.
+   * This mean that when using `shouldRespectLeadingZeros={false}`, if you retrieve the value directly from the input (not listening to `onChange`) and your format contains tokens without leading zeros, the value will not be parsed by your library.
+   *
+   * @default `false`
+   */
+  shouldRespectLeadingZeros: e.bool,
+  /**
+   * The size of the component.
+   */
+  size: e.oneOf(["medium", "small"]),
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps: e.object,
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots: e.object,
+  style: e.object,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object]),
+  /**
+   * The ref object used to imperatively interact with the field.
+   */
+  unstableFieldRef: e.oneOfType([e.func, e.object]),
+  /**
+   * The selected value.
+   * Used when the component is controlled.
+   */
+  value: e.any,
+  /**
+   * The variant to use.
+   * @default 'outlined'
+   */
+  variant: e.oneOf(["filled", "outlined", "standard"])
+});
+function Gt(o) {
+  return ao("MuiTab", o);
+}
+const me = ro("MuiTab", ["root", "labelIcon", "textColorInherit", "textColorPrimary", "textColorSecondary", "selected", "disabled", "fullWidth", "wrapped", "iconWrapper"]), Qt = ["className", "disabled", "disableFocusRipple", "fullWidth", "icon", "iconPosition", "indicator", "label", "onChange", "onClick", "onFocus", "selected", "selectionFollowsFocus", "textColor", "value", "wrapped"], Zt = (o) => {
+  const {
+    classes: t,
+    textColor: s,
+    fullWidth: a,
+    wrapped: r,
+    icon: n,
+    label: l,
+    selected: i,
+    disabled: c
+  } = o, d = {
+    root: ["root", n && l && "labelIcon", `textColor${Mo(s)}`, a && "fullWidth", r && "wrapped", i && "selected", c && "disabled"],
+    iconWrapper: ["iconWrapper"]
+  };
+  return io(d, Gt, t);
+}, Jt = M(Eo, {
+  name: "MuiTab",
+  slot: "Root",
+  overridesResolver: (o, t) => {
+    const {
+      ownerState: s
+    } = o;
+    return [t.root, s.label && s.icon && t.labelIcon, t[`textColor${Mo(s.textColor)}`], s.fullWidth && t.fullWidth, s.wrapped && t.wrapped, {
+      [`& .${me.iconWrapper}`]: t.iconWrapper
+    }];
+  }
+})(({
+  theme: o,
+  ownerState: t
+}) => u({}, o.typography.button, {
+  maxWidth: 360,
+  minWidth: 90,
+  position: "relative",
+  minHeight: 48,
+  flexShrink: 0,
+  padding: "12px 16px",
+  overflow: "hidden",
+  whiteSpace: "normal",
+  textAlign: "center"
+}, t.label && {
+  flexDirection: t.iconPosition === "top" || t.iconPosition === "bottom" ? "column" : "row"
+}, {
+  lineHeight: 1.25
+}, t.icon && t.label && {
+  minHeight: 72,
+  paddingTop: 9,
+  paddingBottom: 9,
+  [`& > .${me.iconWrapper}`]: u({}, t.iconPosition === "top" && {
+    marginBottom: 6
+  }, t.iconPosition === "bottom" && {
+    marginTop: 6
+  }, t.iconPosition === "start" && {
+    marginRight: o.spacing(1)
+  }, t.iconPosition === "end" && {
+    marginLeft: o.spacing(1)
+  })
+}, t.textColor === "inherit" && {
+  color: "inherit",
+  opacity: 0.6,
+  // same opacity as theme.palette.text.secondary
+  [`&.${me.selected}`]: {
+    opacity: 1
+  },
+  [`&.${me.disabled}`]: {
+    opacity: (o.vars || o).palette.action.disabledOpacity
+  }
+}, t.textColor === "primary" && {
+  color: (o.vars || o).palette.text.secondary,
+  [`&.${me.selected}`]: {
+    color: (o.vars || o).palette.primary.main
+  },
+  [`&.${me.disabled}`]: {
+    color: (o.vars || o).palette.text.disabled
+  }
+}, t.textColor === "secondary" && {
+  color: (o.vars || o).palette.text.secondary,
+  [`&.${me.selected}`]: {
+    color: (o.vars || o).palette.secondary.main
+  },
+  [`&.${me.disabled}`]: {
+    color: (o.vars || o).palette.text.disabled
+  }
+}, t.fullWidth && {
+  flexShrink: 1,
+  flexGrow: 1,
+  flexBasis: 0,
+  maxWidth: "none"
+}, t.wrapped && {
+  fontSize: o.typography.pxToRem(12)
+})), no = /* @__PURE__ */ T.forwardRef(function(t, s) {
+  const a = lo({
+    props: t,
+    name: "MuiTab"
+  }), {
+    className: r,
+    disabled: n = !1,
+    disableFocusRipple: l = !1,
+    // eslint-disable-next-line react/prop-types
+    fullWidth: i,
+    icon: c,
+    iconPosition: d = "top",
+    // eslint-disable-next-line react/prop-types
+    indicator: v,
+    label: p,
+    onChange: f,
+    onClick: g,
+    onFocus: x,
+    // eslint-disable-next-line react/prop-types
+    selected: m,
+    // eslint-disable-next-line react/prop-types
+    selectionFollowsFocus: C,
+    // eslint-disable-next-line react/prop-types
+    textColor: N = "inherit",
+    value: P,
+    wrapped: F = !1
+  } = a, B = X(a, Qt), O = u({}, a, {
+    disabled: n,
+    disableFocusRipple: l,
+    selected: m,
+    icon: !!c,
+    iconPosition: d,
+    label: !!p,
+    fullWidth: i,
+    textColor: N,
+    wrapped: F
+  }), w = Zt(O), j = c && p && /* @__PURE__ */ T.isValidElement(c) ? /* @__PURE__ */ T.cloneElement(c, {
+    className: pe(w.iconWrapper, c.props.className)
+  }) : c, W = ($) => {
+    !m && f && f($, P), g && g($);
+  }, I = ($) => {
+    C && !m && f && f($, P), x && x($);
+  };
+  return /* @__PURE__ */ z(Jt, u({
+    focusRipple: !l,
+    className: pe(w.root, r),
+    ref: s,
+    role: "tab",
+    "aria-selected": m,
+    disabled: n,
+    onClick: W,
+    onFocus: I,
+    ownerState: O,
+    tabIndex: m ? 0 : -1
+  }, B, {
+    children: [d === "top" || d === "start" ? /* @__PURE__ */ z(T.Fragment, {
+      children: [j, p]
+    }) : /* @__PURE__ */ z(T.Fragment, {
+      children: [p, j]
+    }), v]
+  }));
+});
+process.env.NODE_ENV !== "production" && (no.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * This prop isn't supported.
+   * Use the `component` prop if you need to change the children structure.
+   */
+  children: Nt,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: e.object,
+  /**
+   * @ignore
+   */
+  className: e.string,
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: e.bool,
+  /**
+   * If `true`, the  keyboard focus ripple is disabled.
+   * @default false
+   */
+  disableFocusRipple: e.bool,
+  /**
+   * If `true`, the ripple effect is disabled.
+   *
+   * ⚠️ Without a ripple there is no styling for :focus-visible by default. Be sure
+   * to highlight the element by applying separate styles with the `.Mui-focusVisible` class.
+   * @default false
+   */
+  disableRipple: e.bool,
+  /**
+   * The icon to display.
+   */
+  icon: e.oneOfType([e.element, e.string]),
+  /**
+   * The position of the icon relative to the label.
+   * @default 'top'
+   */
+  iconPosition: e.oneOf(["bottom", "end", "start", "top"]),
+  /**
+   * The label element.
+   */
+  label: e.node,
+  /**
+   * @ignore
+   */
+  onChange: e.func,
+  /**
+   * @ignore
+   */
+  onClick: e.func,
+  /**
+   * @ignore
+   */
+  onFocus: e.func,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object]),
+  /**
+   * You can provide your own value. Otherwise, we fallback to the child position index.
+   */
+  value: e.any,
+  /**
+   * Tab labels appear in a single row.
+   * They can use a second line if needed.
+   * @default false
+   */
+  wrapped: e.bool
+});
+function en(o) {
+  return (1 + Math.sin(Math.PI * o - Math.PI / 2)) / 2;
+}
+function on(o, t, s, a = {}, r = () => {
+}) {
+  const {
+    ease: n = en,
+    duration: l = 300
+    // standard
+  } = a;
+  let i = null;
+  const c = t[o];
+  let d = !1;
+  const v = () => {
+    d = !0;
+  }, p = (f) => {
+    if (d) {
+      r(new Error("Animation cancelled"));
+      return;
+    }
+    i === null && (i = f);
+    const g = Math.min(1, (f - i) / l);
+    if (t[o] = n(g) * (s - c) + c, g >= 1) {
+      requestAnimationFrame(() => {
+        r(null);
+      });
+      return;
+    }
+    requestAnimationFrame(p);
+  };
+  return c === s ? (r(new Error("Element already at target position")), v) : (requestAnimationFrame(p), v);
+}
+const tn = ["onChange"], nn = {
+  width: 99,
+  height: 99,
+  position: "absolute",
+  top: -9999,
+  overflow: "scroll"
+};
+function Lo(o) {
+  const {
+    onChange: t
+  } = o, s = X(o, tn), a = T.useRef(), r = T.useRef(null), n = () => {
+    a.current = r.current.offsetHeight - r.current.clientHeight;
+  };
+  return Rt(() => {
+    const l = No(() => {
+      const c = a.current;
+      n(), c !== a.current && t(a.current);
+    }), i = Bo(r.current);
+    return i.addEventListener("resize", l), () => {
+      l.clear(), i.removeEventListener("resize", l);
+    };
+  }, [t]), T.useEffect(() => {
+    n(), t(a.current);
+  }, [t]), /* @__PURE__ */ y("div", u({
+    style: nn
+  }, s, {
+    ref: r
+  }));
+}
+process.env.NODE_ENV !== "production" && (Lo.propTypes = {
+  onChange: e.func.isRequired
+});
+const sn = Fo(/* @__PURE__ */ y("path", {
+  d: "M15.41 16.09l-4.58-4.59 4.58-4.59L14 5.5l-6 6 6 6z"
+}), "KeyboardArrowLeft"), rn = Fo(/* @__PURE__ */ y("path", {
+  d: "M8.59 16.34l4.58-4.59-4.58-4.59L10 5.75l6 6-6 6z"
+}), "KeyboardArrowRight");
+function an(o) {
+  return ao("MuiTabScrollButton", o);
+}
+const ln = ro("MuiTabScrollButton", ["root", "vertical", "horizontal", "disabled"]), cn = ["className", "slots", "slotProps", "direction", "orientation", "disabled"], un = (o) => {
+  const {
+    classes: t,
+    orientation: s,
+    disabled: a
+  } = o;
+  return io({
+    root: ["root", s, a && "disabled"]
+  }, an, t);
+}, dn = M(Eo, {
+  name: "MuiTabScrollButton",
+  slot: "Root",
+  overridesResolver: (o, t) => {
+    const {
+      ownerState: s
+    } = o;
+    return [t.root, s.orientation && t[s.orientation]];
+  }
+})(({
+  ownerState: o
+}) => u({
+  width: 40,
+  flexShrink: 0,
+  opacity: 0.8,
+  [`&.${ln.disabled}`]: {
+    opacity: 0
+  }
+}, o.orientation === "vertical" && {
+  width: "100%",
+  height: 40,
+  "& svg": {
+    transform: `rotate(${o.isRtl ? -90 : 90}deg)`
+  }
+})), jo = /* @__PURE__ */ T.forwardRef(function(t, s) {
+  var a, r;
+  const n = lo({
+    props: t,
+    name: "MuiTabScrollButton"
+  }), {
+    className: l,
+    slots: i = {},
+    slotProps: c = {},
+    direction: d
+  } = n, v = X(n, cn), p = Ro(), f = u({
+    isRtl: p
+  }, n), g = un(f), x = (a = i.StartScrollButtonIcon) != null ? a : sn, m = (r = i.EndScrollButtonIcon) != null ? r : rn, C = _e({
+    elementType: x,
+    externalSlotProps: c.startScrollButtonIcon,
+    additionalProps: {
+      fontSize: "small"
+    },
+    ownerState: f
+  }), N = _e({
+    elementType: m,
+    externalSlotProps: c.endScrollButtonIcon,
+    additionalProps: {
+      fontSize: "small"
+    },
+    ownerState: f
+  });
+  return /* @__PURE__ */ y(dn, u({
+    component: "div",
+    className: pe(g.root, l),
+    ref: s,
+    role: null,
+    ownerState: f,
+    tabIndex: null
+  }, v, {
+    children: d === "left" ? /* @__PURE__ */ y(x, u({}, C)) : /* @__PURE__ */ y(m, u({}, N))
+  }));
+});
+process.env.NODE_ENV !== "production" && (jo.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: e.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: e.object,
+  /**
+   * @ignore
+   */
+  className: e.string,
+  /**
+   * The direction the button should indicate.
+   */
+  direction: e.oneOf(["left", "right"]).isRequired,
+  /**
+   * If `true`, the component is disabled.
+   * @default false
+   */
+  disabled: e.bool,
+  /**
+   * The component orientation (layout flow direction).
+   */
+  orientation: e.oneOf(["horizontal", "vertical"]).isRequired,
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   * @default {}
+   */
+  slotProps: e.shape({
+    endScrollButtonIcon: e.oneOfType([e.func, e.object]),
+    startScrollButtonIcon: e.oneOfType([e.func, e.object])
+  }),
+  /**
+   * The components used for each slot inside.
+   * @default {}
+   */
+  slots: e.shape({
+    EndScrollButtonIcon: e.elementType,
+    StartScrollButtonIcon: e.elementType
+  }),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object])
+});
+function mn(o) {
+  return ao("MuiTabs", o);
+}
+const qe = ro("MuiTabs", ["root", "vertical", "flexContainer", "flexContainerVertical", "centered", "scroller", "fixed", "scrollableX", "scrollableY", "hideScrollbar", "scrollButtons", "scrollButtonsHideMobile", "indicator"]), pn = ["aria-label", "aria-labelledby", "action", "centered", "children", "className", "component", "allowScrollButtonsMobile", "indicatorColor", "onChange", "orientation", "ScrollButtonComponent", "scrollButtons", "selectionFollowsFocus", "slots", "slotProps", "TabIndicatorProps", "TabScrollButtonProps", "textColor", "value", "variant", "visibleScrollbar"], ho = (o, t) => o === t ? o.firstChild : t && t.nextElementSibling ? t.nextElementSibling : o.firstChild, To = (o, t) => o === t ? o.lastChild : t && t.previousElementSibling ? t.previousElementSibling : o.lastChild, Ae = (o, t, s) => {
+  let a = !1, r = s(o, t);
+  for (; r; ) {
+    if (r === o.firstChild) {
+      if (a)
+        return;
+      a = !0;
+    }
+    const n = r.disabled || r.getAttribute("aria-disabled") === "true";
+    if (!r.hasAttribute("tabindex") || n)
+      r = s(o, r);
+    else {
+      r.focus();
+      return;
+    }
+  }
+}, bn = (o) => {
+  const {
+    vertical: t,
+    fixed: s,
+    hideScrollbar: a,
+    scrollableX: r,
+    scrollableY: n,
+    centered: l,
+    scrollButtonsHideMobile: i,
+    classes: c
+  } = o;
+  return io({
+    root: ["root", t && "vertical"],
+    scroller: ["scroller", s && "fixed", a && "hideScrollbar", r && "scrollableX", n && "scrollableY"],
+    flexContainer: ["flexContainer", t && "flexContainerVertical", l && "centered"],
+    indicator: ["indicator"],
+    scrollButtons: ["scrollButtons", i && "scrollButtonsHideMobile"],
+    scrollableX: [r && "scrollableX"],
+    hideScrollbar: [a && "hideScrollbar"]
+  }, mn, c);
+}, fn = M("div", {
+  name: "MuiTabs",
+  slot: "Root",
+  overridesResolver: (o, t) => {
+    const {
+      ownerState: s
+    } = o;
+    return [{
+      [`& .${qe.scrollButtons}`]: t.scrollButtons
+    }, {
+      [`& .${qe.scrollButtons}`]: s.scrollButtonsHideMobile && t.scrollButtonsHideMobile
+    }, t.root, s.vertical && t.vertical];
+  }
+})(({
+  ownerState: o,
+  theme: t
+}) => u({
+  overflow: "hidden",
+  minHeight: 48,
+  // Add iOS momentum scrolling for iOS < 13.0
+  WebkitOverflowScrolling: "touch",
+  display: "flex"
+}, o.vertical && {
+  flexDirection: "column"
+}, o.scrollButtonsHideMobile && {
+  [`& .${qe.scrollButtons}`]: {
+    [t.breakpoints.down("sm")]: {
+      display: "none"
+    }
+  }
+})), hn = M("div", {
+  name: "MuiTabs",
+  slot: "Scroller",
+  overridesResolver: (o, t) => {
+    const {
+      ownerState: s
+    } = o;
+    return [t.scroller, s.fixed && t.fixed, s.hideScrollbar && t.hideScrollbar, s.scrollableX && t.scrollableX, s.scrollableY && t.scrollableY];
+  }
+})(({
+  ownerState: o
+}) => u({
+  position: "relative",
+  display: "inline-block",
+  flex: "1 1 auto",
+  whiteSpace: "nowrap"
+}, o.fixed && {
+  overflowX: "hidden",
+  width: "100%"
+}, o.hideScrollbar && {
+  // Hide dimensionless scrollbar on macOS
+  scrollbarWidth: "none",
+  // Firefox
+  "&::-webkit-scrollbar": {
+    display: "none"
+    // Safari + Chrome
+  }
+}, o.scrollableX && {
+  overflowX: "auto",
+  overflowY: "hidden"
+}, o.scrollableY && {
+  overflowY: "auto",
+  overflowX: "hidden"
+})), Tn = M("div", {
+  name: "MuiTabs",
+  slot: "FlexContainer",
+  overridesResolver: (o, t) => {
+    const {
+      ownerState: s
+    } = o;
+    return [t.flexContainer, s.vertical && t.flexContainerVertical, s.centered && t.centered];
+  }
+})(({
+  ownerState: o
+}) => u({
+  display: "flex"
+}, o.vertical && {
+  flexDirection: "column"
+}, o.centered && {
+  justifyContent: "center"
+})), gn = M("span", {
+  name: "MuiTabs",
+  slot: "Indicator",
+  overridesResolver: (o, t) => t.indicator
+})(({
+  ownerState: o,
+  theme: t
+}) => u({
+  position: "absolute",
+  height: 2,
+  bottom: 0,
+  width: "100%",
+  transition: t.transitions.create()
+}, o.indicatorColor === "primary" && {
+  backgroundColor: (t.vars || t).palette.primary.main
+}, o.indicatorColor === "secondary" && {
+  backgroundColor: (t.vars || t).palette.secondary.main
+}, o.vertical && {
+  height: "100%",
+  width: 2,
+  right: 0
+})), yn = M(Lo)({
+  overflowX: "auto",
+  overflowY: "hidden",
+  // Hide dimensionless scrollbar on macOS
+  scrollbarWidth: "none",
+  // Firefox
+  "&::-webkit-scrollbar": {
+    display: "none"
+    // Safari + Chrome
+  }
+}), go = {};
+let yo = !1;
+const Wo = /* @__PURE__ */ T.forwardRef(function(t, s) {
+  const a = lo({
+    props: t,
+    name: "MuiTabs"
+  }), r = Oo(), n = Ro(), {
+    "aria-label": l,
+    "aria-labelledby": i,
+    action: c,
+    centered: d = !1,
+    children: v,
+    className: p,
+    component: f = "div",
+    allowScrollButtonsMobile: g = !1,
+    indicatorColor: x = "primary",
+    onChange: m,
+    orientation: C = "horizontal",
+    ScrollButtonComponent: N = jo,
+    scrollButtons: P = "auto",
+    selectionFollowsFocus: F,
+    slots: B = {},
+    slotProps: O = {},
+    TabIndicatorProps: w = {},
+    TabScrollButtonProps: j = {},
+    textColor: W = "primary",
+    value: I,
+    variant: $ = "standard",
+    visibleScrollbar: G = !1
+  } = a, ae = X(a, pn), q = $ === "scrollable", U = C === "vertical", le = U ? "scrollTop" : "scrollLeft", ie = U ? "top" : "left", Q = U ? "bottom" : "right", Te = U ? "clientHeight" : "clientWidth", k = U ? "height" : "width", Z = u({}, a, {
+    component: f,
+    allowScrollButtonsMobile: g,
+    indicatorColor: x,
+    orientation: C,
+    vertical: U,
+    scrollButtons: P,
+    textColor: W,
+    variant: $,
+    visibleScrollbar: G,
+    fixed: !q,
+    hideScrollbar: q && !G,
+    scrollableX: q && !U,
+    scrollableY: q && U,
+    centered: d && !q,
+    scrollButtonsHideMobile: !g
+  }), Y = bn(Z), oe = _e({
+    elementType: B.StartScrollButtonIcon,
+    externalSlotProps: O.startScrollButtonIcon,
+    ownerState: Z
+  }), Be = _e({
+    elementType: B.EndScrollButtonIcon,
+    externalSlotProps: O.endScrollButtonIcon,
+    ownerState: Z
+  });
+  process.env.NODE_ENV !== "production" && d && q && console.error('MUI: You can not use the `centered={true}` and `variant="scrollable"` properties at the same time on a `Tabs` component.');
+  const [ge, Fe] = T.useState(!1), [se, Ee] = T.useState(go), [$e, ye] = T.useState(!1), [H, ve] = T.useState(!1), [We, Ce] = T.useState(!1), [ce, Xe] = T.useState({
+    overflow: "hidden",
+    scrollbarWidth: 0
+  }), ue = /* @__PURE__ */ new Map(), J = T.useRef(null), R = T.useRef(null), V = () => {
+    const b = J.current;
+    let h;
+    if (b) {
+      const S = b.getBoundingClientRect();
+      h = {
+        clientWidth: b.clientWidth,
+        scrollLeft: b.scrollLeft,
+        scrollTop: b.scrollTop,
+        scrollLeftNormalized: Et(b, n ? "rtl" : "ltr"),
+        scrollWidth: b.scrollWidth,
+        top: S.top,
+        bottom: S.bottom,
+        left: S.left,
+        right: S.right
+      };
+    }
+    let D;
+    if (b && I !== !1) {
+      const S = R.current.children;
+      if (S.length > 0) {
+        const E = S[ue.get(I)];
+        process.env.NODE_ENV !== "production" && (E || console.error(["MUI: The `value` provided to the Tabs component is invalid.", `None of the Tabs' children match with "${I}".`, ue.keys ? `You can provide one of the following values: ${Array.from(ue.keys()).join(", ")}.` : null].join(`
+`))), D = E ? E.getBoundingClientRect() : null, process.env.NODE_ENV !== "production" && process.env.NODE_ENV !== "test" && !yo && D && D.width === 0 && D.height === 0 && // if the whole Tabs component is hidden, don't warn
+        h.clientWidth !== 0 && (h = null, console.error(["MUI: The `value` provided to the Tabs component is invalid.", `The Tab with this \`value\` ("${I}") is not part of the document layout.`, "Make sure the tab item is present in the document or that it's not `display: none`."].join(`
+`)), yo = !0);
+      }
+    }
+    return {
+      tabsMeta: h,
+      tabMeta: D
+    };
+  }, _ = Je(() => {
+    const {
+      tabsMeta: b,
+      tabMeta: h
+    } = V();
+    let D = 0, S;
+    if (U)
+      S = "top", h && b && (D = h.top - b.top + b.scrollTop);
+    else if (S = n ? "right" : "left", h && b) {
+      const K = n ? b.scrollLeftNormalized + b.clientWidth - b.scrollWidth : b.scrollLeft;
+      D = (n ? -1 : 1) * (h[S] - b[S] + K);
+    }
+    const E = {
+      [S]: D,
+      // May be wrong until the font is loaded.
+      [k]: h ? h[k] : 0
+    };
+    if (isNaN(se[S]) || isNaN(se[k]))
+      Ee(E);
+    else {
+      const K = Math.abs(se[S] - E[S]), re = Math.abs(se[k] - E[k]);
+      (K >= 1 || re >= 1) && Ee(E);
+    }
+  }), te = (b, {
+    animation: h = !0
+  } = {}) => {
+    h ? on(le, J.current, b, {
+      duration: r.transitions.duration.standard
+    }) : J.current[le] = b;
+  }, Pe = (b) => {
+    let h = J.current[le];
+    U ? h += b : (h += b * (n ? -1 : 1), h *= n && Vo() === "reverse" ? -1 : 1), te(h);
+  }, Se = () => {
+    const b = J.current[Te];
+    let h = 0;
+    const D = Array.from(R.current.children);
+    for (let S = 0; S < D.length; S += 1) {
+      const E = D[S];
+      if (h + E[Te] > b) {
+        S === 0 && (h = b);
+        break;
+      }
+      h += E[Te];
+    }
+    return h;
+  }, L = () => {
+    Pe(-1 * Se());
+  }, ee = () => {
+    Pe(Se());
+  }, ke = T.useCallback((b) => {
+    Xe({
+      overflow: null,
+      scrollbarWidth: b
+    });
+  }, []), Ge = () => {
+    const b = {};
+    b.scrollbarSizeListener = q ? /* @__PURE__ */ y(yn, {
+      onChange: ke,
+      className: pe(Y.scrollableX, Y.hideScrollbar)
+    }) : null;
+    const D = q && (P === "auto" && ($e || H) || P === !0);
+    return b.scrollButtonStart = D ? /* @__PURE__ */ y(N, u({
+      slots: {
+        StartScrollButtonIcon: B.StartScrollButtonIcon
+      },
+      slotProps: {
+        startScrollButtonIcon: oe
+      },
+      orientation: C,
+      direction: n ? "right" : "left",
+      onClick: L,
+      disabled: !$e
+    }, j, {
+      className: pe(Y.scrollButtons, j.className)
+    })) : null, b.scrollButtonEnd = D ? /* @__PURE__ */ y(N, u({
+      slots: {
+        EndScrollButtonIcon: B.EndScrollButtonIcon
+      },
+      slotProps: {
+        endScrollButtonIcon: Be
+      },
+      orientation: C,
+      direction: n ? "left" : "right",
+      onClick: ee,
+      disabled: !H
+    }, j, {
+      className: pe(Y.scrollButtons, j.className)
+    })) : null, b;
+  }, mo = Je((b) => {
+    const {
+      tabsMeta: h,
+      tabMeta: D
+    } = V();
+    if (!(!D || !h)) {
+      if (D[ie] < h[ie]) {
+        const S = h[le] + (D[ie] - h[ie]);
+        te(S, {
+          animation: b
+        });
+      } else if (D[Q] > h[Q]) {
+        const S = h[le] + (D[Q] - h[Q]);
+        te(S, {
+          animation: b
+        });
+      }
+    }
+  }), He = Je(() => {
+    q && P !== !1 && Ce(!We);
+  });
+  T.useEffect(() => {
+    const b = No(() => {
+      J.current && _();
+    });
+    let h;
+    const D = (K) => {
+      K.forEach((re) => {
+        re.removedNodes.forEach((Ve) => {
+          var de;
+          (de = h) == null || de.unobserve(Ve);
+        }), re.addedNodes.forEach((Ve) => {
+          var de;
+          (de = h) == null || de.observe(Ve);
+        });
+      }), b(), He();
+    }, S = Bo(J.current);
+    S.addEventListener("resize", b);
+    let E;
+    return typeof ResizeObserver < "u" && (h = new ResizeObserver(b), Array.from(R.current.children).forEach((K) => {
+      h.observe(K);
+    })), typeof MutationObserver < "u" && (E = new MutationObserver(D), E.observe(R.current, {
+      childList: !0
+    })), () => {
+      var K, re;
+      b.clear(), S.removeEventListener("resize", b), (K = E) == null || K.disconnect(), (re = h) == null || re.disconnect();
+    };
+  }, [_, He]), T.useEffect(() => {
+    const b = Array.from(R.current.children), h = b.length;
+    if (typeof IntersectionObserver < "u" && h > 0 && q && P !== !1) {
+      const D = b[0], S = b[h - 1], E = {
+        root: J.current,
+        threshold: 0.99
+      }, K = (Ze) => {
+        ye(!Ze[0].isIntersecting);
+      }, re = new IntersectionObserver(K, E);
+      re.observe(D);
+      const Ve = (Ze) => {
+        ve(!Ze[0].isIntersecting);
+      }, de = new IntersectionObserver(Ve, E);
+      return de.observe(S), () => {
+        re.disconnect(), de.disconnect();
+      };
+    }
+  }, [q, P, We, v == null ? void 0 : v.length]), T.useEffect(() => {
+    Fe(!0);
+  }, []), T.useEffect(() => {
+    _();
+  }), T.useEffect(() => {
+    mo(go !== se);
+  }, [mo, se]), T.useImperativeHandle(c, () => ({
+    updateIndicator: _,
+    updateScrollButtons: He
+  }), [_, He]);
+  const po = /* @__PURE__ */ y(gn, u({}, w, {
+    className: pe(Y.indicator, w.className),
+    ownerState: Z,
+    style: u({}, se, w.style)
+  }));
+  let ze = 0;
+  const et = T.Children.map(v, (b) => {
+    if (!/* @__PURE__ */ T.isValidElement(b))
+      return null;
+    process.env.NODE_ENV !== "production" && Mt.isFragment(b) && console.error(["MUI: The Tabs component doesn't accept a Fragment as a child.", "Consider providing an array instead."].join(`
+`));
+    const h = b.props.value === void 0 ? ze : b.props.value;
+    ue.set(h, ze);
+    const D = h === I;
+    return ze += 1, /* @__PURE__ */ T.cloneElement(b, u({
+      fullWidth: $ === "fullWidth",
+      indicator: D && !ge && po,
+      selected: D,
+      selectionFollowsFocus: F,
+      onChange: m,
+      textColor: W,
+      value: h
+    }, ze === 1 && I === !1 && !b.props.tabIndex ? {
+      tabIndex: 0
+    } : {}));
+  }), ot = (b) => {
+    const h = R.current, D = It(h).activeElement;
+    if (D.getAttribute("role") !== "tab")
+      return;
+    let E = C === "horizontal" ? "ArrowLeft" : "ArrowUp", K = C === "horizontal" ? "ArrowRight" : "ArrowDown";
+    switch (C === "horizontal" && n && (E = "ArrowRight", K = "ArrowLeft"), b.key) {
+      case E:
+        b.preventDefault(), Ae(h, D, To);
+        break;
+      case K:
+        b.preventDefault(), Ae(h, D, ho);
+        break;
+      case "Home":
+        b.preventDefault(), Ae(h, null, ho);
+        break;
+      case "End":
+        b.preventDefault(), Ae(h, null, To);
+        break;
+    }
+  }, Qe = Ge();
+  return /* @__PURE__ */ z(fn, u({
+    className: pe(Y.root, p),
+    ownerState: Z,
+    ref: s,
+    as: f
+  }, ae, {
+    children: [Qe.scrollButtonStart, Qe.scrollbarSizeListener, /* @__PURE__ */ z(hn, {
+      className: Y.scroller,
+      ownerState: Z,
+      style: {
+        overflow: ce.overflow,
+        [U ? `margin${n ? "Left" : "Right"}` : "marginBottom"]: G ? void 0 : -ce.scrollbarWidth
+      },
+      ref: J,
+      children: [/* @__PURE__ */ y(Tn, {
+        "aria-label": l,
+        "aria-labelledby": i,
+        "aria-orientation": C === "vertical" ? "vertical" : null,
+        className: Y.flexContainer,
+        ownerState: Z,
+        onKeyDown: ot,
+        ref: R,
+        role: "tablist",
+        children: et
+      }), ge && po]
+    }), Qe.scrollButtonEnd]
+  }));
+});
+process.env.NODE_ENV !== "production" && (Wo.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * Callback fired when the component mounts.
+   * This is useful when you want to trigger an action programmatically.
+   * It supports two actions: `updateIndicator()` and `updateScrollButtons()`
+   *
+   * @param {object} actions This object contains all possible actions
+   * that can be triggered programmatically.
+   */
+  action: Ot,
+  /**
+   * If `true`, the scroll buttons aren't forced hidden on mobile.
+   * By default the scroll buttons are hidden on mobile and takes precedence over `scrollButtons`.
+   * @default false
+   */
+  allowScrollButtonsMobile: e.bool,
+  /**
+   * The label for the Tabs as a string.
+   */
+  "aria-label": e.string,
+  /**
+   * An id or list of ids separated by a space that label the Tabs.
+   */
+  "aria-labelledby": e.string,
+  /**
+   * If `true`, the tabs are centered.
+   * This prop is intended for large views.
+   * @default false
+   */
+  centered: e.bool,
+  /**
+   * The content of the component.
+   */
+  children: e.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: e.object,
+  /**
+   * @ignore
+   */
+  className: e.string,
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: e.elementType,
+  /**
+   * Determines the color of the indicator.
+   * @default 'primary'
+   */
+  indicatorColor: e.oneOfType([e.oneOf(["primary", "secondary"]), e.string]),
+  /**
+   * Callback fired when the value changes.
+   *
+   * @param {React.SyntheticEvent} event The event source of the callback. **Warning**: This is a generic event not a change event.
+   * @param {any} value We default to the index of the child (number)
+   */
+  onChange: e.func,
+  /**
+   * The component orientation (layout flow direction).
+   * @default 'horizontal'
+   */
+  orientation: e.oneOf(["horizontal", "vertical"]),
+  /**
+   * The component used to render the scroll buttons.
+   * @default TabScrollButton
+   */
+  ScrollButtonComponent: e.elementType,
+  /**
+   * Determine behavior of scroll buttons when tabs are set to scroll:
+   *
+   * - `auto` will only present them when not all the items are visible.
+   * - `true` will always present them.
+   * - `false` will never present them.
+   *
+   * By default the scroll buttons are hidden on mobile.
+   * This behavior can be disabled with `allowScrollButtonsMobile`.
+   * @default 'auto'
+   */
+  scrollButtons: e.oneOf(["auto", !1, !0]),
+  /**
+   * If `true` the selected tab changes on focus. Otherwise it only
+   * changes on activation.
+   */
+  selectionFollowsFocus: e.bool,
+  /**
+   * The extra props for the slot components.
+   * You can override the existing props or add new ones.
+   * @default {}
+   */
+  slotProps: e.shape({
+    endScrollButtonIcon: e.oneOfType([e.func, e.object]),
+    startScrollButtonIcon: e.oneOfType([e.func, e.object])
+  }),
+  /**
+   * The components used for each slot inside.
+   * @default {}
+   */
+  slots: e.shape({
+    EndScrollButtonIcon: e.elementType,
+    StartScrollButtonIcon: e.elementType
+  }),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object]),
+  /**
+   * Props applied to the tab indicator element.
+   * @default  {}
+   */
+  TabIndicatorProps: e.object,
+  /**
+   * Props applied to the [`TabScrollButton`](/material-ui/api/tab-scroll-button/) element.
+   * @default {}
+   */
+  TabScrollButtonProps: e.object,
+  /**
+   * Determines the color of the `Tab`.
+   * @default 'primary'
+   */
+  textColor: e.oneOf(["inherit", "primary", "secondary"]),
+  /**
+   * The value of the currently selected `Tab`.
+   * If you don't want any selected `Tab`, you can set this prop to `false`.
+   */
+  value: e.any,
+  /**
+   * Determines additional display behavior of the tabs:
+   *
+   *  - `scrollable` will invoke scrolling properties and allow for horizontally
+   *  scrolling (or swiping) of the tab bar.
+   *  - `fullWidth` will make the tabs grow to use all the available space,
+   *  which should be used for small views, like on mobile.
+   *  - `standard` will render the default state.
+   * @default 'standard'
+   */
+  variant: e.oneOf(["fullWidth", "scrollable", "standard"]),
+  /**
+   * If `true`, the scrollbar is visible. It can be useful when displaying
+   * a long vertical list of tabs.
+   * @default false
+   */
+  visibleScrollbar: e.bool
+});
+function vn(o) {
+  return De("MuiDateTimePickerTabs", o);
+}
+we("MuiDateTimePickerTabs", ["root"]);
+const Cn = (o) => ["day", "month", "year"].includes(o) ? "date" : "time", xn = (o) => o === "date" ? "day" : "hours", wn = (o) => {
+  const {
+    classes: t
+  } = o;
+  return he({
+    root: ["root"]
+  }, vn, t);
+}, Dn = M(Wo, {
+  name: "MuiDateTimePickerTabs",
+  slot: "Root",
+  overridesResolver: (o, t) => t.root
+})(({
+  theme: o
+}) => ({
+  boxShadow: `0 -1px 0 0 inset ${(o.vars || o).palette.divider}`,
+  "&:last-child": {
+    boxShadow: `0 1px 0 0 inset ${(o.vars || o).palette.divider}`,
+    [`& .${qe.indicator}`]: {
+      bottom: "auto",
+      top: 0
+    }
+  }
+})), Ho = function(t) {
+  const s = ne({
+    props: t,
+    name: "MuiDateTimePickerTabs"
+  }), {
+    dateIcon: a = /* @__PURE__ */ y(ct, {}),
+    onViewChange: r,
+    timeIcon: n = /* @__PURE__ */ y(ut, {}),
+    view: l,
+    hidden: i = typeof window > "u" || window.innerHeight < 667
+  } = s, c = Ne(), d = wn(s), v = (p, f) => {
+    r(xn(f));
+  };
+  return i ? null : /* @__PURE__ */ z(Dn, {
+    ownerState: s,
+    variant: "fullWidth",
+    value: Cn(l),
+    onChange: v,
+    className: d.root,
+    children: [/* @__PURE__ */ y(no, {
+      value: "date",
+      "aria-label": c.dateTableLabel,
+      icon: /* @__PURE__ */ y(T.Fragment, {
+        children: a
+      })
+    }), /* @__PURE__ */ y(no, {
+      value: "time",
+      "aria-label": c.timeTableLabel,
+      icon: /* @__PURE__ */ y(T.Fragment, {
+        children: n
+      })
+    })]
+  });
+};
+process.env.NODE_ENV !== "production" && (Ho.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: e.object,
+  /**
+   * Date tab icon.
+   * @default DateRange
+   */
+  dateIcon: e.node,
+  /**
+   * Toggles visibility of the tabs allowing view switching.
+   * @default `window.innerHeight < 667` for `DesktopDateTimePicker` and `MobileDateTimePicker`, `displayStaticWrapperAs === 'desktop'` for `StaticDateTimePicker`
+   */
+  hidden: e.bool,
+  /**
+   * Callback called when a tab is clicked
+   * @template TView
+   * @param {TView} view The view to open
+   */
+  onViewChange: e.func.isRequired,
+  /**
+   * Time tab icon.
+   * @default Time
+   */
+  timeIcon: e.node,
+  /**
+   * Currently visible picker view.
+   */
+  view: e.oneOf(["day", "hours", "minutes", "month", "seconds", "year"]).isRequired
+});
+function Pn(o) {
+  return De("MuiDateTimePickerToolbar", o);
+}
+const eo = we("MuiDateTimePickerToolbar", ["root", "dateContainer", "timeContainer", "timeDigitsContainer", "separator", "timeLabelReverse", "ampmSelection", "ampmLandscape", "ampmLabel"]), Sn = ["ampm", "ampmInClock", "value", "onChange", "view", "isLandscape", "onViewChange", "toolbarFormat", "toolbarPlaceholder", "views", "disabled", "readOnly"], kn = (o) => {
+  const {
+    classes: t,
+    theme: s,
+    isLandscape: a
+  } = o, r = {
+    root: ["root"],
+    dateContainer: ["dateContainer"],
+    timeContainer: ["timeContainer", s.direction === "rtl" && "timeLabelReverse"],
+    timeDigitsContainer: ["timeDigitsContainer", s.direction === "rtl" && "timeLabelReverse"],
+    separator: ["separator"],
+    ampmSelection: ["ampmSelection", a && "ampmLandscape"],
+    ampmLabel: ["ampmLabel"]
+  };
+  return he(r, Pn, t);
+}, zo = M(dt, {
+  name: "MuiDateTimePickerToolbar",
+  slot: "Root",
+  overridesResolver: (o, t) => t.root
+})(({
+  theme: o
+}) => ({
+  paddingLeft: 16,
+  paddingRight: 16,
+  justifyContent: "space-around",
+  position: "relative",
+  [`& .${mt.penIconButton}`]: u({
+    position: "absolute",
+    top: 8
+  }, o.direction === "rtl" ? {
+    left: 8
+  } : {
+    right: 8
+  })
+}));
+zo.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  as: e.elementType,
+  classes: e.object,
+  className: e.string,
+  isLandscape: e.bool.isRequired,
+  isMobileKeyboardViewOpen: e.bool,
+  landscapeDirection: e.oneOf(["column", "row"]),
+  ownerState: e.object.isRequired,
+  sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object]),
+  toggleMobileKeyboardView: e.func,
+  toolbarTitle: e.node,
+  viewType: e.oneOf(["date", "time"])
+};
+const Mn = M("div", {
+  name: "MuiDateTimePickerToolbar",
+  slot: "DateContainer",
+  overridesResolver: (o, t) => t.dateContainer
+})({
+  display: "flex",
+  flexDirection: "column",
+  alignItems: "flex-start"
+}), Ao = M("div", {
+  name: "MuiDateTimePickerToolbar",
+  slot: "TimeContainer",
+  overridesResolver: (o, t) => t.timeContainer
+})(({
+  theme: o,
+  ownerState: t
+}) => {
+  const s = t.isLandscape ? "column" : "row";
+  return u({
+    display: "flex",
+    flexDirection: s
+  }, o.direction === "rtl" && {
+    flexDirection: `${s}-reverse`
+  });
+}), Rn = M("div", {
+  name: "MuiDateTimePickerToolbar",
+  slot: "TimeDigitsContainer",
+  overridesResolver: (o, t) => t.timeDigitsContainer
+})(({
+  theme: o
+}) => u({
+  display: "flex"
+}, o.direction === "rtl" && {
+  flexDirection: "row-reverse"
+}));
+Ao.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  as: e.elementType,
+  ownerState: e.object.isRequired,
+  sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object])
+};
+const vo = M(_o, {
+  name: "MuiDateTimePickerToolbar",
+  slot: "Separator",
+  overridesResolver: (o, t) => t.separator
+})({
+  margin: "0 4px 0 2px",
+  cursor: "default"
+}), On = M("div", {
+  name: "MuiDateTimePickerToolbar",
+  slot: "AmPmSelection",
+  overridesResolver: (o, t) => [{
+    [`.${eo.ampmLabel}`]: t.ampmLabel
+  }, {
+    [`&.${eo.ampmLandscape}`]: t.ampmLandscape
+  }, t.ampmSelection]
+})(({
+  ownerState: o
+}) => u({
+  display: "flex",
+  flexDirection: "column",
+  marginRight: "auto",
+  marginLeft: 12
+}, o.isLandscape && {
+  margin: "4px 0 auto",
+  flexDirection: "row",
+  justifyContent: "space-around",
+  width: "100%"
+}, {
+  [`& .${eo.ampmLabel}`]: {
+    fontSize: 17
+  }
+}));
+function Uo(o) {
+  const t = ne({
+    props: o,
+    name: "MuiDateTimePickerToolbar"
+  }), {
+    ampm: s,
+    ampmInClock: a,
+    value: r,
+    onChange: n,
+    view: l,
+    isLandscape: i,
+    onViewChange: c,
+    toolbarFormat: d,
+    toolbarPlaceholder: v = "––",
+    views: p,
+    disabled: f,
+    readOnly: g
+  } = t, x = X(t, Sn), m = t, C = je(), {
+    meridiemMode: N,
+    handleMeridiemChange: P
+  } = Po(r, s, n), F = !!(s && !a), B = Ne(), O = Oo(), w = kn(u({}, m, {
+    theme: O
+  })), j = (I) => s ? C.format(I, "hours12h") : C.format(I, "hours24h"), W = T.useMemo(() => r ? d ? C.formatByString(r, d) : C.format(r, "shortDate") : v, [r, d, v, C]);
+  return /* @__PURE__ */ z(zo, u({
+    toolbarTitle: B.dateTimePickerToolbarTitle,
+    isLandscape: i,
+    className: w.root
+  }, x, {
+    ownerState: m,
+    children: [/* @__PURE__ */ z(Mn, {
+      className: w.dateContainer,
+      ownerState: m,
+      children: [p.includes("year") && /* @__PURE__ */ y(xe, {
+        tabIndex: -1,
+        variant: "subtitle1",
+        onClick: () => c("year"),
+        selected: l === "year",
+        value: r ? C.format(r, "year") : "–"
+      }), p.includes("day") && /* @__PURE__ */ y(xe, {
+        tabIndex: -1,
+        variant: "h4",
+        onClick: () => c("day"),
+        selected: l === "day",
+        value: W
+      })]
+    }), /* @__PURE__ */ z(Ao, {
+      className: w.timeContainer,
+      ownerState: m,
+      children: [/* @__PURE__ */ z(Rn, {
+        className: w.timeDigitsContainer,
+        children: [p.includes("hours") && /* @__PURE__ */ y(xe, {
+          variant: "h3",
+          onClick: () => c("hours"),
+          selected: l === "hours",
+          value: r ? j(r) : "--"
+        }), p.includes("minutes") && /* @__PURE__ */ z(T.Fragment, {
+          children: [/* @__PURE__ */ y(vo, {
+            variant: "h3",
+            value: ":",
+            className: w.separator,
+            ownerState: m
+          }), /* @__PURE__ */ y(xe, {
+            variant: "h3",
+            onClick: () => c("minutes"),
+            selected: l === "minutes",
+            value: r ? C.format(r, "minutes") : "--"
+          })]
+        }), p.includes("seconds") && /* @__PURE__ */ z(T.Fragment, {
+          children: [/* @__PURE__ */ y(vo, {
+            variant: "h3",
+            value: ":",
+            className: w.separator,
+            ownerState: m
+          }), /* @__PURE__ */ y(xe, {
+            variant: "h3",
+            onClick: () => c("seconds"),
+            selected: l === "seconds",
+            value: r ? C.format(r, "seconds") : "--"
+          })]
+        })]
+      }), F && /* @__PURE__ */ z(On, {
+        className: w.ampmSelection,
+        ownerState: m,
+        children: [/* @__PURE__ */ y(xe, {
+          disableRipple: !0,
+          variant: "subtitle2",
+          selected: N === "am",
+          typographyClassName: w.ampmLabel,
+          value: C.getMeridiemText("am"),
+          onClick: g ? void 0 : () => P("am"),
+          disabled: f
+        }), /* @__PURE__ */ y(xe, {
+          disableRipple: !0,
+          variant: "subtitle2",
+          selected: N === "pm",
+          typographyClassName: w.ampmLabel,
+          value: C.getMeridiemText("pm"),
+          onClick: g ? void 0 : () => P("pm"),
+          disabled: f
+        })]
+      })]
+    })]
+  }));
+}
+process.env.NODE_ENV !== "production" && (Uo.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  ampm: e.bool,
+  ampmInClock: e.bool,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: e.object,
+  /**
+   * className applied to the root component.
+   */
+  className: e.string,
+  disabled: e.bool,
+  /**
+   * If `true`, show the toolbar even in desktop mode.
+   * @default `true` for Desktop, `false` for Mobile.
+   */
+  hidden: e.bool,
+  isLandscape: e.bool.isRequired,
+  onChange: e.func.isRequired,
+  /**
+   * Callback called when a toolbar is clicked
+   * @template TView
+   * @param {TView} view The view to open
+   */
+  onViewChange: e.func.isRequired,
+  readOnly: e.bool,
+  titleId: e.string,
+  /**
+   * Toolbar date format.
+   */
+  toolbarFormat: e.string,
+  /**
+   * Toolbar value placeholder—it is displayed when the value is empty.
+   * @default "––"
+   */
+  toolbarPlaceholder: e.node,
+  value: e.any,
+  /**
+   * Currently visible picker view.
+   */
+  view: e.oneOf(["day", "hours", "minutes", "month", "seconds", "year"]).isRequired,
+  views: e.arrayOf(e.oneOf(["day", "hours", "minutes", "month", "seconds", "year"]).isRequired).isRequired
+});
+function qo(o, t) {
+  var s, a, r, n, l, i, c, d, v, p, f;
+  const g = je(), x = Do(), m = ne({
+    props: o,
+    name: t
+  }), C = (s = m.ampm) != null ? s : g.is12HourCycleInCurrentLocale(), N = T.useMemo(() => {
+    var B;
+    return ((B = m.localeText) == null ? void 0 : B.toolbarTitle) == null ? m.localeText : u({}, m.localeText, {
+      dateTimePickerToolbarTitle: m.localeText.toolbarTitle
+    });
+  }, [m.localeText]), P = (a = m.slots) != null ? a : So(m.components), F = (r = m.slotProps) != null ? r : m.componentsProps;
+  return u({}, m, pt({
+    views: m.views,
+    openTo: m.openTo,
+    defaultViews: ["year", "day", "hours", "minutes"],
+    defaultOpenTo: "day"
+  }), {
+    ampm: C,
+    localeText: N,
+    orientation: (n = m.orientation) != null ? n : "portrait",
+    // TODO: Remove from public API
+    disableIgnoringDatePartForTimeValidation: (l = m.disableIgnoringDatePartForTimeValidation) != null ? l : !!(m.minDateTime || m.maxDateTime || // allow time clock to correctly check time validity: https://github.com/mui/mui-x/issues/8520
+    m.disablePast || m.disableFuture),
+    disableFuture: (i = m.disableFuture) != null ? i : !1,
+    disablePast: (c = m.disablePast) != null ? c : !1,
+    minDate: Ye(g, (d = m.minDateTime) != null ? d : m.minDate, x.minDate),
+    maxDate: Ye(g, (v = m.maxDateTime) != null ? v : m.maxDate, x.maxDate),
+    minTime: (p = m.minDateTime) != null ? p : m.minTime,
+    maxTime: (f = m.maxDateTime) != null ? f : m.maxTime,
+    slots: u({
+      toolbar: Uo,
+      tabs: Ho
+    }, P),
+    slotProps: u({}, F, {
+      toolbar: u({
+        ampm: C
+      }, F == null ? void 0 : F.toolbar)
+    })
+  });
+}
+const Yo = /* @__PURE__ */ T.forwardRef(function(t, s) {
+  var a, r, n, l;
+  const i = Ne(), c = qo(t, "MuiDesktopDateTimePicker"), d = u({
+    day: Re,
+    month: Re,
+    year: Re,
+    hours: null,
+    minutes: null,
+    seconds: null
+  }, c.viewRenderers), v = (a = c.ampmInClock) != null ? a : !0, p = u({}, c, {
+    viewRenderers: d,
+    yearsPerRow: (r = c.yearsPerRow) != null ? r : 4,
+    ampmInClock: v,
+    slots: u({
+      field: uo,
+      openPickerIcon: bt
+    }, c.slots),
+    slotProps: u({}, c.slotProps, {
+      field: (g) => {
+        var x;
+        return u({}, Io((x = c.slotProps) == null ? void 0 : x.field, g), ko(c), {
+          ref: s,
+          ampm: c.ampm
+        });
+      },
+      toolbar: u({
+        hidden: !0,
+        ampmInClock: v
+      }, (n = c.slotProps) == null ? void 0 : n.toolbar),
+      tabs: u({
+        hidden: !0
+      }, (l = c.slotProps) == null ? void 0 : l.tabs)
+    })
+  }), {
+    renderPicker: f
+  } = ft({
+    props: p,
+    valueManager: so,
+    valueType: "date-time",
+    getOpenDialogAriaText: i.openDatePickerDialogue,
+    validator: co
+  });
+  return f();
+});
+Yo.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  /**
+   * 12h/24h view for hour selection clock.
+   * @default `utils.is12HourCycleInCurrentLocale()`
+   */
+  ampm: e.bool,
+  /**
+   * Display ampm controls under the clock (instead of in the toolbar).
+   * @default true on desktop, false on mobile
+   */
+  ampmInClock: e.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: e.bool,
+  /**
+   * Class name applied to the root element.
+   */
+  className: e.string,
+  /**
+   * If `true`, the popover or modal will close after submitting the full date.
+   * @default `true` for desktop, `false` for mobile (based on the chosen wrapper and `desktopModeMediaQuery` prop).
+   */
+  closeOnSelect: e.bool,
+  /**
+   * Overridable components.
+   * @default {}
+   * @deprecated Please use `slots`.
+   */
+  components: e.object,
+  /**
+   * The props used for each component slot.
+   * @default {}
+   * @deprecated Please use `slotProps`.
+   */
+  componentsProps: e.object,
+  /**
+   * Formats the day of week displayed in the calendar header.
+   * @param {string} day The day of week provided by the adapter's method `getWeekdays`.
+   * @returns {string} The name to display.
+   * @default (day) => day.charAt(0).toUpperCase()
+   */
+  dayOfWeekFormatter: e.func,
+  /**
+   * Default calendar month displayed when `value={null}`.
+   */
+  defaultCalendarMonth: e.any,
+  /**
+   * The default value.
+   * Used when the component is not controlled.
+   */
+  defaultValue: e.any,
+  /**
+   * If `true`, the picker and text field are disabled.
+   * @default false
+   */
+  disabled: e.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: e.bool,
+  /**
+   * If `true`, today's date is rendering without highlighting with circle.
+   * @default false
+   */
+  disableHighlightToday: e.bool,
+  /**
+   * Do not ignore date part when validating min/max time.
+   * @default false
+   */
+  disableIgnoringDatePartForTimeValidation: e.bool,
+  /**
+   * If `true`, the open picker button will not be rendered (renders only the field).
+   * @default false
+   */
+  disableOpenPicker: e.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: e.bool,
+  /**
+   * If `true`, the week number will be display in the calendar.
+   */
+  displayWeekNumber: e.bool,
+  /**
+   * Calendar will show more weeks in order to match this value.
+   * Put it to 6 for having fix number of week in Gregorian calendars
+   * @default undefined
+   */
+  fixedWeekNumber: e.number,
+  /**
+   * Format of the date when rendered in the input(s).
+   * Defaults to localized format based on the used `views`.
+   */
+  format: e.string,
+  /**
+   * Density of the format when rendered in the input.
+   * Setting `formatDensity` to `"spacious"` will add a space before and after each `/`, `-` and `.` character.
+   * @default "dense"
+   */
+  formatDensity: e.oneOf(["dense", "spacious"]),
+  /**
+   * Pass a ref to the `input` element.
+   */
+  inputRef: e.oneOfType([e.func, e.shape({
+    current: e.object
+  })]),
+  /**
+   * The label content.
+   */
+  label: e.node,
+  /**
+   * If `true`, calls `renderLoading` instead of rendering the day calendar.
+   * Can be used to preload information and show it in calendar.
+   * @default false
+   */
+  loading: e.bool,
+  /**
+   * Locale for components texts.
+   * Allows overriding texts coming from `LocalizationProvider` and `theme`.
+   */
+  localeText: e.object,
+  /**
+   * Maximal selectable date.
+   */
+  maxDate: e.any,
+  /**
+   * Maximal selectable moment of time with binding to date, to set max time in each day use `maxTime`.
+   */
+  maxDateTime: e.any,
+  /**
+   * Maximal selectable time.
+   * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`.
+   */
+  maxTime: e.any,
+  /**
+   * Minimal selectable date.
+   */
+  minDate: e.any,
+  /**
+   * Minimal selectable moment of time with binding to date, to set min time in each day use `minTime`.
+   */
+  minDateTime: e.any,
+  /**
+   * Minimal selectable time.
+   * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`.
+   */
+  minTime: e.any,
+  /**
+   * Step over minutes.
+   * @default 1
+   */
+  minutesStep: e.number,
+  /**
+   * Months rendered per row.
+   * @default 3
+   */
+  monthsPerRow: e.oneOf([3, 4]),
+  /**
+   * Callback fired when the value is accepted.
+   * @template TValue The value type. Will be either the same type as `value` or `null`. Can be in `[start, end]` format in case of range value.
+   * @param {TValue} value The value that was just accepted.
+   */
+  onAccept: e.func,
+  /**
+   * Callback fired when the value changes.
+   * @template TValue The value type. Will be either the same type as `value` or `null`. Can be in `[start, end]` format in case of range value.
+   * @template TError The validation error type. Will be either `string` or a `null`. Can be in `[start, end]` format in case of range value.
+   * @param {TValue} value The new value.
+   * @param {FieldChangeHandlerContext<TError>} context The context containing the validation result of the current value.
+   */
+  onChange: e.func,
+  /**
+   * Callback fired when the popup requests to be closed.
+   * Use in controlled mode (see `open`).
+   */
+  onClose: e.func,
+  /**
+   * Callback fired when the error associated to the current value changes.
+   * If the error has a non-null value, then the `TextField` will be rendered in `error` state.
+   *
+   * @template TValue The value type. Will be either the same type as `value` or `null`. Can be in `[start, end]` format in case of range value.
+   * @template TError The validation error type. Will be either `string` or a `null`. Can be in `[start, end]` format in case of range value.
+   * @param {TError} error The new error describing why the current value is not valid.
+   * @param {TValue} value The value associated to the error.
+   */
+  onError: e.func,
+  /**
+   * Callback fired on month change.
+   * @template TDate
+   * @param {TDate} month The new month.
+   */
+  onMonthChange: e.func,
+  /**
+   * Callback fired when the popup requests to be opened.
+   * Use in controlled mode (see `open`).
+   */
+  onOpen: e.func,
+  /**
+   * Callback fired when the selected sections change.
+   * @param {FieldSelectedSections} newValue The new selected sections.
+   */
+  onSelectedSectionsChange: e.func,
+  /**
+   * Callback fired on view change.
+   * @template TView
+   * @param {TView} view The new view.
+   */
+  onViewChange: e.func,
+  /**
+   * Callback fired on year change.
+   * @template TDate
+   * @param {TDate} year The new year.
+   */
+  onYearChange: e.func,
+  /**
+   * Control the popup or dialog open state.
+   * @default false
+   */
+  open: e.bool,
+  /**
+   * The default visible view.
+   * Used when the component view is not controlled.
+   * Must be a valid option from `views` list.
+   */
+  openTo: e.oneOf(["day", "hours", "minutes", "month", "seconds", "year"]),
+  /**
+   * Force rendering in particular orientation.
+   */
+  orientation: e.oneOf(["landscape", "portrait"]),
+  readOnly: e.bool,
+  /**
+   * Disable heavy animations.
+   * @default typeof navigator !== 'undefined' && /(android)/i.test(navigator.userAgent)
+   */
+  reduceAnimations: e.bool,
+  /**
+   * Component displaying when passed `loading` true.
+   * @returns {React.ReactNode} The node to render when loading.
+   * @default () => <span data-mui-test="loading-progress">...</span>
+   */
+  renderLoading: e.func,
+  /**
+   * The currently selected sections.
+   * This prop accept four formats:
+   * 1. If a number is provided, the section at this index will be selected.
+   * 2. If an object with a `startIndex` and `endIndex` properties are provided, the sections between those two indexes will be selected.
+   * 3. If a string of type `FieldSectionType` is provided, the first section with that name will be selected.
+   * 4. If `null` is provided, no section will be selected
+   * If not provided, the selected sections will be handled internally.
+   */
+  selectedSections: e.oneOfType([e.oneOf(["all", "day", "hours", "meridiem", "minutes", "month", "seconds", "weekDay", "year"]), e.number, e.shape({
+    endIndex: e.number.isRequired,
+    startIndex: e.number.isRequired
+  })]),
+  /**
+   * Disable specific clock time.
+   * @param {number} clockValue The value to check.
+   * @param {TimeView} view The clock type of the timeValue.
+   * @returns {boolean} If `true` the time will be disabled.
+   * @deprecated Consider using `shouldDisableTime`.
+   */
+  shouldDisableClock: e.func,
+  /**
+   * Disable specific date.
+   * @template TDate
+   * @param {TDate} day The date to test.
+   * @returns {boolean} If `true` the date will be disabled.
+   */
+  shouldDisableDate: e.func,
+  /**
+   * Disable specific month.
+   * @template TDate
+   * @param {TDate} month The month to test.
+   * @returns {boolean} If `true`, the month will be disabled.
+   */
+  shouldDisableMonth: e.func,
+  /**
+   * Disable specific time.
+   * @template TDate
+   * @param {TDate} value The value to check.
+   * @param {TimeView} view The clock type of the timeValue.
+   * @returns {boolean} If `true` the time will be disabled.
+   */
+  shouldDisableTime: e.func,
+  /**
+   * Disable specific year.
+   * @template TDate
+   * @param {TDate} year The year to test.
+   * @returns {boolean} If `true`, the year will be disabled.
+   */
+  shouldDisableYear: e.func,
+  /**
+   * If `true`, days outside the current month are rendered:
+   *
+   * - if `fixedWeekNumber` is defined, renders days to have the weeks requested.
+   *
+   * - if `fixedWeekNumber` is not defined, renders day to fill the first and last week of the current month.
+   *
+   * - ignored if `calendars` equals more than `1` on range pickers.
+   * @default false
+   */
+  showDaysOutsideCurrentMonth: e.bool,
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps: e.object,
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots: e.object,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object]),
+  /**
+   * The selected value.
+   * Used when the component is controlled.
+   */
+  value: e.any,
+  /**
+   * The visible view.
+   * Used when the component view is controlled.
+   * Must be a valid option from `views` list.
+   */
+  view: e.oneOf(["day", "hours", "minutes", "month", "seconds", "year"]),
+  /**
+   * Define custom view renderers for each section.
+   * If `null`, the section will only have field editing.
+   * If `undefined`, internally defined view will be the used.
+   */
+  viewRenderers: e.shape({
+    day: e.func,
+    hours: e.func,
+    minutes: e.func,
+    month: e.func,
+    seconds: e.func,
+    year: e.func
+  }),
+  /**
+   * Available views.
+   */
+  views: e.arrayOf(e.oneOf(["day", "hours", "minutes", "month", "seconds", "year"]).isRequired),
+  /**
+   * Years rendered per row.
+   * @default 4
+   */
+  yearsPerRow: e.oneOf([3, 4])
+};
+function In(o) {
+  return De("MuiTimeClock", o);
+}
+we("MuiTimeClock", ["root", "arrowSwitcher"]);
+const Oe = 220, be = 36, Le = {
+  x: Oe / 2,
+  y: Oe / 2
+}, Ko = {
+  x: Le.x,
+  y: 0
+}, Nn = Ko.x - Le.x, Bn = Ko.y - Le.y, Fn = (o) => o * (180 / Math.PI), Xo = (o, t, s) => {
+  const a = t - Le.x, r = s - Le.y, n = Math.atan2(Nn, Bn) - Math.atan2(a, r);
+  let l = Fn(n);
+  l = Math.round(l / o) * o, l %= 360;
+  const i = Math.floor(l / o) || 0, c = a ** 2 + r ** 2, d = Math.sqrt(c);
+  return {
+    value: i,
+    distance: d
+  };
+}, En = (o, t, s = 1) => {
+  const a = s * 6;
+  let {
+    value: r
+  } = Xo(a, o, t);
+  return r = r * s % 60, r;
+}, $n = (o, t, s) => {
+  const {
+    value: a,
+    distance: r
+  } = Xo(30, o, t);
+  let n = a || 12;
+  return s ? n %= 12 : r < Oe / 2 - be && (n += 12, n %= 24), n;
+};
+function Vn(o) {
+  return De("MuiClockPointer", o);
+}
+we("MuiClockPointer", ["root", "thumb"]);
+const _n = ["className", "hasSelected", "isInner", "type", "viewValue"], Ln = (o) => {
+  const {
+    classes: t
+  } = o;
+  return he({
+    root: ["root"],
+    thumb: ["thumb"]
+  }, Vn, t);
+}, jn = M("div", {
+  name: "MuiClockPointer",
+  slot: "Root",
+  overridesResolver: (o, t) => t.root
+})(({
+  theme: o,
+  ownerState: t
+}) => u({
+  width: 2,
+  backgroundColor: (o.vars || o).palette.primary.main,
+  position: "absolute",
+  left: "calc(50% - 1px)",
+  bottom: "50%",
+  transformOrigin: "center bottom 0px"
+}, t.shouldAnimate && {
+  transition: o.transitions.create(["transform", "height"])
+})), Wn = M("div", {
+  name: "MuiClockPointer",
+  slot: "Thumb",
+  overridesResolver: (o, t) => t.thumb
+})(({
+  theme: o,
+  ownerState: t
+}) => u({
+  width: 4,
+  height: 4,
+  backgroundColor: (o.vars || o).palette.primary.contrastText,
+  borderRadius: "50%",
+  position: "absolute",
+  top: -21,
+  left: `calc(50% - ${be / 2}px)`,
+  border: `${(be - 4) / 2}px solid ${(o.vars || o).palette.primary.main}`,
+  boxSizing: "content-box"
+}, t.hasSelected && {
+  backgroundColor: (o.vars || o).palette.primary.main
+}));
+function Hn(o) {
+  const t = ne({
+    props: o,
+    name: "MuiClockPointer"
+  }), {
+    className: s,
+    isInner: a,
+    type: r,
+    viewValue: n
+  } = t, l = X(t, _n), i = T.useRef(r);
+  T.useEffect(() => {
+    i.current = r;
+  }, [r]);
+  const c = u({}, t, {
+    shouldAnimate: i.current !== r
+  }), d = Ln(c);
+  return /* @__PURE__ */ y(jn, u({
+    style: (() => {
+      let f = 360 / (r === "hours" ? 12 : 60) * n;
+      return r === "hours" && n > 12 && (f -= 360), {
+        height: Math.round((a ? 0.26 : 0.4) * Oe),
+        transform: `rotateZ(${f}deg)`
+      };
+    })(),
+    className: Ie(s, d.root),
+    ownerState: c
+  }, l, {
+    children: /* @__PURE__ */ y(Wn, {
+      ownerState: c,
+      className: d.thumb
+    })
+  }));
+}
+function zn(o) {
+  return De("MuiClock", o);
+}
+we("MuiClock", ["root", "clock", "wrapper", "squareMask", "pin", "amButton", "pmButton"]);
+const An = (o) => {
+  const {
+    classes: t
+  } = o;
+  return he({
+    root: ["root"],
+    clock: ["clock"],
+    wrapper: ["wrapper"],
+    squareMask: ["squareMask"],
+    pin: ["pin"],
+    amButton: ["amButton"],
+    pmButton: ["pmButton"]
+  }, zn, t);
+}, Un = M("div", {
+  name: "MuiClock",
+  slot: "Root",
+  overridesResolver: (o, t) => t.root
+})(({
+  theme: o
+}) => ({
+  display: "flex",
+  justifyContent: "center",
+  alignItems: "center",
+  margin: o.spacing(2)
+})), qn = M("div", {
+  name: "MuiClock",
+  slot: "Clock",
+  overridesResolver: (o, t) => t.clock
+})({
+  backgroundColor: "rgba(0,0,0,.07)",
+  borderRadius: "50%",
+  height: 220,
+  width: 220,
+  flexShrink: 0,
+  position: "relative",
+  pointerEvents: "none"
+}), Yn = M("div", {
+  name: "MuiClock",
+  slot: "Wrapper",
+  overridesResolver: (o, t) => t.wrapper
+})({
+  "&:focus": {
+    outline: "none"
+  }
+}), Kn = M("div", {
+  name: "MuiClock",
+  slot: "SquareMask",
+  overridesResolver: (o, t) => t.squareMask
+})(({
+  ownerState: o
+}) => u({
+  width: "100%",
+  height: "100%",
+  position: "absolute",
+  pointerEvents: "auto",
+  outline: 0,
+  // Disable scroll capabilities.
+  touchAction: "none",
+  userSelect: "none"
+}, o.disabled ? {} : {
+  "@media (pointer: fine)": {
+    cursor: "pointer",
+    borderRadius: "50%"
+  },
+  "&:active": {
+    cursor: "move"
+  }
+})), Xn = M("div", {
+  name: "MuiClock",
+  slot: "Pin",
+  overridesResolver: (o, t) => t.pin
+})(({
+  theme: o
+}) => ({
+  width: 6,
+  height: 6,
+  borderRadius: "50%",
+  backgroundColor: (o.vars || o).palette.primary.main,
+  position: "absolute",
+  top: "50%",
+  left: "50%",
+  transform: "translate(-50%, -50%)"
+})), Gn = M($o, {
+  name: "MuiClock",
+  slot: "AmButton",
+  overridesResolver: (o, t) => t.amButton
+})(({
+  theme: o,
+  ownerState: t
+}) => u({
+  zIndex: 1,
+  position: "absolute",
+  bottom: 8,
+  left: 8
+}, t.meridiemMode === "am" && {
+  backgroundColor: (o.vars || o).palette.primary.main,
+  color: (o.vars || o).palette.primary.contrastText,
+  "&:hover": {
+    backgroundColor: (o.vars || o).palette.primary.light
+  }
+})), Qn = M($o, {
+  name: "MuiClock",
+  slot: "PmButton",
+  overridesResolver: (o, t) => t.pmButton
+})(({
+  theme: o,
+  ownerState: t
+}) => u({
+  zIndex: 1,
+  position: "absolute",
+  bottom: 8,
+  right: 8
+}, t.meridiemMode === "pm" && {
+  backgroundColor: (o.vars || o).palette.primary.main,
+  color: (o.vars || o).palette.primary.contrastText,
+  "&:hover": {
+    backgroundColor: (o.vars || o).palette.primary.light
+  }
+}));
+function Zn(o) {
+  const t = ne({
+    props: o,
+    name: "MuiClock"
+  }), {
+    ampm: s,
+    ampmInClock: a,
+    autoFocus: r,
+    children: n,
+    value: l,
+    handleMeridiemChange: i,
+    isTimeDisabled: c,
+    meridiemMode: d,
+    minutesStep: v = 1,
+    onChange: p,
+    selectedId: f,
+    type: g,
+    viewValue: x,
+    disabled: m,
+    readOnly: C,
+    className: N
+  } = t, P = t, F = je(), B = Ne(), O = T.useRef(!1), w = An(P), j = c(x, g), W = !s && g === "hours" && (x < 1 || x > 12), I = (k, Z) => {
+    m || C || c(k, g) || p(k, Z);
+  }, $ = (k, Z) => {
+    let {
+      offsetX: Y,
+      offsetY: oe
+    } = k;
+    if (Y === void 0) {
+      const ge = k.target.getBoundingClientRect();
+      Y = k.changedTouches[0].clientX - ge.left, oe = k.changedTouches[0].clientY - ge.top;
+    }
+    const Be = g === "seconds" || g === "minutes" ? En(Y, oe, v) : $n(Y, oe, !!s);
+    I(Be, Z);
+  }, G = (k) => {
+    O.current = !0, $(k, "shallow");
+  }, ae = (k) => {
+    O.current && ($(k, "finish"), O.current = !1);
+  }, q = (k) => {
+    k.buttons > 0 && $(k.nativeEvent, "shallow");
+  }, U = (k) => {
+    O.current && (O.current = !1), $(k.nativeEvent, "finish");
+  }, le = T.useMemo(() => g === "hours" ? !0 : x % 5 === 0, [g, x]), ie = g === "minutes" ? v : 1, Q = T.useRef(null);
+  ht(() => {
+    r && Q.current.focus();
+  }, [r]);
+  const Te = (k) => {
+    if (!O.current)
+      switch (k.key) {
+        case "Home":
+          I(0, "partial"), k.preventDefault();
+          break;
+        case "End":
+          I(g === "minutes" ? 59 : 23, "partial"), k.preventDefault();
+          break;
+        case "ArrowUp":
+          I(x + ie, "partial"), k.preventDefault();
+          break;
+        case "ArrowDown":
+          I(x - ie, "partial"), k.preventDefault();
+          break;
+      }
+  };
+  return /* @__PURE__ */ z(Un, {
+    className: Ie(N, w.root),
+    children: [/* @__PURE__ */ z(qn, {
+      className: w.clock,
+      children: [/* @__PURE__ */ y(Kn, {
+        onTouchMove: G,
+        onTouchEnd: ae,
+        onMouseUp: U,
+        onMouseMove: q,
+        ownerState: {
+          disabled: m
+        },
+        className: w.squareMask
+      }), !j && /* @__PURE__ */ z(T.Fragment, {
+        children: [/* @__PURE__ */ y(Xn, {
+          className: w.pin
+        }), l != null && /* @__PURE__ */ y(Hn, {
+          type: g,
+          viewValue: x,
+          isInner: W,
+          hasSelected: le
+        })]
+      }), /* @__PURE__ */ y(Yn, {
+        "aria-activedescendant": f,
+        "aria-label": B.clockLabelText(g, l, F),
+        ref: Q,
+        role: "listbox",
+        onKeyDown: Te,
+        tabIndex: 0,
+        className: w.wrapper,
+        children: n
+      })]
+    }), s && a && /* @__PURE__ */ z(T.Fragment, {
+      children: [/* @__PURE__ */ y(Gn, {
+        onClick: C ? void 0 : () => i("am"),
+        disabled: m || d === null,
+        ownerState: P,
+        className: w.amButton,
+        children: /* @__PURE__ */ y(to, {
+          variant: "caption",
+          children: "AM"
+        })
+      }), /* @__PURE__ */ y(Qn, {
+        disabled: m || d === null,
+        onClick: C ? void 0 : () => i("pm"),
+        ownerState: P,
+        className: w.pmButton,
+        children: /* @__PURE__ */ y(to, {
+          variant: "caption",
+          children: "PM"
+        })
+      })]
+    })]
+  });
+}
+function Jn(o) {
+  return De("MuiClockNumber", o);
+}
+const Ue = we("MuiClockNumber", ["root", "selected", "disabled"]), es = ["className", "disabled", "index", "inner", "label", "selected"], os = (o) => {
+  const {
+    classes: t,
+    selected: s,
+    disabled: a
+  } = o;
+  return he({
+    root: ["root", s && "selected", a && "disabled"]
+  }, Jn, t);
+}, ts = M("span", {
+  name: "MuiClockNumber",
+  slot: "Root",
+  overridesResolver: (o, t) => [t.root, {
+    [`&.${Ue.disabled}`]: t.disabled
+  }, {
+    [`&.${Ue.selected}`]: t.selected
+  }]
+})(({
+  theme: o,
+  ownerState: t
+}) => u({
+  height: be,
+  width: be,
+  position: "absolute",
+  left: `calc((100% - ${be}px) / 2)`,
+  display: "inline-flex",
+  justifyContent: "center",
+  alignItems: "center",
+  borderRadius: "50%",
+  color: (o.vars || o).palette.text.primary,
+  fontFamily: o.typography.fontFamily,
+  "&:focused": {
+    backgroundColor: (o.vars || o).palette.background.paper
+  },
+  [`&.${Ue.selected}`]: {
+    color: (o.vars || o).palette.primary.contrastText
+  },
+  [`&.${Ue.disabled}`]: {
+    pointerEvents: "none",
+    color: (o.vars || o).palette.text.disabled
+  }
+}, t.inner && u({}, o.typography.body2, {
+  color: (o.vars || o).palette.text.secondary
+})));
+function Go(o) {
+  const t = ne({
+    props: o,
+    name: "MuiClockNumber"
+  }), {
+    className: s,
+    disabled: a,
+    index: r,
+    inner: n,
+    label: l,
+    selected: i
+  } = t, c = X(t, es), d = t, v = os(d), p = r % 12 / 12 * Math.PI * 2 - Math.PI / 2, f = (Oe - be - 2) / 2 * (n ? 0.65 : 1), g = Math.round(Math.cos(p) * f), x = Math.round(Math.sin(p) * f);
+  return /* @__PURE__ */ y(ts, u({
+    className: Ie(s, v.root),
+    "aria-disabled": a ? !0 : void 0,
+    "aria-selected": i ? !0 : void 0,
+    role: "option",
+    style: {
+      transform: `translate(${g}px, ${x + (Oe - be) / 2}px`
+    },
+    ownerState: d
+  }, c, {
+    children: l
+  }));
+}
+const ns = ({
+  ampm: o,
+  value: t,
+  getClockNumberText: s,
+  isDisabled: a,
+  selectedId: r,
+  utils: n
+}) => {
+  const l = t ? n.getHours(t) : null, i = [], c = o ? 1 : 0, d = o ? 12 : 23, v = (p) => l === null ? !1 : o ? p === 12 ? l === 12 || l === 0 : l === p || l - 12 === p : l === p;
+  for (let p = c; p <= d; p += 1) {
+    let f = p.toString();
+    p === 0 && (f = "00");
+    const g = !o && (p === 0 || p > 12);
+    f = n.formatNumber(f);
+    const x = v(p);
+    i.push(/* @__PURE__ */ y(Go, {
+      id: x ? r : void 0,
+      index: p,
+      inner: g,
+      selected: x,
+      disabled: a(p),
+      label: f,
+      "aria-label": s(f)
+    }, p));
+  }
+  return i;
+}, Co = ({
+  utils: o,
+  value: t,
+  isDisabled: s,
+  getClockNumberText: a,
+  selectedId: r
+}) => {
+  const n = o.formatNumber;
+  return [[5, n("05")], [10, n("10")], [15, n("15")], [20, n("20")], [25, n("25")], [30, n("30")], [35, n("35")], [40, n("40")], [45, n("45")], [50, n("50")], [55, n("55")], [0, n("00")]].map(([l, i], c) => {
+    const d = l === t;
+    return /* @__PURE__ */ y(Go, {
+      label: i,
+      id: d ? r : void 0,
+      index: c + 1,
+      inner: !1,
+      disabled: s(l),
+      selected: d,
+      "aria-label": a(i)
+    }, l);
+  });
+}, ss = ["ampm", "ampmInClock", "autoFocus", "components", "componentsProps", "slots", "slotProps", "value", "disableIgnoringDatePartForTimeValidation", "maxTime", "minTime", "disableFuture", "disablePast", "minutesStep", "shouldDisableClock", "shouldDisableTime", "showViewSwitcher", "onChange", "defaultValue", "view", "views", "openTo", "onViewChange", "focusedView", "onFocusedViewChange", "className", "disabled", "readOnly"], rs = (o) => {
+  const {
+    classes: t
+  } = o;
+  return he({
+    root: ["root"],
+    arrowSwitcher: ["arrowSwitcher"]
+  }, In, t);
+}, as = M(Tt, {
+  name: "MuiTimeClock",
+  slot: "Root",
+  overridesResolver: (o, t) => t.root
+})({
+  display: "flex",
+  flexDirection: "column",
+  position: "relative"
+}), ls = M(gt, {
+  name: "MuiTimeClock",
+  slot: "ArrowSwitcher",
+  overridesResolver: (o, t) => t.arrowSwitcher
+})({
+  position: "absolute",
+  right: 12,
+  top: 15
+}), Qo = /* @__PURE__ */ T.forwardRef(function(t, s) {
+  const a = Ne(), r = yt(), n = je(), l = ne({
+    props: t,
+    name: "MuiTimeClock"
+  }), {
+    ampm: i = n.is12HourCycleInCurrentLocale(),
+    ampmInClock: c = !1,
+    autoFocus: d,
+    components: v,
+    componentsProps: p,
+    slots: f,
+    slotProps: g,
+    value: x,
+    disableIgnoringDatePartForTimeValidation: m = !1,
+    maxTime: C,
+    minTime: N,
+    disableFuture: P,
+    disablePast: F,
+    minutesStep: B = 1,
+    shouldDisableClock: O,
+    shouldDisableTime: w,
+    showViewSwitcher: j,
+    onChange: W,
+    defaultValue: I,
+    view: $,
+    views: G = ["hours", "minutes"],
+    openTo: ae,
+    onViewChange: q,
+    focusedView: U,
+    onFocusedViewChange: le,
+    className: ie,
+    disabled: Q,
+    readOnly: Te
+  } = l, k = X(l, ss), Z = f ?? So(v), Y = g ?? p, [oe, Be] = vt({
+    name: "DateCalendar",
+    state: "value",
+    controlled: x,
+    default: I ?? null
+  }), ge = Ct((R, V) => {
+    Be(R), W == null || W(R, V);
+  }), {
+    view: Fe,
+    setView: se,
+    previousView: Ee,
+    nextView: $e,
+    setValueAndGoToNextView: ye
+  } = xt({
+    view: $,
+    views: G,
+    openTo: ae,
+    onViewChange: q,
+    onChange: ge,
+    focusedView: U,
+    onFocusedViewChange: le
+  }), H = T.useMemo(() => oe || n.setSeconds(n.setMinutes(n.setHours(r, 0), 0), 0), [oe, r, n]), {
+    meridiemMode: ve,
+    handleMeridiemChange: We
+  } = Po(H, i, ye), Ce = T.useCallback((R, V) => {
+    const _ = wo(m, n), te = V === "hours" || V === "minutes" && G.includes("seconds"), Pe = ({
+      start: L,
+      end: ee
+    }) => !(N && _(N, ee) || C && _(L, C) || P && _(L, r) || F && _(r, te ? ee : L)), Se = (L, ee = 1) => {
+      if (L % ee !== 0 || O != null && O(L, V))
+        return !1;
+      if (w)
+        switch (V) {
+          case "hours":
+            return !w(n.setHours(H, L), "hours");
+          case "minutes":
+            return !w(n.setMinutes(H, L), "minutes");
+          case "seconds":
+            return !w(n.setSeconds(H, L), "seconds");
+          default:
+            return !1;
+        }
+      return !0;
+    };
+    switch (V) {
+      case "hours": {
+        const L = bo(R, ve, i), ee = n.setHours(H, L), ke = n.setSeconds(n.setMinutes(ee, 0), 0), Ge = n.setSeconds(n.setMinutes(ee, 59), 59);
+        return !Pe({
+          start: ke,
+          end: Ge
+        }) || !Se(L);
+      }
+      case "minutes": {
+        const L = n.setMinutes(H, R), ee = n.setSeconds(L, 0), ke = n.setSeconds(L, 59);
+        return !Pe({
+          start: ee,
+          end: ke
+        }) || !Se(R, B);
+      }
+      case "seconds": {
+        const L = n.setSeconds(H, R);
+        return !Pe({
+          start: L,
+          end: L
+        }) || !Se(R);
+      }
+      default:
+        throw new Error("not supported");
+    }
+  }, [i, H, m, C, ve, N, B, O, w, n, P, F, r, G]), ce = wt(), Xe = T.useMemo(() => {
+    switch (Fe) {
+      case "hours": {
+        const R = (V, _) => {
+          const te = bo(V, ve, i);
+          ye(n.setHours(H, te), _);
+        };
+        return {
+          onChange: R,
+          viewValue: n.getHours(H),
+          children: ns({
+            value: oe,
+            utils: n,
+            ampm: i,
+            onChange: R,
+            getClockNumberText: a.hoursClockNumberText,
+            isDisabled: (V) => Q || Ce(V, "hours"),
+            selectedId: ce
+          })
+        };
+      }
+      case "minutes": {
+        const R = n.getMinutes(H), V = (_, te) => {
+          ye(n.setMinutes(H, _), te);
+        };
+        return {
+          viewValue: R,
+          onChange: V,
+          children: Co({
+            utils: n,
+            value: R,
+            onChange: V,
+            getClockNumberText: a.minutesClockNumberText,
+            isDisabled: (_) => Q || Ce(_, "minutes"),
+            selectedId: ce
+          })
+        };
+      }
+      case "seconds": {
+        const R = n.getSeconds(H), V = (_, te) => {
+          ye(n.setSeconds(H, _), te);
+        };
+        return {
+          viewValue: R,
+          onChange: V,
+          children: Co({
+            utils: n,
+            value: R,
+            onChange: V,
+            getClockNumberText: a.secondsClockNumberText,
+            isDisabled: (_) => Q || Ce(_, "seconds"),
+            selectedId: ce
+          })
+        };
+      }
+      default:
+        throw new Error("You must provide the type for ClockView");
+    }
+  }, [Fe, n, oe, i, a.hoursClockNumberText, a.minutesClockNumberText, a.secondsClockNumberText, ve, ye, H, Ce, ce, Q]), ue = l, J = rs(ue);
+  return /* @__PURE__ */ z(as, u({
+    ref: s,
+    className: Ie(J.root, ie),
+    ownerState: ue
+  }, k, {
+    children: [/* @__PURE__ */ y(Zn, u({
+      autoFocus: d ?? !!U,
+      ampmInClock: c && G.includes("hours"),
+      value: oe,
+      type: Fe,
+      ampm: i,
+      minutesStep: B,
+      isTimeDisabled: Ce,
+      meridiemMode: ve,
+      handleMeridiemChange: We,
+      selectedId: ce,
+      disabled: Q,
+      readOnly: Te
+    }, Xe)), j && /* @__PURE__ */ y(ls, {
+      className: J.arrowSwitcher,
+      slots: Z,
+      slotProps: Y,
+      onGoToPrevious: () => se(Ee),
+      isPreviousDisabled: !Ee,
+      previousLabel: a.openPreviousView,
+      onGoToNext: () => se($e),
+      isNextDisabled: !$e,
+      nextLabel: a.openNextView,
+      ownerState: ue
+    })]
+  }));
+});
+process.env.NODE_ENV !== "production" && (Qo.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  /**
+   * 12h/24h view for hour selection clock.
+   * @default `utils.is12HourCycleInCurrentLocale()`
+   */
+  ampm: e.bool,
+  /**
+   * Display ampm controls under the clock (instead of in the toolbar).
+   * @default false
+   */
+  ampmInClock: e.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: e.bool,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: e.object,
+  className: e.string,
+  /**
+   * Overridable components.
+   * @default {}
+   * @deprecated Please use `slots`.
+   */
+  components: e.object,
+  /**
+   * The props used for each component slot.
+   * @default {}
+   * @deprecated Please use `slotProps`.
+   */
+  componentsProps: e.object,
+  /**
+   * The default selected value.
+   * Used when the component is not controlled.
+   */
+  defaultValue: e.any,
+  /**
+   * If `true`, the picker views and text field are disabled.
+   * @default false
+   */
+  disabled: e.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: e.bool,
+  /**
+   * Do not ignore date part when validating min/max time.
+   * @default false
+   */
+  disableIgnoringDatePartForTimeValidation: e.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: e.bool,
+  /**
+   * Controlled focused view.
+   */
+  focusedView: e.oneOf(["hours", "minutes", "seconds"]),
+  /**
+   * Maximal selectable time.
+   * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`.
+   */
+  maxTime: e.any,
+  /**
+   * Minimal selectable time.
+   * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`.
+   */
+  minTime: e.any,
+  /**
+   * Step over minutes.
+   * @default 1
+   */
+  minutesStep: e.number,
+  /**
+   * Callback fired when the value changes.
+   * @template TDate
+   * @param {TDate | null} 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: e.func,
+  /**
+   * Callback fired on focused view change.
+   * @template TView
+   * @param {TView} view The new view to focus or not.
+   * @param {boolean} hasFocus `true` if the view should be focused.
+   */
+  onFocusedViewChange: e.func,
+  /**
+   * Callback fired on view change.
+   * @template TView
+   * @param {TView} view The new view.
+   */
+  onViewChange: e.func,
+  /**
+   * The default visible view.
+   * Used when the component view is not controlled.
+   * Must be a valid option from `views` list.
+   */
+  openTo: e.oneOf(["hours", "minutes", "seconds"]),
+  /**
+   * If `true`, the picker views and text field are read-only.
+   * @default false
+   */
+  readOnly: e.bool,
+  /**
+   * Disable specific clock time.
+   * @param {number} clockValue The value to check.
+   * @param {TimeView} view The clock type of the timeValue.
+   * @returns {boolean} If `true` the time will be disabled.
+   * @deprecated Consider using `shouldDisableTime`.
+   */
+  shouldDisableClock: e.func,
+  /**
+   * Disable specific time.
+   * @template TDate
+   * @param {TDate} value The value to check.
+   * @param {TimeView} view The clock type of the timeValue.
+   * @returns {boolean} If `true` the time will be disabled.
+   */
+  shouldDisableTime: e.func,
+  showViewSwitcher: e.bool,
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps: e.object,
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots: e.object,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object]),
+  /**
+   * The selected value.
+   * Used when the component is controlled.
+   */
+  value: e.any,
+  /**
+   * The visible view.
+   * Used when the component view is controlled.
+   * Must be a valid option from `views` list.
+   */
+  view: e.oneOf(["hours", "minutes", "seconds"]),
+  /**
+   * Available views.
+   */
+  views: e.arrayOf(e.oneOf(["hours", "minutes", "seconds"]).isRequired)
+});
+const oo = ({
+  view: o,
+  onViewChange: t,
+  focusedView: s,
+  onFocusedViewChange: a,
+  views: r,
+  value: n,
+  defaultValue: l,
+  onChange: i,
+  className: c,
+  classes: d,
+  disableFuture: v,
+  disablePast: p,
+  minTime: f,
+  maxTime: g,
+  shouldDisableTime: x,
+  shouldDisableClock: m,
+  minutesStep: C,
+  ampm: N,
+  ampmInClock: P,
+  components: F,
+  componentsProps: B,
+  slots: O,
+  slotProps: w,
+  readOnly: j,
+  disabled: W,
+  sx: I,
+  autoFocus: $,
+  showViewSwitcher: G,
+  disableIgnoringDatePartForTimeValidation: ae
+}) => /* @__PURE__ */ y(Qo, {
+  view: o,
+  onViewChange: t,
+  focusedView: s,
+  onFocusedViewChange: a,
+  views: r.filter(Dt),
+  value: n,
+  defaultValue: l,
+  onChange: i,
+  className: c,
+  classes: d,
+  disableFuture: v,
+  disablePast: p,
+  minTime: f,
+  maxTime: g,
+  shouldDisableTime: x,
+  shouldDisableClock: m,
+  minutesStep: C,
+  ampm: N,
+  ampmInClock: P,
+  components: F,
+  componentsProps: B,
+  slots: O,
+  slotProps: w,
+  readOnly: j,
+  disabled: W,
+  sx: I,
+  autoFocus: $,
+  showViewSwitcher: G,
+  disableIgnoringDatePartForTimeValidation: ae
+}), Zo = /* @__PURE__ */ T.forwardRef(function(t, s) {
+  var a, r, n;
+  const l = Ne(), i = qo(t, "MuiMobileDateTimePicker"), c = u({
+    day: Re,
+    month: Re,
+    year: Re,
+    hours: oo,
+    minutes: oo,
+    seconds: oo
+  }, i.viewRenderers), d = (a = i.ampmInClock) != null ? a : !1, v = u({}, i, {
+    viewRenderers: c,
+    ampmInClock: d,
+    slots: u({
+      field: uo
+    }, i.slots),
+    slotProps: u({}, i.slotProps, {
+      field: (f) => {
+        var g;
+        return u({}, Io((g = i.slotProps) == null ? void 0 : g.field, f), ko(i), {
+          ref: s,
+          ampm: i.ampm
+        });
+      },
+      toolbar: u({
+        hidden: !1,
+        ampmInClock: d
+      }, (r = i.slotProps) == null ? void 0 : r.toolbar),
+      tabs: u({
+        hidden: !1
+      }, (n = i.slotProps) == null ? void 0 : n.tabs)
+    })
+  }), {
+    renderPicker: p
+  } = Pt({
+    props: v,
+    valueManager: so,
+    valueType: "date-time",
+    getOpenDialogAriaText: l.openDatePickerDialogue,
+    validator: co
+  });
+  return p();
+});
+Zo.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  /**
+   * 12h/24h view for hour selection clock.
+   * @default `utils.is12HourCycleInCurrentLocale()`
+   */
+  ampm: e.bool,
+  /**
+   * Display ampm controls under the clock (instead of in the toolbar).
+   * @default true on desktop, false on mobile
+   */
+  ampmInClock: e.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: e.bool,
+  /**
+   * Class name applied to the root element.
+   */
+  className: e.string,
+  /**
+   * If `true`, the popover or modal will close after submitting the full date.
+   * @default `true` for desktop, `false` for mobile (based on the chosen wrapper and `desktopModeMediaQuery` prop).
+   */
+  closeOnSelect: e.bool,
+  /**
+   * Overridable components.
+   * @default {}
+   * @deprecated Please use `slots`.
+   */
+  components: e.object,
+  /**
+   * The props used for each component slot.
+   * @default {}
+   * @deprecated Please use `slotProps`.
+   */
+  componentsProps: e.object,
+  /**
+   * Formats the day of week displayed in the calendar header.
+   * @param {string} day The day of week provided by the adapter's method `getWeekdays`.
+   * @returns {string} The name to display.
+   * @default (day) => day.charAt(0).toUpperCase()
+   */
+  dayOfWeekFormatter: e.func,
+  /**
+   * Default calendar month displayed when `value={null}`.
+   */
+  defaultCalendarMonth: e.any,
+  /**
+   * The default value.
+   * Used when the component is not controlled.
+   */
+  defaultValue: e.any,
+  /**
+   * If `true`, the picker and text field are disabled.
+   * @default false
+   */
+  disabled: e.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: e.bool,
+  /**
+   * If `true`, today's date is rendering without highlighting with circle.
+   * @default false
+   */
+  disableHighlightToday: e.bool,
+  /**
+   * Do not ignore date part when validating min/max time.
+   * @default false
+   */
+  disableIgnoringDatePartForTimeValidation: e.bool,
+  /**
+   * If `true`, the open picker button will not be rendered (renders only the field).
+   * @default false
+   */
+  disableOpenPicker: e.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: e.bool,
+  /**
+   * If `true`, the week number will be display in the calendar.
+   */
+  displayWeekNumber: e.bool,
+  /**
+   * Calendar will show more weeks in order to match this value.
+   * Put it to 6 for having fix number of week in Gregorian calendars
+   * @default undefined
+   */
+  fixedWeekNumber: e.number,
+  /**
+   * Format of the date when rendered in the input(s).
+   * Defaults to localized format based on the used `views`.
+   */
+  format: e.string,
+  /**
+   * Density of the format when rendered in the input.
+   * Setting `formatDensity` to `"spacious"` will add a space before and after each `/`, `-` and `.` character.
+   * @default "dense"
+   */
+  formatDensity: e.oneOf(["dense", "spacious"]),
+  /**
+   * Pass a ref to the `input` element.
+   */
+  inputRef: e.oneOfType([e.func, e.shape({
+    current: e.object
+  })]),
+  /**
+   * The label content.
+   */
+  label: e.node,
+  /**
+   * If `true`, calls `renderLoading` instead of rendering the day calendar.
+   * Can be used to preload information and show it in calendar.
+   * @default false
+   */
+  loading: e.bool,
+  /**
+   * Locale for components texts.
+   * Allows overriding texts coming from `LocalizationProvider` and `theme`.
+   */
+  localeText: e.object,
+  /**
+   * Maximal selectable date.
+   */
+  maxDate: e.any,
+  /**
+   * Maximal selectable moment of time with binding to date, to set max time in each day use `maxTime`.
+   */
+  maxDateTime: e.any,
+  /**
+   * Maximal selectable time.
+   * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`.
+   */
+  maxTime: e.any,
+  /**
+   * Minimal selectable date.
+   */
+  minDate: e.any,
+  /**
+   * Minimal selectable moment of time with binding to date, to set min time in each day use `minTime`.
+   */
+  minDateTime: e.any,
+  /**
+   * Minimal selectable time.
+   * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`.
+   */
+  minTime: e.any,
+  /**
+   * Step over minutes.
+   * @default 1
+   */
+  minutesStep: e.number,
+  /**
+   * Months rendered per row.
+   * @default 3
+   */
+  monthsPerRow: e.oneOf([3, 4]),
+  /**
+   * Callback fired when the value is accepted.
+   * @template TValue The value type. Will be either the same type as `value` or `null`. Can be in `[start, end]` format in case of range value.
+   * @param {TValue} value The value that was just accepted.
+   */
+  onAccept: e.func,
+  /**
+   * Callback fired when the value changes.
+   * @template TValue The value type. Will be either the same type as `value` or `null`. Can be in `[start, end]` format in case of range value.
+   * @template TError The validation error type. Will be either `string` or a `null`. Can be in `[start, end]` format in case of range value.
+   * @param {TValue} value The new value.
+   * @param {FieldChangeHandlerContext<TError>} context The context containing the validation result of the current value.
+   */
+  onChange: e.func,
+  /**
+   * Callback fired when the popup requests to be closed.
+   * Use in controlled mode (see `open`).
+   */
+  onClose: e.func,
+  /**
+   * Callback fired when the error associated to the current value changes.
+   * If the error has a non-null value, then the `TextField` will be rendered in `error` state.
+   *
+   * @template TValue The value type. Will be either the same type as `value` or `null`. Can be in `[start, end]` format in case of range value.
+   * @template TError The validation error type. Will be either `string` or a `null`. Can be in `[start, end]` format in case of range value.
+   * @param {TError} error The new error describing why the current value is not valid.
+   * @param {TValue} value The value associated to the error.
+   */
+  onError: e.func,
+  /**
+   * Callback fired on month change.
+   * @template TDate
+   * @param {TDate} month The new month.
+   */
+  onMonthChange: e.func,
+  /**
+   * Callback fired when the popup requests to be opened.
+   * Use in controlled mode (see `open`).
+   */
+  onOpen: e.func,
+  /**
+   * Callback fired when the selected sections change.
+   * @param {FieldSelectedSections} newValue The new selected sections.
+   */
+  onSelectedSectionsChange: e.func,
+  /**
+   * Callback fired on view change.
+   * @template TView
+   * @param {TView} view The new view.
+   */
+  onViewChange: e.func,
+  /**
+   * Callback fired on year change.
+   * @template TDate
+   * @param {TDate} year The new year.
+   */
+  onYearChange: e.func,
+  /**
+   * Control the popup or dialog open state.
+   * @default false
+   */
+  open: e.bool,
+  /**
+   * The default visible view.
+   * Used when the component view is not controlled.
+   * Must be a valid option from `views` list.
+   */
+  openTo: e.oneOf(["day", "hours", "minutes", "month", "seconds", "year"]),
+  /**
+   * Force rendering in particular orientation.
+   */
+  orientation: e.oneOf(["landscape", "portrait"]),
+  readOnly: e.bool,
+  /**
+   * Disable heavy animations.
+   * @default typeof navigator !== 'undefined' && /(android)/i.test(navigator.userAgent)
+   */
+  reduceAnimations: e.bool,
+  /**
+   * Component displaying when passed `loading` true.
+   * @returns {React.ReactNode} The node to render when loading.
+   * @default () => <span data-mui-test="loading-progress">...</span>
+   */
+  renderLoading: e.func,
+  /**
+   * The currently selected sections.
+   * This prop accept four formats:
+   * 1. If a number is provided, the section at this index will be selected.
+   * 2. If an object with a `startIndex` and `endIndex` properties are provided, the sections between those two indexes will be selected.
+   * 3. If a string of type `FieldSectionType` is provided, the first section with that name will be selected.
+   * 4. If `null` is provided, no section will be selected
+   * If not provided, the selected sections will be handled internally.
+   */
+  selectedSections: e.oneOfType([e.oneOf(["all", "day", "hours", "meridiem", "minutes", "month", "seconds", "weekDay", "year"]), e.number, e.shape({
+    endIndex: e.number.isRequired,
+    startIndex: e.number.isRequired
+  })]),
+  /**
+   * Disable specific clock time.
+   * @param {number} clockValue The value to check.
+   * @param {TimeView} view The clock type of the timeValue.
+   * @returns {boolean} If `true` the time will be disabled.
+   * @deprecated Consider using `shouldDisableTime`.
+   */
+  shouldDisableClock: e.func,
+  /**
+   * Disable specific date.
+   * @template TDate
+   * @param {TDate} day The date to test.
+   * @returns {boolean} If `true` the date will be disabled.
+   */
+  shouldDisableDate: e.func,
+  /**
+   * Disable specific month.
+   * @template TDate
+   * @param {TDate} month The month to test.
+   * @returns {boolean} If `true`, the month will be disabled.
+   */
+  shouldDisableMonth: e.func,
+  /**
+   * Disable specific time.
+   * @template TDate
+   * @param {TDate} value The value to check.
+   * @param {TimeView} view The clock type of the timeValue.
+   * @returns {boolean} If `true` the time will be disabled.
+   */
+  shouldDisableTime: e.func,
+  /**
+   * Disable specific year.
+   * @template TDate
+   * @param {TDate} year The year to test.
+   * @returns {boolean} If `true`, the year will be disabled.
+   */
+  shouldDisableYear: e.func,
+  /**
+   * If `true`, days outside the current month are rendered:
+   *
+   * - if `fixedWeekNumber` is defined, renders days to have the weeks requested.
+   *
+   * - if `fixedWeekNumber` is not defined, renders day to fill the first and last week of the current month.
+   *
+   * - ignored if `calendars` equals more than `1` on range pickers.
+   * @default false
+   */
+  showDaysOutsideCurrentMonth: e.bool,
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps: e.object,
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots: e.object,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object]),
+  /**
+   * The selected value.
+   * Used when the component is controlled.
+   */
+  value: e.any,
+  /**
+   * The visible view.
+   * Used when the component view is controlled.
+   * Must be a valid option from `views` list.
+   */
+  view: e.oneOf(["day", "hours", "minutes", "month", "seconds", "year"]),
+  /**
+   * Define custom view renderers for each section.
+   * If `null`, the section will only have field editing.
+   * If `undefined`, internally defined view will be the used.
+   */
+  viewRenderers: e.shape({
+    day: e.func,
+    hours: e.func,
+    minutes: e.func,
+    month: e.func,
+    seconds: e.func,
+    year: e.func
+  }),
+  /**
+   * Available views.
+   */
+  views: e.arrayOf(e.oneOf(["day", "hours", "minutes", "month", "seconds", "year"]).isRequired),
+  /**
+   * Years rendered per row.
+   * @default 3
+   */
+  yearsPerRow: e.oneOf([3, 4])
+};
+const is = ["desktopModeMediaQuery"], Jo = /* @__PURE__ */ T.forwardRef(function(t, s) {
+  const a = ne({
+    props: t,
+    name: "MuiDateTimePicker"
+  }), {
+    desktopModeMediaQuery: r = kt
+  } = a, n = X(a, is);
+  return St(r, {
+    defaultMatches: !0
+  }) ? /* @__PURE__ */ y(Yo, u({
+    ref: s
+  }, n)) : /* @__PURE__ */ y(Zo, u({
+    ref: s
+  }, n));
+});
+process.env.NODE_ENV !== "production" && (Jo.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // ----------------------------------------------------------------------
+  /**
+   * 12h/24h view for hour selection clock.
+   * @default `utils.is12HourCycleInCurrentLocale()`
+   */
+  ampm: e.bool,
+  /**
+   * Display ampm controls under the clock (instead of in the toolbar).
+   * @default true on desktop, false on mobile
+   */
+  ampmInClock: e.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: e.bool,
+  /**
+   * Class name applied to the root element.
+   */
+  className: e.string,
+  /**
+   * If `true`, the popover or modal will close after submitting the full date.
+   * @default `true` for desktop, `false` for mobile (based on the chosen wrapper and `desktopModeMediaQuery` prop).
+   */
+  closeOnSelect: e.bool,
+  /**
+   * Overridable components.
+   * @default {}
+   * @deprecated Please use `slots`.
+   */
+  components: e.object,
+  /**
+   * The props used for each component slot.
+   * @default {}
+   * @deprecated Please use `slotProps`.
+   */
+  componentsProps: e.object,
+  /**
+   * Formats the day of week displayed in the calendar header.
+   * @param {string} day The day of week provided by the adapter's method `getWeekdays`.
+   * @returns {string} The name to display.
+   * @default (day) => day.charAt(0).toUpperCase()
+   */
+  dayOfWeekFormatter: e.func,
+  /**
+   * Default calendar month displayed when `value={null}`.
+   */
+  defaultCalendarMonth: e.any,
+  /**
+   * The default value.
+   * Used when the component is not controlled.
+   */
+  defaultValue: e.any,
+  /**
+   * CSS media query when `Mobile` mode will be changed to `Desktop`.
+   * @default '@media (pointer: fine)'
+   * @example '@media (min-width: 720px)' or theme.breakpoints.up("sm")
+   */
+  desktopModeMediaQuery: e.string,
+  /**
+   * If `true`, the picker and text field are disabled.
+   * @default false
+   */
+  disabled: e.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: e.bool,
+  /**
+   * If `true`, today's date is rendering without highlighting with circle.
+   * @default false
+   */
+  disableHighlightToday: e.bool,
+  /**
+   * Do not ignore date part when validating min/max time.
+   * @default false
+   */
+  disableIgnoringDatePartForTimeValidation: e.bool,
+  /**
+   * If `true`, the open picker button will not be rendered (renders only the field).
+   * @default false
+   */
+  disableOpenPicker: e.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: e.bool,
+  /**
+   * If `true`, the week number will be display in the calendar.
+   */
+  displayWeekNumber: e.bool,
+  /**
+   * Calendar will show more weeks in order to match this value.
+   * Put it to 6 for having fix number of week in Gregorian calendars
+   * @default undefined
+   */
+  fixedWeekNumber: e.number,
+  /**
+   * Format of the date when rendered in the input(s).
+   * Defaults to localized format based on the used `views`.
+   */
+  format: e.string,
+  /**
+   * Density of the format when rendered in the input.
+   * Setting `formatDensity` to `"spacious"` will add a space before and after each `/`, `-` and `.` character.
+   * @default "dense"
+   */
+  formatDensity: e.oneOf(["dense", "spacious"]),
+  /**
+   * Pass a ref to the `input` element.
+   */
+  inputRef: e.oneOfType([e.func, e.shape({
+    current: e.object
+  })]),
+  /**
+   * The label content.
+   */
+  label: e.node,
+  /**
+   * If `true`, calls `renderLoading` instead of rendering the day calendar.
+   * Can be used to preload information and show it in calendar.
+   * @default false
+   */
+  loading: e.bool,
+  /**
+   * Locale for components texts.
+   * Allows overriding texts coming from `LocalizationProvider` and `theme`.
+   */
+  localeText: e.object,
+  /**
+   * Maximal selectable date.
+   */
+  maxDate: e.any,
+  /**
+   * Maximal selectable moment of time with binding to date, to set max time in each day use `maxTime`.
+   */
+  maxDateTime: e.any,
+  /**
+   * Maximal selectable time.
+   * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`.
+   */
+  maxTime: e.any,
+  /**
+   * Minimal selectable date.
+   */
+  minDate: e.any,
+  /**
+   * Minimal selectable moment of time with binding to date, to set min time in each day use `minTime`.
+   */
+  minDateTime: e.any,
+  /**
+   * Minimal selectable time.
+   * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`.
+   */
+  minTime: e.any,
+  /**
+   * Step over minutes.
+   * @default 1
+   */
+  minutesStep: e.number,
+  /**
+   * Months rendered per row.
+   * @default 3
+   */
+  monthsPerRow: e.oneOf([3, 4]),
+  /**
+   * Callback fired when the value is accepted.
+   * @template TValue The value type. Will be either the same type as `value` or `null`. Can be in `[start, end]` format in case of range value.
+   * @param {TValue} value The value that was just accepted.
+   */
+  onAccept: e.func,
+  /**
+   * Callback fired when the value changes.
+   * @template TValue The value type. Will be either the same type as `value` or `null`. Can be in `[start, end]` format in case of range value.
+   * @template TError The validation error type. Will be either `string` or a `null`. Can be in `[start, end]` format in case of range value.
+   * @param {TValue} value The new value.
+   * @param {FieldChangeHandlerContext<TError>} context The context containing the validation result of the current value.
+   */
+  onChange: e.func,
+  /**
+   * Callback fired when the popup requests to be closed.
+   * Use in controlled mode (see `open`).
+   */
+  onClose: e.func,
+  /**
+   * Callback fired when the error associated to the current value changes.
+   * If the error has a non-null value, then the `TextField` will be rendered in `error` state.
+   *
+   * @template TValue The value type. Will be either the same type as `value` or `null`. Can be in `[start, end]` format in case of range value.
+   * @template TError The validation error type. Will be either `string` or a `null`. Can be in `[start, end]` format in case of range value.
+   * @param {TError} error The new error describing why the current value is not valid.
+   * @param {TValue} value The value associated to the error.
+   */
+  onError: e.func,
+  /**
+   * Callback fired on month change.
+   * @template TDate
+   * @param {TDate} month The new month.
+   */
+  onMonthChange: e.func,
+  /**
+   * Callback fired when the popup requests to be opened.
+   * Use in controlled mode (see `open`).
+   */
+  onOpen: e.func,
+  /**
+   * Callback fired when the selected sections change.
+   * @param {FieldSelectedSections} newValue The new selected sections.
+   */
+  onSelectedSectionsChange: e.func,
+  /**
+   * Callback fired on view change.
+   * @template TView
+   * @param {TView} view The new view.
+   */
+  onViewChange: e.func,
+  /**
+   * Callback fired on year change.
+   * @template TDate
+   * @param {TDate} year The new year.
+   */
+  onYearChange: e.func,
+  /**
+   * Control the popup or dialog open state.
+   * @default false
+   */
+  open: e.bool,
+  /**
+   * The default visible view.
+   * Used when the component view is not controlled.
+   * Must be a valid option from `views` list.
+   */
+  openTo: e.oneOf(["day", "hours", "minutes", "month", "seconds", "year"]),
+  /**
+   * Force rendering in particular orientation.
+   */
+  orientation: e.oneOf(["landscape", "portrait"]),
+  readOnly: e.bool,
+  /**
+   * Disable heavy animations.
+   * @default typeof navigator !== 'undefined' && /(android)/i.test(navigator.userAgent)
+   */
+  reduceAnimations: e.bool,
+  /**
+   * Component displaying when passed `loading` true.
+   * @returns {React.ReactNode} The node to render when loading.
+   * @default () => <span data-mui-test="loading-progress">...</span>
+   */
+  renderLoading: e.func,
+  /**
+   * The currently selected sections.
+   * This prop accept four formats:
+   * 1. If a number is provided, the section at this index will be selected.
+   * 2. If an object with a `startIndex` and `endIndex` properties are provided, the sections between those two indexes will be selected.
+   * 3. If a string of type `FieldSectionType` is provided, the first section with that name will be selected.
+   * 4. If `null` is provided, no section will be selected
+   * If not provided, the selected sections will be handled internally.
+   */
+  selectedSections: e.oneOfType([e.oneOf(["all", "day", "hours", "meridiem", "minutes", "month", "seconds", "weekDay", "year"]), e.number, e.shape({
+    endIndex: e.number.isRequired,
+    startIndex: e.number.isRequired
+  })]),
+  /**
+   * Disable specific clock time.
+   * @param {number} clockValue The value to check.
+   * @param {TimeView} view The clock type of the timeValue.
+   * @returns {boolean} If `true` the time will be disabled.
+   * @deprecated Consider using `shouldDisableTime`.
+   */
+  shouldDisableClock: e.func,
+  /**
+   * Disable specific date.
+   * @template TDate
+   * @param {TDate} day The date to test.
+   * @returns {boolean} If `true` the date will be disabled.
+   */
+  shouldDisableDate: e.func,
+  /**
+   * Disable specific month.
+   * @template TDate
+   * @param {TDate} month The month to test.
+   * @returns {boolean} If `true`, the month will be disabled.
+   */
+  shouldDisableMonth: e.func,
+  /**
+   * Disable specific time.
+   * @template TDate
+   * @param {TDate} value The value to check.
+   * @param {TimeView} view The clock type of the timeValue.
+   * @returns {boolean} If `true` the time will be disabled.
+   */
+  shouldDisableTime: e.func,
+  /**
+   * Disable specific year.
+   * @template TDate
+   * @param {TDate} year The year to test.
+   * @returns {boolean} If `true`, the year will be disabled.
+   */
+  shouldDisableYear: e.func,
+  /**
+   * If `true`, days outside the current month are rendered:
+   *
+   * - if `fixedWeekNumber` is defined, renders days to have the weeks requested.
+   *
+   * - if `fixedWeekNumber` is not defined, renders day to fill the first and last week of the current month.
+   *
+   * - ignored if `calendars` equals more than `1` on range pickers.
+   * @default false
+   */
+  showDaysOutsideCurrentMonth: e.bool,
+  /**
+   * The props used for each component slot.
+   * @default {}
+   */
+  slotProps: e.object,
+  /**
+   * Overridable component slots.
+   * @default {}
+   */
+  slots: e.object,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object]),
+  /**
+   * The selected value.
+   * Used when the component is controlled.
+   */
+  value: e.any,
+  /**
+   * The visible view.
+   * Used when the component view is controlled.
+   * Must be a valid option from `views` list.
+   */
+  view: e.oneOf(["day", "hours", "minutes", "month", "seconds", "year"]),
+  /**
+   * Define custom view renderers for each section.
+   * If `null`, the section will only have field editing.
+   * If `undefined`, internally defined view will be the used.
+   */
+  viewRenderers: e.shape({
+    day: e.func,
+    hours: e.func,
+    minutes: e.func,
+    month: e.func,
+    seconds: e.func,
+    year: e.func
+  }),
+  /**
+   * Available views.
+   */
+  views: e.arrayOf(e.oneOf(["day", "hours", "minutes", "month", "seconds", "year"]).isRequired),
+  /**
+   * Years rendered per row.
+   * @default 4 on desktop, 3 on mobile
+   */
+  yearsPerRow: e.oneOf([3, 4])
+});
+const cs = (o) => o !== "ownerState", Ns = A(fe, {
+  name: "HCRangeSelector",
+  slot: "root",
+  shouldForwardProp: cs
+})({}), Bs = A(fe, {
+  name: "HCRangeSelector",
+  slot: "numberRow"
+})({
+  display: "flex",
+  width: "100%"
+}), Fs = A(fe, {
+  name: "HCRangeSelector",
+  slot: "numberRangeRow"
+})({
+  display: "flex",
+  width: "100%"
+}), Es = A(Ke, {
+  name: "HCRangeSelector",
+  slot: "numberInput"
+})(({ theme: o }) => ({
+  marginRight: o.spacing(0.25)
+})), $s = A(Ke, {
+  name: "HCRangeSelector",
+  slot: "numberInput"
+})(({ theme: o }) => ({
+  marginLeft: o.spacing(0.25)
+})), Vs = A(fe, {
+  name: "HCRangeSelector",
+  slot: "modeColumn"
+})(({ theme: o }) => ({
+  flex: 1,
+  marginLeft: o.spacing(0.5)
+})), _s = A(fe, {
+  name: "HCRangeSelector",
+  slot: "compositeRow"
+})({
+  display: "flex",
+  alignItems: "flex-end",
+  width: "100%"
+}), Ls = A(Ke, {
+  name: "HCRangeSelector",
+  slot: "compositeCount"
+})(({ theme: o }) => ({
+  marginRight: o.spacing(0.5),
+  minWidth: 50,
+  width: 85
+})), js = A(fe, {
+  name: "HCRangeSelector",
+  slot: "compositeChild"
+})({
+  flex: 1,
+  maxWidth: 300
+}), Ws = A(fe, {
+  name: "HCRangeSelector",
+  slot: "dateTrigger"
+})(({ theme: o }) => ({
+  display: "flex",
+  alignItems: "center",
+  border: "1px solid",
+  borderColor: o.palette.action.disabled,
+  borderRadius: Number(o.shape.borderRadius),
+  paddingLeft: o.spacing(1),
+  paddingRight: o.spacing(1),
+  paddingTop: o.spacing(0.5),
+  paddingBottom: o.spacing(0.5),
+  height: 40,
+  width: "100%"
+})), Hs = A(xo, {
+  name: "HCRangeSelector",
+  slot: "dateTriggerText"
+})({
+  overflow: "hidden",
+  whiteSpace: "nowrap",
+  textOverflow: "ellipsis",
+  flex: 1
+}), zs = A(st, {
+  name: "HCRangeSelector",
+  slot: "dateTriggerArrow"
+})(({ theme: o }) => ({
+  marginLeft: o.spacing(0.25),
+  marginRight: o.spacing(0.25)
+})), As = A(tt)({}), Us = A(xo, {
+  name: "HCRangeSelector",
+  slot: "dateLimitCaption"
+})(({ theme: o }) => ({
+  marginLeft: o.spacing(0.5)
+})), qs = A(Jo, {
+  name: "HCRangeSelector",
+  slot: "datePicker"
+})(({ theme: o }) => ({
+  marginTop: o.spacing(1)
+})), Ys = A(fe, {
+  name: "HCRangeSelector",
+  slot: "dateUnitRow"
+})(({ theme: o }) => ({
+  display: "flex",
+  marginTop: o.spacing(2)
+})), Ks = A(nt, {
+  name: "HCRangeSelector",
+  slot: "dateUnitControl"
+})({
+  width: 240
+}), Xs = A(Ke, {
+  name: "HCRangeSelector",
+  slot: "dateRangeInput"
+})(({ theme: o }) => ({
+  marginLeft: o.spacing(1)
+}));
+export {
+  js as CompositeChild,
+  Ls as CompositeCount,
+  _s as CompositeRow,
+  Us as DateLimitCaption,
+  qs as DatePicker,
+  Xs as DateRangeInput,
+  Ws as DateTrigger,
+  zs as DateTriggerArrow,
+  As as DateTriggerEditButton,
+  Hs as DateTriggerText,
+  Ks as DateUnitControl,
+  Ys as DateUnitRow,
+  Vs as ModeColumn,
+  $s as NumberInputMax,
+  Es as NumberInputMin,
+  Fs as NumberRangeRow,
+  Bs as NumberRow,
+  Ns as RangeSelectorRoot
+};