@sberbusiness/triplex-next 1.4.0 → 1.5.0

package/components/Calendar/Calendar.js

@@ -0,0 +1,183 @@
+var F = Object.defineProperty;
+var M = (l, d, e) => d in l ? F(l, d, { enumerable: !0, configurable: !0, writable: !0, value: e }) : l[d] = e;
+var p = (l, d, e) => M(l, typeof d != "symbol" ? d + "" : d, e);
+import { jsx as f, jsxs as b } from "react/jsx-runtime";
+import { a as H, h as u, c as I } from "../../chunks/vendor-9KVE23Ri.js";
+import V from "react";
+import { globalLimitRange as _, dateFormatYYYYMMDD as O } from "../../consts/DateConst.js";
+import { ECalendarPickType as g, ECalendarViewMode as h } from "./enums.js";
+import { CalendarContext as C } from "./CalendarContext.js";
+import { CalendarControls as x } from "./components/CalendarControls.js";
+import { CalendarView as N } from "./components/CalendarView.js";
+import { CalendarFooter as E } from "./components/CalendarFooter.js";
+import { CalendarTodayButton as j } from "./components/CalendarTodayButton.js";
+import { CalendarRange as q } from "./CalendarRange.js";
+import { parsePickedDate as r, formatDate as k, getHeader as L } from "./utils.js";
+const U = "calendar__7d4a02e3", $ = "adaptive__0f17d18d", R = {
+  calendar: U,
+  adaptive: $
+};
+class v extends V.PureComponent {
+  constructor(e) {
+    super(e);
+    // Уникальный идентификатор для связи периода с таблицей.
+    p(this, "periodId", `calendar-period-${H()}`);
+    /** Обработчик выбора даты. */
+    p(this, "handleDateSelect", (e) => {
+      if (this.props.isRange) {
+        let t;
+        if (this.props.pickedDate[0] && !this.props.pickedDate[1]) {
+          const a = r(this.props.pickedDate[0], this.props.format);
+          t = e.isBefore(a) ? [e, a] : [a, e];
+        } else
+          t = [e, null];
+        this.props.onDateChange(t);
+      } else
+        this.props.onDateChange(e);
+    });
+    /** Обработчик смены страницы. */
+    p(this, "handlePageChange", (e, t) => {
+      const { onPageChange: a } = this.props;
+      this.setState({
+        header: k(e, t),
+        viewDate: e
+      }), a == null || a(e, t);
+    });
+    /** Обработчик изменения вида отображения. */
+    p(this, "handleViewChange", (e, t) => {
+      const { onViewChange: a } = this.props;
+      this.setState({
+        header: k(e, t),
+        viewDate: e,
+        viewMode: t
+      }), a == null || a(e, t);
+    });
+    /** Рендер футера. */
+    p(this, "renderFooter", () => {
+      const { pickType: e, todayButtonProps: t } = this.props, { viewDate: a, viewMode: i } = this.state;
+      let o, s;
+      return e === g.datePick ? (o = u().startOf("day"), s = i === h.DAYS && a.isSame(o, "month")) : (o = u().startOf("month"), s = i === h.MONTHS && a.isSame(o, "year")), /* @__PURE__ */ f(E, { children: /* @__PURE__ */ f(
+        j,
+        {
+          todayDate: o,
+          currentPeriodSelected: s,
+          ...typeof t == "function" ? t({ viewMode: i, currentPeriodSelected: s }) : t
+        }
+      ) });
+    });
+    const { format: t, pickType: a, reversedPick: i } = this.props, o = this.props.isRange ? r(this.props.defaultDate, t) : r(this.props.pickedDate, t), s = this.getInitialViewDate(o);
+    let n;
+    i ? n = h.YEARS : a == g.monthYearPick ? n = h.MONTHS : n = h.DAYS;
+    const c = k(s, n);
+    this.state = {
+      header: c,
+      pickedDate: o,
+      viewDate: s,
+      viewMode: n
+    };
+  }
+  /** Получить изначальную дату для навигации. */
+  getInitialViewDate(e) {
+    const { defaultViewDate: t, format: a, limitRange: i } = this.props;
+    if (e && e.isValid())
+      return e.clone();
+    if (t) {
+      const s = r(t, a);
+      if (s && s.isValid())
+        return s.clone();
+    }
+    const o = u().startOf("day");
+    if (i) {
+      if (i.dateFrom && o.isBefore(i.dateFrom))
+        return i.dateFrom.clone();
+      if (i.dateTo && o.isAfter(i.dateTo))
+        return i.dateTo.clone();
+    }
+    return o;
+  }
+  componentDidUpdate(e, t) {
+    const { format: a } = this.props, { viewDate: i } = this.state, { viewDate: o } = t, s = this.props.isRange ? r(this.state.viewDate, a) : r(this.props.pickedDate, a), n = s == null ? void 0 : s.isValid(), c = n ? s : o, m = e.isRange ? r(t.viewDate, a) : r(e.pickedDate, a);
+    if (!(!n || m != null && m.isSame(c, "day"))) {
+      let D = {};
+      i && !i.isSame(s, "month") && (D = {
+        currentTab: h.DAYS,
+        header: L(c),
+        viewDate: c.clone()
+      }), this.setState({
+        ...D,
+        pickedDate: s
+      });
+    }
+  }
+  render() {
+    const {
+      format: e,
+      pickType: t,
+      limitRange: a,
+      markedDays: i,
+      disabledDays: o,
+      dayHtmlAttributes: s,
+      monthHtmlAttributes: n,
+      yearHtmlAttributes: c,
+      prevButtonProps: m,
+      nextButtonProps: D,
+      viewButtonProps: P,
+      todayButtonProps: S
+    } = this.props, { viewMode: T, viewDate: Y, header: A } = this.state, B = I(R.calendar, {
+      [R.adaptive]: !this.props.isRange && !!this.props.adaptiveMode
+    });
+    let y, w;
+    return this.props.isRange ? w = [
+      r(this.props.pickedDate[0], e),
+      r(this.props.pickedDate[1], e)
+    ] : y = r(this.props.pickedDate, e), /* @__PURE__ */ f("div", { className: B, "data-tx": "1.5.0", children: /* @__PURE__ */ b(
+      C.Provider,
+      {
+        value: {
+          format: e,
+          limitRange: a,
+          pickType: t,
+          markedDays: i,
+          disabledDays: o,
+          viewDate: Y,
+          viewMode: T,
+          periodId: this.periodId,
+          onDateSelect: this.handleDateSelect,
+          onPageChange: this.handlePageChange,
+          onViewChange: this.handleViewChange
+        },
+        children: [
+          /* @__PURE__ */ f(
+            x,
+            {
+              prevButtonProps: m,
+              nextButtonProps: D,
+              viewButtonProps: P,
+              children: A
+            }
+          ),
+          /* @__PURE__ */ f(
+            N,
+            {
+              pickedDate: y,
+              pickedRange: w,
+              dayHtmlAttributes: s,
+              monthHtmlAttributes: n,
+              yearHtmlAttributes: c
+            }
+          ),
+          S && this.renderFooter()
+        ]
+      }
+    ) });
+  }
+}
+p(v, "Range", q), p(v, "defaultProps", {
+  format: O,
+  limitRange: _,
+  pickType: g.datePick
+}), p(v, "contextType", C);
+export {
+  v as Calendar
+};
+//# sourceMappingURL=Calendar.js.map

