mada-design-system 0.5.12 → 0.6.0

package/index.es127.js

@@ -1,210 +1,287 @@
-import v from "./index.es196.js";
-import fe from "./index.es197.js";
-import * as i from "react";
-import { clsx as de } from "./index.es128.js";
-import e from "./index.es198.js";
-import { useUtils as be, useLocaleText as ge, useNow as Ce } from "./index.es200.js";
-import { createIsAfterIgnoreDatePart as ve } from "./index.es225.js";
-import { getDigitalClockUtilityClass as De } from "./index.es226.js";
-import { useViews as ye } from "./index.es203.js";
-import { DIGITAL_CLOCK_VIEW_HEIGHT as he } from "./index.es209.js";
-import { useControlledValueWithTimezone as Te } from "./index.es207.js";
-import { singleItemValueManager as Ve } from "./index.es208.js";
-import { useClockReferenceDate as ke } from "./index.es227.js";
-import { jsx as D } from "react/jsx-runtime";
-import y from "./index.es210.js";
-import { PickerViewRoot as we } from "./index.es211.js";
-import Ie from "./index.es228.js";
-import Pe from "./index.es229.js";
-import Oe from "./index.es230.js";
-import xe from "./index.es219.js";
-import Re from "./index.es214.js";
-import $ from "./index.es215.js";
-import Me from "./index.es218.js";
-import { alpha as A } from "./index.es231.js";
-const Se = ["ampm", "timeStep", "autoFocus", "components", "componentsProps", "slots", "slotProps", "value", "defaultValue", "referenceDate", "disableIgnoringDatePartForTimeValidation", "maxTime", "minTime", "disableFuture", "disablePast", "minutesStep", "shouldDisableClock", "shouldDisableTime", "onChange", "view", "openTo", "onViewChange", "focusedView", "onFocusedViewChange", "className", "disabled", "readOnly", "views", "skipDisabled", "timezone"], Fe = (o) => {
+import je from "./index.es200.js";
+import h from "./index.es199.js";
+import * as V from "react";
+import e from "./index.es201.js";
+import { clsx as $e } from "./index.es130.js";
+import { useCalendarState as Le } from "./index.es202.js";
+import { useUtils as de, useDefaultDates as ze } from "./index.es203.js";
+import { PickersFadeTransitionGroup as Ie } from "./index.es204.js";
+import { DayCalendar as Ge } from "./index.es205.js";
+import { useViews as Ue } from "./index.es206.js";
+import { applyDefaultDate as re, findClosestEnabledDate as ie, mergeDateAndTime as Be } from "./index.es207.js";
+import { useDefaultReduceAnimations as qe } from "./index.es208.js";
+import { getDateCalendarUtilityClass as Ke } from "./index.es209.js";
+import { useControlledValueWithTimezone as Je } from "./index.es210.js";
+import { singleItemValueManager as Qe } from "./index.es211.js";
+import { VIEW_HEIGHT as Xe } from "./index.es212.js";
+import { jsxs as le, jsx as f } from "react/jsx-runtime";
+import ue from "./index.es213.js";
+import { PickerViewRoot as Ze } from "./index.es214.js";
+import eo from "./index.es215.js";
+import { PickersCalendarHeader as oo } from "./index.es216.js";
+import ao from "./index.es217.js";
+import B from "./index.es218.js";
+import { YearCalendar as no } from "./index.es219.js";
+import { MonthCalendar as to } from "./index.es220.js";
+import so from "./index.es221.js";
+import ro from "./index.es222.js";
+const io = ["autoFocus", "onViewChange", "value", "defaultValue", "referenceDate", "disableFuture", "disablePast", "defaultCalendarMonth", "onChange", "onYearChange", "onMonthChange", "reduceAnimations", "shouldDisableDate", "shouldDisableMonth", "shouldDisableYear", "view", "views", "openTo", "className", "disabled", "readOnly", "minDate", "maxDate", "disableHighlightToday", "focusedView", "onFocusedViewChange", "showDaysOutsideCurrentMonth", "fixedWeekNumber", "dayOfWeekFormatter", "components", "componentsProps", "slots", "slotProps", "loading", "renderLoading", "displayWeekNumber", "yearsPerRow", "monthsPerRow", "timezone"], lo = (m) => {
   const {
-    classes: a
-  } = o;
-  return Me({
+    classes: i
+  } = m;
+  return so({
     root: ["root"],
-    list: ["list"],
-    item: ["item"]
-  }, De, a);
-}, _e = y(we, {
-  name: "MuiDigitalClock",
+    viewTransitionContainer: ["viewTransitionContainer"]
+  }, Ke, i);
+};
+function uo(m, i) {
+  var p, D, b, C, a, M, d;
+  const O = de(), F = ze(), k = qe(), t = ro({
+    props: m,
+    name: i
+  });
+  return h({}, t, {
+    loading: (p = t.loading) != null ? p : !1,
+    disablePast: (D = t.disablePast) != null ? D : !1,
+    disableFuture: (b = t.disableFuture) != null ? b : !1,
+    openTo: (C = t.openTo) != null ? C : "day",
+    views: (a = t.views) != null ? a : ["year", "day"],
+    reduceAnimations: (M = t.reduceAnimations) != null ? M : k,
+    renderLoading: (d = t.renderLoading) != null ? d : () => /* @__PURE__ */ f("span", {
+      children: "..."
+    }),
+    minDate: re(O, t.minDate, F.minDate),
+    maxDate: re(O, t.maxDate, F.maxDate)
+  });
+}
+const co = ue(Ze, {
+  name: "MuiDateCalendar",
   slot: "Root",
-  overridesResolver: (o, a) => a.root
-})(({
-  ownerState: o
-}) => ({
-  overflowY: "auto",
-  width: "100%",
-  "@media (prefers-reduced-motion: no-preference)": {
-    scrollBehavior: o.alreadyRendered ? "smooth" : "auto"
-  },
-  maxHeight: he
-})), Ne = y(Ie, {
-  name: "MuiDigitalClock",
-  slot: "List",
-  overridesResolver: (o, a) => a.list
+  overridesResolver: (m, i) => i.root
 })({
-  padding: 0
-}), je = y(Pe, {
-  name: "MuiDigitalClock",
-  slot: "Item",
-  overridesResolver: (o, a) => a.item
-})(({
-  theme: o
-}) => ({
-  padding: "8px 16px",
-  margin: "2px 4px",
-  "&:first-of-type": {
-    marginTop: 4
-  },
-  "&:hover": {
-    backgroundColor: o.vars ? `rgba(${o.vars.palette.primary.mainChannel} / ${o.vars.palette.action.hoverOpacity})` : A(o.palette.primary.main, o.palette.action.hoverOpacity)
-  },
-  "&.Mui-selected": {
-    backgroundColor: (o.vars || o).palette.primary.main,
-    color: (o.vars || o).palette.primary.contrastText,
-    "&:focus-visible, &:hover": {
-      backgroundColor: (o.vars || o).palette.primary.dark
-    }
-  },
-  "&.Mui-focusVisible": {
-    backgroundColor: o.vars ? `rgba(${o.vars.palette.primary.mainChannel} / ${o.vars.palette.action.focusOpacity})` : A(o.palette.primary.main, o.palette.action.focusOpacity)
-  }
-})), Le = /* @__PURE__ */ i.forwardRef(function(a, h) {
-  var T, V, k;
-  const r = be(), l = i.useRef(null), H = Oe(h, l), n = xe({
-    props: a,
-    name: "MuiDigitalClock"
-  }), {
-    ampm: G = r.is12HourCycleInCurrentLocale(),
-    timeStep: c = 30,
-    autoFocus: U,
-    components: w,
-    componentsProps: I,
-    slots: P,
-    slotProps: O,
-    value: W,
-    defaultValue: q,
-    referenceDate: B,
-    disableIgnoringDatePartForTimeValidation: x = !1,
-    maxTime: u,
-    minTime: m,
-    disableFuture: R,
-    disablePast: M,
-    minutesStep: S = 1,
-    shouldDisableClock: p,
-    shouldDisableTime: f,
-    onChange: J,
-    view: K,
-    openTo: Y,
-    onViewChange: Q,
-    focusedView: F,
-    onFocusedViewChange: X,
+  display: "flex",
+  flexDirection: "column",
+  height: Xe
+}), mo = ue(Ie, {
+  name: "MuiDateCalendar",
+  slot: "ViewTransitionContainer",
+  overridesResolver: (m, i) => i.viewTransitionContainer
+})({}), ho = /* @__PURE__ */ V.forwardRef(function(i, p) {
+  var D, b, C;
+  const a = de(), M = eo(), d = uo(i, "MuiDateCalendar"), {
+    autoFocus: O,
+    onViewChange: F,
+    value: k,
+    defaultValue: t,
+    referenceDate: ce,
+    disableFuture: g,
+    disablePast: y,
+    defaultCalendarMonth: me,
+    onChange: he,
+    onYearChange: q,
+    onMonthChange: A,
+    reduceAnimations: T,
+    shouldDisableDate: K,
+    shouldDisableMonth: J,
+    shouldDisableYear: Q,
+    view: fe,
+    views: X,
+    openTo: pe,
     className: Z,
-    disabled: ee,
-    readOnly: d,
-    views: oe = ["hours"],
-    skipDisabled: te = !1,
-    timezone: re
-  } = n, se = fe(n, Se), {
-    value: _,
-    handleValueChange: ae,
-    timezone: N
-  } = Te({
-    name: "DigitalClock",
-    timezone: re,
-    value: W,
-    defaultValue: q,
-    onChange: J,
-    valueManager: Ve
-  }), ie = ge(), b = Ce(N), j = i.useMemo(() => v({}, n, {
-    alreadyRendered: !!l.current
-  }), [n]), g = Fe(j), L = (T = (V = P == null ? void 0 : P.digitalClockItem) != null ? V : w == null ? void 0 : w.DigitalClockItem) != null ? T : je, le = Re({
-    elementType: L,
-    externalSlotProps: (k = O == null ? void 0 : O.digitalClockItem) != null ? k : I == null ? void 0 : I.digitalClockItem,
-    ownerState: {},
-    className: g.item
-  }), z = ke({
-    value: _,
-    referenceDate: B,
-    utils: r,
-    props: n,
-    timezone: N
-  }), ne = $((t) => ae(t, "finish", "hours")), {
-    setValueAndGoToNextView: ce
-  } = ye({
-    view: K,
-    views: oe,
-    openTo: Y,
-    onViewChange: Q,
-    onChange: ne,
-    focusedView: F,
-    onFocusedViewChange: X
-  }), ue = $((t) => {
-    ce(t, "finish");
-  });
-  i.useEffect(() => {
-    if (l.current === null)
-      return;
-    const t = l.current.querySelector('[role="listbox"] [role="option"][aria-selected="true"]');
-    if (!t)
-      return;
-    const s = t.offsetTop;
-    l.current.scrollTop = s - 4;
-  });
-  const E = i.useCallback((t) => {
-    const s = ve(x, r), C = () => !(m && s(m, t) || u && s(t, u) || R && s(t, b) || M && s(b, t)), pe = () => r.getMinutes(t) % S !== 0 || p != null && p(r.toJsDate(t).getTime(), "hours") ? !1 : f ? !f(t, "hours") : !0;
-    return !C() || !pe();
-  }, [x, r, m, u, R, b, M, S, p, f]), me = i.useMemo(() => {
-    const t = r.startOfDay(z);
-    return [t, ...Array.from({
-      length: Math.ceil(24 * 60 / c) - 1
-    }, (s, C) => r.addMinutes(t, c * (C + 1)))];
-  }, [z, c, r]);
-  return /* @__PURE__ */ D(_e, v({
-    ref: H,
-    className: de(g.root, Z),
-    ownerState: j
-  }, se, {
-    children: /* @__PURE__ */ D(Ne, {
-      autoFocusItem: U || !!F,
-      role: "listbox",
-      "aria-label": ie.timePickerToolbarTitle,
-      className: g.list,
-      children: me.map((t) => {
-        if (te && E(t))
-          return null;
-        const s = r.isEqual(t, _);
-        return /* @__PURE__ */ D(L, v({
-          onClick: () => !d && ue(t),
-          selected: s,
-          disabled: ee || E(t),
-          disableRipple: d,
-          role: "option",
-          "aria-disabled": d,
-          "aria-selected": s
-        }, le, {
-          children: r.format(t, G ? "fullTime12h" : "fullTime24h")
-        }), r.toISO(t));
+    disabled: x,
+    readOnly: De,
+    minDate: u,
+    maxDate: c,
+    disableHighlightToday: be,
+    focusedView: Ce,
+    onFocusedViewChange: ge,
+    showDaysOutsideCurrentMonth: ye,
+    fixedWeekNumber: we,
+    dayOfWeekFormatter: Pe,
+    components: _,
+    componentsProps: H,
+    slots: R,
+    slotProps: N,
+    loading: ve,
+    renderLoading: Ve,
+    displayWeekNumber: Me,
+    yearsPerRow: Oe,
+    monthsPerRow: Fe,
+    timezone: Te
+  } = d, xe = je(d, io), {
+    value: n,
+    handleValueChange: Y,
+    timezone: w
+  } = Je({
+    name: "DateCalendar",
+    timezone: Te,
+    value: k,
+    defaultValue: t,
+    onChange: he,
+    valueManager: Qe
+  }), {
+    view: s,
+    setView: Re,
+    focusedView: E,
+    setFocusedView: P,
+    goToNextView: ee,
+    setValueAndGoToNextView: oe
+  } = Ue({
+    view: fe,
+    views: X,
+    openTo: pe,
+    onChange: Y,
+    onViewChange: F,
+    autoFocus: O,
+    focusedView: Ce,
+    onFocusedViewChange: ge
+  }), {
+    referenceDate: S,
+    calendarState: ae,
+    changeFocusedDay: j,
+    changeMonth: $,
+    handleChangeMonth: Ne,
+    isDateDisabled: W,
+    onMonthSwitchingAnimationEnd: We
+  } = Le({
+    value: n,
+    defaultCalendarMonth: me,
+    referenceDate: ce,
+    reduceAnimations: T,
+    onMonthChange: A,
+    minDate: u,
+    maxDate: c,
+    shouldDisableDate: K,
+    disablePast: y,
+    disableFuture: g,
+    timezone: w
+  }), ke = x && n || u, Ae = x && n || c, ne = `${M}-grid-label`, L = E !== null, te = (D = (b = R == null ? void 0 : R.calendarHeader) != null ? b : _ == null ? void 0 : _.CalendarHeader) != null ? D : oo, _e = ao({
+    elementType: te,
+    externalSlotProps: (C = N == null ? void 0 : N.calendarHeader) != null ? C : H == null ? void 0 : H.calendarHeader,
+    additionalProps: {
+      views: X,
+      view: s,
+      currentMonth: ae.currentMonth,
+      onViewChange: Re,
+      onMonthChange: (o, r) => Ne({
+        newMonth: o,
+        direction: r
+      }),
+      minDate: ke,
+      maxDate: Ae,
+      disabled: x,
+      disablePast: y,
+      disableFuture: g,
+      reduceAnimations: T,
+      timezone: w,
+      labelId: ne,
+      slots: R,
+      slotProps: N
+    },
+    ownerState: d
+  }), He = B((o) => {
+    const r = a.startOfMonth(o), v = a.endOfMonth(o), l = W(o) ? ie({
+      utils: a,
+      date: o,
+      minDate: a.isBefore(u, r) ? r : u,
+      maxDate: a.isAfter(c, v) ? v : c,
+      disablePast: y,
+      disableFuture: g,
+      isDateDisabled: W,
+      timezone: w
+    }) : o;
+    l ? (oe(l, "finish"), A == null || A(r)) : (ee(), $(r)), j(l, !0);
+  }), Ye = B((o) => {
+    const r = a.startOfYear(o), v = a.endOfYear(o), l = W(o) ? ie({
+      utils: a,
+      date: o,
+      minDate: a.isBefore(u, r) ? r : u,
+      maxDate: a.isAfter(c, v) ? v : c,
+      disablePast: y,
+      disableFuture: g,
+      isDateDisabled: W,
+      timezone: w
+    }) : o;
+    l ? (oe(l, "finish"), q == null || q(l)) : (ee(), $(r)), j(l, !0);
+  }), Ee = B((o) => Y(o && Be(a, o, n ?? S), "finish", s));
+  V.useEffect(() => {
+    n != null && a.isValid(n) && $(n);
+  }, [n]);
+  const z = d, se = lo(z), I = {
+    disablePast: y,
+    disableFuture: g,
+    maxDate: c,
+    minDate: u
+  }, G = {
+    disableHighlightToday: be,
+    readOnly: De,
+    disabled: x,
+    timezone: w,
+    gridLabelId: ne
+  }, U = V.useRef(s);
+  V.useEffect(() => {
+    U.current !== s && (E === U.current && P(s, !0), U.current = s);
+  }, [E, P, s]);
+  const Se = V.useMemo(() => [n], [n]);
+  return /* @__PURE__ */ le(co, h({
+    ref: p,
+    className: $e(se.root, Z),
+    ownerState: z
+  }, xe, {
+    children: [/* @__PURE__ */ f(te, h({}, _e)), /* @__PURE__ */ f(mo, {
+      reduceAnimations: T,
+      className: se.viewTransitionContainer,
+      transKey: s,
+      ownerState: z,
+      children: /* @__PURE__ */ le("div", {
+        children: [s === "year" && /* @__PURE__ */ f(no, h({}, I, G, {
+          value: n,
+          onChange: Ye,
+          shouldDisableYear: Q,
+          hasFocus: L,
+          onFocusedViewChange: (o) => P("year", o),
+          yearsPerRow: Oe,
+          referenceDate: S
+        })), s === "month" && /* @__PURE__ */ f(to, h({}, I, G, {
+          hasFocus: L,
+          className: Z,
+          value: n,
+          onChange: He,
+          shouldDisableMonth: J,
+          onFocusedViewChange: (o) => P("month", o),
+          monthsPerRow: Fe,
+          referenceDate: S
+        })), s === "day" && /* @__PURE__ */ f(Ge, h({}, ae, I, G, {
+          onMonthSwitchingAnimationEnd: We,
+          onFocusedDayChange: j,
+          reduceAnimations: T,
+          selectedDays: Se,
+          onSelectedDaysChange: Ee,
+          shouldDisableDate: K,
+          shouldDisableMonth: J,
+          shouldDisableYear: Q,
+          hasFocus: L,
+          onFocusedViewChange: (o) => P("day", o),
+          showDaysOutsideCurrentMonth: ye,
+          fixedWeekNumber: we,
+          dayOfWeekFormatter: Pe,
+          displayWeekNumber: Me,
+          components: _,
+          componentsProps: H,
+          slots: R,
+          slotProps: N,
+          loading: ve,
+          renderLoading: Ve
+        }))]
       })
-    })
+    })]
   }));
 });
-process.env.NODE_ENV !== "production" && (Le.propTypes = {
+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"  |
   // ----------------------------------------------------------------------
-  /**
-   * 12h/24h view for hour selection clock.
-   * @default `utils.is12HourCycleInCurrentLocale()`
-   */
-  ampm: e.bool,
   /**
    * If `true`, the main element is focused during the first mount.
    * This main element is:
@@ -212,13 +289,10 @@ process.env.NODE_ENV !== "production" && (Le.propTypes = {
    * - 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,
   /**
-   * Overrideable components.
+   * Overridable components.
    * @default {}
    * @deprecated Please use `slots`.
    */
@@ -229,13 +303,26 @@ process.env.NODE_ENV !== "production" && (Le.propTypes = {
    * @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.  Deprecated, will be removed in v7: Use `date` instead.
+   * @param {TDate} date The date of the day of week provided by the adapter.
+   * @returns {string} The name to display.
+   * @default (_day: string, date: TDate) => adapter.format(date, 'weekdayShort').charAt(0).toUpperCase()
+   */
+  dayOfWeekFormatter: e.func,
+  /**
+   * Default calendar month displayed when `value` and `defaultValue` are empty.
+   * @deprecated Consider using `referenceDate` instead.
+   */
+  defaultCalendarMonth: e.any,
   /**
    * The default selected value.
    * Used when the component is not controlled.
    */
   defaultValue: e.any,
   /**
-   * If `true`, the picker views and text field are disabled.
+   * If `true`, the picker and text field are disabled.
    * @default false
    */
   disabled: e.bool,
@@ -245,34 +332,48 @@ process.env.NODE_ENV !== "production" && (Le.propTypes = {
    */
   disableFuture: e.bool,
   /**
-   * Do not ignore date part when validating min/max time.
+   * If `true`, today's date is rendering without highlighting with circle.
    * @default false
    */
-  disableIgnoringDatePartForTimeValidation: e.bool,
+  disableHighlightToday: 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,
   /**
    * Controlled focused view.
    */
-  focusedView: e.oneOf(["hours"]),
+  focusedView: e.oneOf(["day", "month", "year"]),
   /**
-   * Maximal selectable time.
-   * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`.
+   * If `true`, calls `renderLoading` instead of rendering the day calendar.
+   * Can be used to preload information and show it in calendar.
+   * @default false
    */
-  maxTime: e.any,
+  loading: e.bool,
   /**
-   * Minimal selectable time.
-   * The date part of the object will be ignored unless `props.disableIgnoringDatePartForTimeValidation === true`.
+   * Maximal selectable date.
    */
-  minTime: e.any,
+  maxDate: e.any,
   /**
-   * Step over minutes.
-   * @default 1
+   * Minimal selectable date.
    */
-  minutesStep: e.number,
+  minDate: e.any,
+  /**
+   * Months rendered per row.
+   * @default 3
+   */
+  monthsPerRow: e.oneOf([3, 4]),
   /**
    * 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.
@@ -289,56 +390,93 @@ process.env.NODE_ENV !== "production" && (Le.propTypes = {
    * @param {boolean} hasFocus `true` if the view should be focused.
    */
   onFocusedViewChange: e.func,
+  /**
+   * Callback fired on month change.
+   * @template TDate
+   * @param {TDate} month The new month.
+   */
+  onMonthChange: 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,
   /**
    * The default visible view.
    * Used when the component view is not controlled.
    * Must be a valid option from `views` list.
    */
-  openTo: e.oneOf(["hours"]),
+  openTo: e.oneOf(["day", "month", "year"]),
   /**
-   * If `true`, the picker views and text field are read-only.
+   * Make picker read only.
    * @default false
    */
   readOnly: e.bool,
+  /**
+   * If `true`, disable heavy animations.
+   * @default `@media(prefers-reduced-motion: reduce)` || `navigator.userAgent` matches Android <10 or iOS <13
+   */
+  reduceAnimations: e.bool,
   /**
    * The date used to generate the new value when both `value` and `defaultValue` are empty.
-   * @default The closest valid time using the validation props, except callbacks such as `shouldDisableTime`.
+   * @default The closest valid date using the validation props, except callbacks such as `shouldDisableDate`.
    */
   referenceDate: e.any,
   /**
-   * 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`.
+   * Component displaying when passed `loading` true.
+   * @returns {React.ReactNode} The node to render when loading.
+   * @default () => <span data-mui-test="loading-progress">...</span>
    */
-  shouldDisableClock: e.func,
+  renderLoading: e.func,
   /**
-   * Disable specific time.
+   * Disable specific date.
+   *
+   * Warning: This function can be called multiple times (e.g. when rendering date calendar, checking if focus can be moved to a certain date, etc.). Expensive computations can impact performance.
+   *
    * @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.
+   * @param {TDate} day The date to test.
+   * @returns {boolean} If `true` the date will be disabled.
    */
-  shouldDisableTime: e.func,
+  shouldDisableDate: e.func,
   /**
-   * If `true`, disabled digital clock items will not be rendered.
+   * 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 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
    */
-  skipDisabled: e.bool,
+  showDaysOutsideCurrentMonth: e.bool,
   /**
    * The props used for each component slot.
    * @default {}
    */
   slotProps: e.object,
   /**
-   * Overrideable component slots.
+   * Overridable component slots.
    * @default {}
    */
   slots: e.object,
@@ -346,12 +484,6 @@ process.env.NODE_ENV !== "production" && (Le.propTypes = {
    * 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 time steps between two time options.
-   * For example, if `timeStep = 45`, then the available time options will be `[00:00, 00:45, 01:30, 02:15, 03:00, etc.]`.
-   * @default 30
-   */
-  timeStep: e.number,
   /**
    * Choose which timezone to use for the value.
    * Example: "default", "system", "UTC", "America/New_York".
@@ -370,12 +502,17 @@ process.env.NODE_ENV !== "production" && (Le.propTypes = {
    * Used when the component view is controlled.
    * Must be a valid option from `views` list.
    */
-  view: e.oneOf(["hours"]),
+  view: e.oneOf(["day", "month", "year"]),
   /**
    * Available views.
    */
-  views: e.arrayOf(e.oneOf(["hours"]))
+  views: e.arrayOf(e.oneOf(["day", "month", "year"]).isRequired),
+  /**
+   * Years rendered per row.
+   * @default 3
+   */
+  yearsPerRow: e.oneOf([3, 4])
 });
 export {
-  Le as DigitalClock
+  ho as DateCalendar
 };