package/components/Calendar/CalendarContext.js

@@ -0,0 +1,22 @@
+import e from "react";
+import { h as a } from "../../chunks/vendor-9KVE23Ri.js";
+import { globalLimitRange as t, dateFormatYYYYMMDD as o } from "../../consts/DateConst.js";
+import { ECalendarViewMode as r, ECalendarPickType as i } from "./enums.js";
+const l = e.createContext({
+  format: o,
+  limitRange: t,
+  pickType: i.datePick,
+  viewDate: a().startOf("day"),
+  viewMode: r.DAYS,
+  periodId: "",
+  onDateSelect: () => {
+  },
+  onPageChange: () => {
+  },
+  onViewChange: () => {
+  }
+});
+export {
+  l as CalendarContext
+};
+//# sourceMappingURL=CalendarContext.js.map

package/components/Calendar/CalendarRange.js

@@ -0,0 +1,28 @@
+import { jsxs as s, Fragment as d } from "react/jsx-runtime";
+import { h as n } from "../../chunks/vendor-9KVE23Ri.js";
+const h = ({
+  children: e,
+  defaultDate: t,
+  onRangeChange: a,
+  pickedRange: r,
+  ...o
+}) => /* @__PURE__ */ s(d, { children: [
+  e[0]({
+    ...o,
+    isRange: !0,
+    defaultDate: t ?? n(),
+    onDateChange: a,
+    pickedDate: r
+  }),
+  e[1]({
+    ...o,
+    isRange: !0,
+    defaultDate: (t ?? n()).add(1, "month"),
+    onDateChange: a,
+    pickedDate: r
+  })
+] });
+export {
+  h as CalendarRange
+};
+//# sourceMappingURL=CalendarRange.js.map

package/components/Calendar/CalendarViewContext.js

@@ -0,0 +1,8 @@
+import e from "react";
+const o = e.createContext({
+  viewItemFocusedRef: { current: !1 }
+});
+export {
+  o as CalendarViewContext
+};
+//# sourceMappingURL=CalendarViewContext.js.map

package/components/Calendar/components/CalendarControls.js

@@ -0,0 +1,98 @@
+import { jsxs as T, jsx as s } from "react/jsx-runtime";
+import { useContext as D } from "react";
+import B from "@sberbusiness/icons-next/CaretleftStrokeSrvIcon24";
+import v from "@sberbusiness/icons-next/CaretrightStrokeSrvIcon24";
+import { CalendarContext as w } from "../CalendarContext.js";
+import { Button as H } from "../../Button/Button.js";
+import { ButtonIcon as A } from "../../Button/ButtonIcon.js";
+import { EButtonIconShape as E, EButtonTheme as L } from "../../Button/enums.js";
+import { ECalendarViewMode as e } from "../enums.js";
+import { globalLimitRange as O } from "../../../consts/DateConst.js";
+import { EComponentSize as V } from "../../../enums/EComponentSize.js";
+const U = "calendarControls__8319a1a8", j = {
+  calendarControls: U
+}, Z = ({
+  children: m,
+  prevButtonProps: i = {},
+  nextButtonProps: d = {},
+  viewButtonProps: c = {}
+}) => {
+  const { viewDate: a, viewMode: n, limitRange: u, periodId: S, onPageChange: h, onViewChange: p } = D(w), b = () => {
+    const { disabled: t, onClick: o, ...r } = typeof i == "function" ? i(n) : i;
+    return /* @__PURE__ */ s(
+      A,
+      {
+        shape: E.CIRCLE,
+        disabled: t || N(),
+        onClick: R(o),
+        ...r,
+        children: /* @__PURE__ */ s(B, { paletteIndex: 5 })
+      }
+    );
+  }, g = () => {
+    const { disabled: t, onClick: o, ...r } = typeof d == "function" ? d(n) : d;
+    return /* @__PURE__ */ s(
+      A,
+      {
+        shape: E.CIRCLE,
+        disabled: t || Y(),
+        onClick: x(o),
+        ...r,
+        children: /* @__PURE__ */ s(v, { paletteIndex: 5 })
+      }
+    );
+  }, I = () => {
+    const { onClick: t, ...o } = typeof c == "function" ? c(n) : c;
+    return /* @__PURE__ */ s(
+      H,
+      {
+        id: S,
+        "aria-live": "polite",
+        theme: L.LINK,
+        size: V.SM,
+        onClick: M(t),
+        ...o,
+        children: m
+      }
+    );
+  }, N = () => {
+    const t = a.clone();
+    return n === e.DAYS ? t.startOf("month") : n === e.MONTHS ? t.startOf("year") : n === e.YEARS && t.startOf("year").subtract(5, "years"), t.subtract(1, "day").isBefore(u.dateFrom || O.dateFrom, "day");
+  }, Y = () => {
+    const t = a.clone();
+    return n === e.DAYS ? t.endOf("month") : n === e.MONTHS ? t.endOf("year") : n === e.YEARS && t.endOf("year").add(6, "years"), t.add(1, "day").isAfter(u.dateTo || O.dateTo, "day");
+  }, R = (t) => (o) => {
+    const r = C(), l = y(), f = a.clone().subtract(l, r);
+    h(f, n), t == null || t(o);
+  }, x = (t) => (o) => {
+    const r = C(), l = y(), f = a.clone().add(l, r);
+    h(f, n), t == null || t(o);
+  }, M = (t) => (o) => {
+    n === e.DAYS ? p(a, e.MONTHS) : n === e.MONTHS && p(a, e.YEARS), t == null || t(o);
+  }, C = () => {
+    switch (n) {
+      case e.DAYS:
+        return "month";
+      case e.MONTHS:
+      case e.YEARS:
+        return "year";
+    }
+  }, y = () => {
+    switch (n) {
+      case e.DAYS:
+      case e.MONTHS:
+        return 1;
+      case e.YEARS:
+        return 12;
+    }
+  };
+  return /* @__PURE__ */ T("div", { className: j.calendarControls, children: [
+    b(),
+    n === e.YEARS ? /* @__PURE__ */ s("span", { id: S, tabIndex: -1, "aria-live": "polite", children: m }) : I(),
+    g()
+  ] });
+};
+export {
+  Z as CalendarControls
+};
+//# sourceMappingURL=CalendarControls.js.map

package/components/Calendar/components/CalendarFooter.js

@@ -0,0 +1,9 @@
+import { jsx as e } from "react/jsx-runtime";
+const a = "calendarFooter__99e0f409", r = {
+  calendarFooter: a
+}, t = ({ children: o }) => /* @__PURE__ */ e("div", { className: r.calendarFooter, children: o });
+t.displayName = "CalendarFooter";
+export {
+  t as CalendarFooter
+};
+//# sourceMappingURL=CalendarFooter.js.map

package/components/Calendar/components/CalendarTodayButton.js

@@ -0,0 +1,31 @@
+import { jsx as O } from "react/jsx-runtime";
+import g, { useContext as E } from "react";
+import { CalendarContext as N } from "../CalendarContext.js";
+import { Button as R } from "../../Button/Button.js";
+import { EButtonTheme as w } from "../../Button/enums.js";
+import { ECalendarPickType as f, ECalendarViewMode as r } from "../enums.js";
+import { isDateOutOfRange as l, isDayDisabled as x } from "../utils.js";
+import { EComponentSize as A } from "../../../enums/EComponentSize.js";
+const B = g.forwardRef(
+  ({ todayDate: e, currentPeriodSelected: d, disabled: o, onClick: i, ...p }, u) => {
+    const { format: S, limitRange: t, pickType: n, viewMode: m, disabledDays: C, onPageChange: a, onViewChange: s, onDateSelect: c } = E(N), T = (M) => {
+      d ? c(e) : n === f.datePick ? m === r.DAYS ? a(e, r.DAYS) : s(e, r.DAYS) : m === r.MONTHS ? a(e, r.MONTHS) : s(e, r.MONTHS), i == null || i(M);
+    }, h = () => o !== void 0 ? o : n === f.datePick ? l(e, t, "day") || x(e.format(S), C) : l(e, t, "month");
+    return /* @__PURE__ */ O(
+      R,
+      {
+        theme: w.SECONDARY,
+        size: A.SM,
+        onClick: T,
+        disabled: h(),
+        ...p,
+        ref: u
+      }
+    );
+  }
+);
+B.displayName = "CalendarTodayButton";
+export {
+  B as CalendarTodayButton
+};
+//# sourceMappingURL=CalendarTodayButton.js.map

package/components/Calendar/components/CalendarView.js

@@ -0,0 +1,30 @@
+import { jsx as e } from "react/jsx-runtime";
+import { useContext as d, useRef as f } from "react";
+import { CalendarContext as C } from "../CalendarContext.js";
+import { CalendarViewContext as c } from "../CalendarViewContext.js";
+import { ECalendarViewMode as o } from "../enums.js";
+import { CalendarViewDays as l } from "./CalendarViewDays.js";
+import { CalendarViewMonths as w } from "./CalendarViewMonths.js";
+import { CalendarViewYears as p } from "./CalendarViewYears.js";
+const Y = ({
+  dayHtmlAttributes: t,
+  monthHtmlAttributes: n,
+  yearHtmlAttributes: a,
+  ...r
+}) => {
+  const { viewMode: i } = d(C), m = f(!1), s = () => {
+    switch (i) {
+      case o.DAYS:
+        return /* @__PURE__ */ e(l, { dayHtmlAttributes: t, ...r });
+      case o.MONTHS:
+        return /* @__PURE__ */ e(w, { monthHtmlAttributes: n, ...r });
+      case o.YEARS:
+        return /* @__PURE__ */ e(p, { yearHtmlAttributes: a, ...r });
+    }
+  };
+  return /* @__PURE__ */ e(c.Provider, { value: { viewItemFocusedRef: m }, children: s() });
+};
+export {
+  Y as CalendarView
+};
+//# sourceMappingURL=CalendarView.js.map

package/components/Calendar/components/CalendarViewDays.js

@@ -0,0 +1,109 @@
+import { jsxs as L, jsx as d } from "react/jsx-runtime";
+import { h as f, c as q } from "../../../chunks/vendor-9KVE23Ri.js";
+import { useContext as N, useCallback as x, useState as z, useEffect as J } from "react";
+import { isDateOutOfRange as I, isDayDisabled as Q } from "../utils.js";
+import { WEEKDAYS_SET as X } from "../../../consts/DateConst.js";
+import { CalendarViewContext as Z } from "../CalendarViewContext.js";
+import { s as o, C as ee } from "../../../chunks/CalendarViewItem-Cs4qo2T0.js";
+import { isKey as m } from "../../../utils/keyboard.js";
+import { ECalendarDateMarkType as ae, ECalendarViewMode as M } from "../enums.js";
+import { CalendarContext as te } from "../CalendarContext.js";
+const ye = ({
+  pickedDate: i,
+  pickedRange: r,
+  dayHtmlAttributes: h = {}
+}) => {
+  const { format: u, periodId: V, limitRange: S, viewDate: n, markedDays: y, disabledDays: C, onDateSelect: W, onPageChange: T } = N(te), { viewItemFocusedRef: A } = N(Z), _ = n.clone().startOf("month").startOf("week"), b = x(
+    (e) => I(e, S, "day") || Q(e.format(u), C),
+    [S, C, u]
+  ), w = x(() => {
+    if (i && i.isSame(n, "month"))
+      return i;
+    {
+      const e = n.clone().startOf("month");
+      for (let a = 0; a < e.daysInMonth(); a++)
+        if (e.add(a, "day"), !b(e))
+          return e;
+    }
+  }, [i, n, b]), [O, E] = z(w());
+  J(() => {
+    A.current || E(w());
+  }, [n, A, w]);
+  const B = () => {
+    const e = f.weekdays(!0), a = f.weekdaysMin(!0);
+    return /* @__PURE__ */ d("thead", { children: /* @__PURE__ */ d("tr", { children: X.map((t) => /* @__PURE__ */ d(
+      "th",
+      {
+        className: o.calendarViewDaysHeader,
+        abbr: e[t],
+        children: a[t]
+      },
+      `calendar-table-header-${t}`
+    )) }) });
+  }, g = () => /* @__PURE__ */ d("tbody", { className: o.calendarViewDaysBody, children: [0, 1, 2, 3, 4, 5].map((e) => /* @__PURE__ */ d("tr", { children: [0, 1, 2, 3, 4, 5, 6].map((a) => P(e, a)) }, `calendar-table-row-${e}`)) }), P = (e, a) => {
+    const t = f(_).add(e * 7 + a, "day"), s = q({ [o.current]: F(t) }, $(t)), l = G(t), D = b(t), k = !D && v(t), H = K(t), p = Y(t);
+    return /* @__PURE__ */ d(
+      ee,
+      {
+        className: s,
+        ...typeof h == "function" ? h({ marked: p !== void 0 }) : h,
+        date: t,
+        unit: "day",
+        active: l,
+        disabled: D,
+        tabbable: k,
+        muted: H,
+        markType: p,
+        onKeyDown: j(t),
+        onDateSelect: R,
+        children: t.date()
+      },
+      `calendar-table-data-${a}`
+    );
+  }, v = (e) => O ? e.isSame(O, "day") : !1, K = (e) => !e.isSame(n, "month"), F = (e) => e.isSame(f(), "day"), G = (e) => {
+    var a, t;
+    return r ? !!((a = r[0]) != null && a.isSame(e, "day") || (t = r[1]) != null && t.isSame(e, "day")) : !!i && e.isSame(i, "day");
+  }, Y = (e) => {
+    if (y) {
+      const a = e.format(u);
+      if (Array.isArray(y)) {
+        if (y.includes(a))
+          return ae.BASIC;
+      } else if (a in y)
+        return y[e.format(u)];
+    }
+  }, $ = (e) => {
+    if (!r || !r[0] || !r[1] || !e.isBetween(r[0], r[1], "day", "[]"))
+      return;
+    let a;
+    return r[0].isSame(r[1], "day") ? a = o.rangeSingle : e.isSame(r[0], "day") ? a = o.rangeStart : e.isSame(r[1], "day") ? a = o.rangeEnd : a = o.rangeBetween, a;
+  }, c = (e, a, t, s) => {
+    const l = e.clone(), D = {
+      add: f.fn.add.bind(l),
+      subtract: f.fn.subtract.bind(l)
+    }[a];
+    for (; D(t, s); ) {
+      if (I(l, S, "day"))
+        return e;
+      if (!b(l))
+        break;
+    }
+    return l;
+  }, j = (e) => (a) => {
+    const t = a.code || a.keyCode;
+    let s;
+    m(t, "ARROW_RIGHT") ? (s = c(e, "add", 1, "day"), a.preventDefault()) : m(t, "ARROW_LEFT") ? (s = c(e, "subtract", 1, "day"), a.preventDefault()) : m(t, "ARROW_DOWN") ? (s = c(e, "add", 1, "week"), a.preventDefault()) : m(t, "ARROW_UP") ? (s = c(e, "subtract", 1, "week"), a.preventDefault()) : m(t, "PAGE_DOWN") ? (s = c(e, "add", 1, "month"), a.preventDefault()) : m(t, "PAGE_UP") && (s = c(e, "subtract", 1, "month"), a.preventDefault()), s && U(s);
+  }, R = (e) => {
+    W(e);
+  }, U = (e) => {
+    E(e), e.isBefore(n, "month") ? (e = n.clone().subtract(1, "month"), T(e, M.DAYS)) : e.isAfter(n, "month") && (e = n.clone().add(1, "month"), T(e, M.DAYS));
+  };
+  return /* @__PURE__ */ L("table", { className: o.calendarViewDays, role: "grid", "aria-labelledby": V, children: [
+    B(),
+    g()
+  ] });
+};
+export {
+  ye as CalendarViewDays
+};
+//# sourceMappingURL=CalendarViewDays.js.map

package/components/Calendar/components/CalendarViewItem.js

@@ -0,0 +1,11 @@
+import "react/jsx-runtime";
+import "../../../chunks/vendor-9KVE23Ri.js";
+import "react";
+import "../enums.js";
+import "../CalendarViewContext.js";
+import "../../../utils/keyboard.js";
+import { C } from "../../../chunks/CalendarViewItem-Cs4qo2T0.js";
+export {
+  C as CalendarViewItem
+};
+//# sourceMappingURL=CalendarViewItem.js.map

package/components/Calendar/components/CalendarViewMonths.js

@@ -0,0 +1,64 @@
+import { jsx as f } from "react/jsx-runtime";
+import { useContext as S, useCallback as O, useState as F, useEffect as G } from "react";
+import { h } from "../../../chunks/vendor-9KVE23Ri.js";
+import { CalendarContext as H } from "../CalendarContext.js";
+import { CalendarViewContext as K } from "../CalendarViewContext.js";
+import { isDateOutOfRange as R } from "../utils.js";
+import { s as k, C as B } from "../../../chunks/CalendarViewItem-Cs4qo2T0.js";
+import { isKey as l } from "../../../utils/keyboard.js";
+import { ECalendarPickType as U, ECalendarViewMode as u } from "../enums.js";
+const Z = ({ pickedDate: r, monthHtmlAttributes: T = {} }) => {
+  const { pickType: w, periodId: g, limitRange: m, viewDate: o, onDateSelect: A, onPageChange: D, onViewChange: P } = S(H), { viewItemFocusedRef: y } = S(K), x = h.monthsShort(), b = O(
+    (e) => R(e, m, "month"),
+    [m]
+  ), d = O(() => {
+    if (r && r.isSame(o, "year"))
+      return r;
+    {
+      const e = o.clone().startOf("year");
+      for (let t = 0; t < 12; t++)
+        if (e.add(t, "month"), !b(e))
+          return e;
+    }
+  }, [r, o, b]), [p, C] = F(d());
+  G(() => {
+    y.current || C(d());
+  }, [o, y, d]);
+  const E = () => /* @__PURE__ */ f("tbody", { children: [0, 1, 2, 3].map((e) => /* @__PURE__ */ f("tr", { children: [0, 1, 2].map((t) => I(e, t)) }, `calendar-view-months-row-${e}`)) }), I = (e, t) => {
+    const n = e * 3 + t, a = o.clone().startOf("month").month(n), i = V(a), c = b(a), v = !c && W(a);
+    return /* @__PURE__ */ f(
+      B,
+      {
+        ...T,
+        date: a,
+        unit: "month",
+        active: i,
+        disabled: c,
+        tabbable: v,
+        onKeyDown: _(a),
+        onDateSelect: M,
+        children: x[n]
+      },
+      `calendar-table-data-${t}`
+    );
+  }, V = (e) => r == null ? !1 : r.isSame(e, "month"), W = (e) => p ? e.isSame(p, "month") : !1, _ = (e) => (t) => {
+    const n = t.code || t.keyCode;
+    let a;
+    l(n, "ARROW_RIGHT") ? (a = s(e, "add", 1, "month"), t.preventDefault()) : l(n, "ARROW_LEFT") ? (a = s(e, "subtract", 1, "month"), t.preventDefault()) : l(n, "ARROW_DOWN") ? (a = s(e, "add", 3, "month"), t.preventDefault()) : l(n, "ARROW_UP") ? (a = s(e, "subtract", 3, "month"), t.preventDefault()) : l(n, "PAGE_DOWN") ? (a = s(e, "add", 1, "year"), t.preventDefault()) : l(n, "PAGE_UP") && (a = s(e, "subtract", 1, "year"), t.preventDefault()), a && N(a);
+  }, s = (e, t, n, a) => {
+    const i = e.clone(), c = {
+      add: h.fn.add.bind(i),
+      subtract: h.fn.subtract.bind(i)
+    }[t];
+    return c(n, a), R(i, m, "month") ? e : i;
+  }, M = (e) => {
+    w === U.monthYearPick ? A(e) : P(e, u.DAYS);
+  }, N = (e) => {
+    C(e), e.isBefore(o, "year") ? (e = o.clone().subtract(1, "year"), D(e, u.MONTHS)) : e.isAfter(o, "year") && (e = o.clone().add(1, "year"), D(e, u.MONTHS));
+  };
+  return /* @__PURE__ */ f("table", { className: k.calendarViewMonths, role: "grid", "aria-labelledby": g, children: E() });
+};
+export {
+  Z as CalendarViewMonths
+};
+//# sourceMappingURL=CalendarViewMonths.js.map

package/components/Calendar/components/CalendarViewYears.js

@@ -0,0 +1,64 @@
+import { jsx as f } from "react/jsx-runtime";
+import { useContext as R, useCallback as C, useState as v, useEffect as F } from "react";
+import { h as w } from "../../../chunks/vendor-9KVE23Ri.js";
+import { CalendarContext as N } from "../CalendarContext.js";
+import { CalendarViewContext as G } from "../CalendarViewContext.js";
+import { isDateOutOfRange as O } from "../utils.js";
+import { s as K, C as H } from "../../../chunks/CalendarViewItem-Cs4qo2T0.js";
+import { isKey as i } from "../../../utils/keyboard.js";
+import { ECalendarViewMode as y } from "../enums.js";
+const Q = ({ pickedDate: s, yearHtmlAttributes: S = {} }) => {
+  const { periodId: g, limitRange: d, viewDate: n, onPageChange: m, onViewChange: A } = R(N), { viewItemFocusedRef: D } = R(G), T = n.year(), b = C(
+    (e) => O(e, d, "year"),
+    [d]
+  ), u = C(() => {
+    if (s && s.isSame(n, "year"))
+      return s;
+    {
+      const e = n.clone().subtract(5, "year");
+      for (let a = 0; a < 12; a++)
+        if (e.add(a, "month"), !b(e))
+          return e;
+    }
+  }, [s, n, b]), [h, p] = v(u());
+  F(() => {
+    D.current || p(u());
+  }, [n, D, u]);
+  const E = () => /* @__PURE__ */ f("tbody", { children: [0, 1, 2, 3].map((e) => /* @__PURE__ */ f("tr", { children: [0, 1, 2].map((a) => x(e, a)) }, `calendar-view-years-row-${e}`)) }), x = (e, a) => {
+    const t = T + e * 3 + a - 5, r = n.clone().startOf("year").year(t), l = I(r), c = b(r), Y = !c && V(r);
+    return /* @__PURE__ */ f(
+      H,
+      {
+        ...S,
+        date: r,
+        unit: "year",
+        active: l,
+        disabled: c,
+        tabbable: Y,
+        onKeyDown: W(r),
+        onDateSelect: _,
+        children: t
+      },
+      `calendar-table-data-${a}`
+    );
+  }, I = (e) => s == null ? !1 : s.isSame(e, "year"), V = (e) => h ? e.isSame(h, "year") : !1, W = (e) => (a) => {
+    const t = a.code || a.keyCode;
+    let r;
+    i(t, "ARROW_RIGHT") ? (r = o(e, "add", 1, "year"), a.preventDefault()) : i(t, "ARROW_LEFT") ? (r = o(e, "subtract", 1, "year"), a.preventDefault()) : i(t, "ARROW_DOWN") ? (r = o(e, "add", 3, "year"), a.preventDefault()) : i(t, "ARROW_UP") ? (r = o(e, "subtract", 3, "year"), a.preventDefault()) : i(t, "PAGE_DOWN") ? (r = o(e, "add", 12, "year"), a.preventDefault()) : i(t, "PAGE_UP") && (r = o(e, "subtract", 12, "year"), a.preventDefault()), r && P(r);
+  }, o = (e, a, t, r) => {
+    const l = e.clone(), c = {
+      add: w.fn.add.bind(l),
+      subtract: w.fn.subtract.bind(l)
+    }[a];
+    return c(t, r), O(l, d, "year") ? e : l;
+  }, _ = (e) => {
+    A(e, y.MONTHS);
+  }, P = (e) => {
+    p(e), e.year() + 5 < n.year() ? (e = n.clone().subtract(12, "years"), m(e, y.YEARS)) : e.year() - 6 > n.year() && (e = n.clone().add(12, "years"), m(e, y.YEARS));
+  };
+  return /* @__PURE__ */ f("table", { className: K.calendarViewYears, role: "grid", "aria-labelledby": g, children: E() });
+};
+export {
+  Q as CalendarViewYears
+};
+//# sourceMappingURL=CalendarViewYears.js.map

package/components/Calendar/enums.js

@@ -0,0 +1,7 @@
+var I = /* @__PURE__ */ ((A) => (A[A.datePick = 0] = "datePick", A[A.monthYearPick = 1] = "monthYearPick", A))(I || {}), N = /* @__PURE__ */ ((A) => (A.DAYS = "days", A.MONTHS = "months", A.YEARS = "years", A))(N || {}), S = /* @__PURE__ */ ((A) => (A[A.BASIC = 0] = "BASIC", A[A.STANDARD = 1] = "STANDARD", A[A.ATTENTION = 2] = "ATTENTION", A[A.CRITICAL = 3] = "CRITICAL", A))(S || {});
+export {
+  S as ECalendarDateMarkType,
+  I as ECalendarPickType,
+  N as ECalendarViewMode
+};
+//# sourceMappingURL=enums.js.map