mimir-ui-kit 1.34.2 → 1.34.4-t

package/dist/components/DatePicker/DatePickerModal.js

@@ -1,187 +1,151 @@
-import { jsx, Fragment, jsxs } from "react/jsx-runtime";
-import { useRef, useState, useEffect } from "react";
-import { week } from "./constants.js";
-import { c as cls } from "../../styles.module-Ugsf0AOb.js";
-import { Icon } from "../../icons/Icon.js";
-import { formating } from "../../utils/index.js";
-import { Button } from "../Button/Button.js";
-import { parseDate } from "../../utils/formating/Date.js";
-function DatePickerModal({
-  date,
-  onChangeValue,
-  setActive,
-  before,
-  onType
+import { jsx as a, Fragment as _, jsxs as u } from "react/jsx-runtime";
+import { useRef as O, useState as q, useEffect as G } from "react";
+import { week as J } from "./constants.js";
+import { c as o } from "../../styles.module-CaPkyXYQ.js";
+import { Icon as K } from "../../icons/Icon.js";
+import { formating as i } from "../../utils/index.js";
+import { Button as H } from "../Button/Button.js";
+import { parseDate as j } from "../../utils/formating/Date.js";
+function st({
+  date: l,
+  onChangeValue: E,
+  setActive: F,
+  before: D,
+  onType: d
 }) {
-  var _a;
-  const field = useRef(null);
-  date = isNaN(new Date(date).getTime()) ? /* @__PURE__ */ new Date() : date;
-  const _current = parseDate(date);
-  const _selecte = parseDate(date);
-  const current = {
-    y: _current.getFullYear(),
-    d: _current.getDate(),
-    m: _current.getMonth() + 1
-  };
-  const selecte = {
-    y: _selecte.getFullYear(),
-    d: _selecte.getDate(),
-    m: _selecte.getMonth() + 1
-  };
-  const countWorkDays = 4;
-  const [month, setMonth] = useState({ y: selecte.y, m: selecte.m });
-  const blockWidth = 368;
-  useEffect(() => {
-    var _a2, _b, _c, _d;
-    const windowHeight = window.innerHeight;
-    const windowWidth = window.innerWidth;
-    if (field.current !== null) {
-      const inputWidth = ((_b = (_a2 = field == null ? void 0 : field.current) == null ? void 0 : _a2.parentElement) == null ? void 0 : _b.offsetWidth) || 0;
-      const inputHeight = (_d = (_c = field == null ? void 0 : field.current) == null ? void 0 : _c.parentElement) == null ? void 0 : _d.offsetHeight;
-      const inputPosition = field.current.getBoundingClientRect();
-      const calendarSize = field.current.offsetHeight;
-      if (windowHeight < inputPosition.y + calendarSize) {
-        field.current.style.top = -calendarSize + "px";
-      } else {
-        field.current.style.top = inputHeight + "px";
-      }
-      if (windowWidth < inputPosition.x + blockWidth) {
-        field.current.style.left = inputWidth - blockWidth + "px";
-      }
-      field.current.style.opacity = "1";
-    }
-  }, [month]);
-  const countPrevDays = (e) => {
-    let dayOfWeek = e.getDay();
-    if (dayOfWeek === 0) dayOfWeek = 7;
-    return dayOfWeek - 1;
-  };
-  const currentMonthIndex = month.m - 1;
-  const currentMonthFull = new Date(month.y, currentMonthIndex);
-  const days = [];
-  const prevDays = () => {
-    const prevMonth = new Date(currentMonthFull);
-    prevMonth.setDate(prevMonth.getDate() - 1);
-    const lastDayPrevMohth = prevMonth.getDate();
-    const prevList = [];
-    for (let i = 0; i < countPrevDays(currentMonthFull); i++) {
-      prevList.push(lastDayPrevMohth - i);
-    }
-    prevList.reverse();
-    return prevList;
-  };
-  const prevDaysArray = prevDays();
-  while (currentMonthFull.getMonth() === currentMonthIndex) {
-    days.push(currentMonthFull.getDate());
-    currentMonthFull.setDate(currentMonthFull.getDate() + 1);
-  }
-  const nextDays = () => {
-    const totalViewDays = 42;
-    const daysCount = totalViewDays - (prevDaysArray.length + days.length);
-    const nextList = [];
-    for (let i = 1; i <= daysCount; i++) {
-      nextList.push(i);
+  var k;
+  const r = O(null);
+  l = isNaN(new Date(l).getTime()) ? /* @__PURE__ */ new Date() : l;
+  const h = j(l), p = j(l), f = {
+    y: h.getFullYear(),
+    d: h.getDate(),
+    m: h.getMonth() + 1
+  }, g = {
+    y: p.getFullYear(),
+    d: p.getDate(),
+    m: p.getMonth() + 1
+  }, I = 4, [n, w] = q({ y: g.y, m: g.m }), v = 368;
+  G(() => {
+    var c, s, M, W;
+    const t = window.innerHeight, e = window.innerWidth;
+    if (r.current !== null) {
+      const Y = ((s = (c = r == null ? void 0 : r.current) == null ? void 0 : c.parentElement) == null ? void 0 : s.offsetWidth) || 0, B = ((W = (M = r == null ? void 0 : r.current) == null ? void 0 : M.parentElement) == null ? void 0 : W.offsetHeight) || 0, C = r.current.getBoundingClientRect(), A = r.current.offsetHeight;
+      t < C.y + A + B ? r.current.style.top = -A + "px" : r.current.style.top = B + "px", e < C.x + v && (r.current.style.left = Y - v + "px"), r.current.style.opacity = "1";
     }
-    return nextList;
-  };
-  const nextDaysArray = nextDays();
-  const update = (m, y) => {
-    y = m > 12 ? y + 1 : m < 1 ? y - 1 : y;
-    m = m > 12 ? 1 : m < 1 ? 12 : m;
-    return { y, m };
-  };
-  const onExit = () => {
-    setActive(false);
-  };
-  const next = () => {
-    setMonth(update(month.m + 1, month.y));
-  };
-  const prev = () => {
-    setMonth(update(month.m - 1, month.y));
-  };
-  const isBefore = (activeDate) => {
-    if (before) {
-      const beforeDate = before.getTime();
-      if (beforeDate > activeDate) return true;
-    }
-    return false;
-  };
-  const send = (searchDate) => {
-    if (isBefore(
+  }, [n]);
+  const P = (t) => {
+    let e = t.getDay();
+    return e === 0 && (e = 7), e - 1;
+  }, N = n.m - 1, m = new Date(n.y, N), y = [], x = (() => {
+    const t = new Date(m);
+    t.setDate(t.getDate() - 1);
+    const e = t.getDate(), c = [];
+    for (let s = 0; s < P(m); s++)
+      c.push(e - s);
+    return c.reverse(), c;
+  })();
+  for (; m.getMonth() === N; )
+    y.push(m.getDate()), m.setDate(m.getDate() + 1);
+  const z = (() => {
+    const e = 42 - (x.length + y.length), c = [];
+    for (let s = 1; s <= e; s++)
+      c.push(s);
+    return c;
+  })(), b = (t, e) => (e = t > 12 ? e + 1 : t < 1 ? e - 1 : e, t = t > 12 ? 1 : t < 1 ? 12 : t, { y: e, m: t }), L = () => {
+    F(!1);
+  }, R = () => {
+    w(b(n.m + 1, n.y));
+  }, S = () => {
+    w(b(n.m - 1, n.y));
+  }, $ = (t) => !!(D && D.getTime() > t), V = (t) => {
+    $(
       (/* @__PURE__ */ new Date(
-        `${month.y}-${formating.Number(2, month.m)}-${formating.Number(2, searchDate)}`
+        `${n.y}-${i.Number(2, n.m)}-${i.Number(2, t)}`
       )).getTime()
-    ))
-      return;
-    onChangeValue(
+    ) || (E(
       /* @__PURE__ */ new Date(
-        `${month.y}-${formating.Number(2, month.m)}-${formating.Number(2, searchDate)}`
+        `${n.y}-${i.Number(2, n.m)}-${i.Number(2, t)}`
       )
-    );
-    onExit();
+    ), L());
   };
-  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", { className: [cls["calendar-block"]].join(" "), ref: field, children: [
-    /* @__PURE__ */ jsxs("div", { className: cls["h"], children: [
-      /* @__PURE__ */ jsx(
-        Button,
-        {
-          isIconButton: true,
-          iconName: "DropdownArrowLeft16px",
-          onClick: prev,
-          variant: "secondary-gray",
-          size: "l"
-        }
-      ),
-      /* @__PURE__ */ jsxs("div", { className: cls["d"], onClick: () => onType == null ? void 0 : onType("months"), children: [
-        (_a = formating.Month(month.m)) == null ? void 0 : _a.name,
-        "’",
-        month.y.toString().slice(-2),
-        /* @__PURE__ */ jsx(Icon, { iconName: "DropdownArrowBottom16px" })
-      ] }),
-      /* @__PURE__ */ jsx(
-        Button,
-        {
-          isIconButton: true,
-          iconName: "DropdownArrowRight16px",
-          onClick: next,
-          variant: "secondary-gray",
-          size: "l"
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs("div", { className: cls["b"], children: [
-      week.map((i, s) => /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: `${s > countWorkDays ? [cls["m"], cls["orange"]].join(" ") : cls["m"]}`,
-          children: i
-        },
-        `v${s}`
-      )),
-      prevDaysArray.map((el, key) => /* @__PURE__ */ jsx("div", { className: cls["m"], children: el }, key)),
-      days.map((i, s) => /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: isBefore(
-            (/* @__PURE__ */ new Date(
-              `${month.y}-${formating.Number(2, month.m)}-${formating.Number(2, i)}`
-            )).getTime()
-          ) ? cls["m"] : cls["a"],
-          children: i !== 0 ? /* @__PURE__ */ jsx(
-            "b",
+  return /* @__PURE__ */ a(_, { children: /* @__PURE__ */ u(
+    "div",
+    {
+      className: [o["calendar-block"]].join(" "),
+      ref: r,
+      "data-testid": "calendar-modal",
+      children: [
+        /* @__PURE__ */ u("div", { className: o.h, children: [
+          /* @__PURE__ */ a(
+            H,
+            {
+              isIconButton: !0,
+              iconName: "DropdownArrowLeft16px",
+              onClick: S,
+              variant: "secondary-gray",
+              size: "l"
+            }
+          ),
+          /* @__PURE__ */ u(
+            "div",
             {
-              className: current.y === month.y && current.m === month.m && current.d === i ? cls["current"] : "",
-              onClick: () => send(i),
-              children: i
+              className: o.d,
+              onClick: () => d == null ? void 0 : d("months"),
+              "data-testid": "month-year-button",
+              children: [
+                (k = i.Month(n.m)) == null ? void 0 : k.name,
+                "’",
+                n.y.toString().slice(-2),
+                /* @__PURE__ */ a(K, { iconName: "DropdownArrowBottom16px" })
+              ]
             }
-          ) : /* @__PURE__ */ jsx("p", {})
-        },
-        s
-      )),
-      nextDaysArray.map((el, key) => /* @__PURE__ */ jsx("div", { className: cls["m"], children: el }, key))
-    ] })
-  ] }) });
+          ),
+          /* @__PURE__ */ a(
+            H,
+            {
+              isIconButton: !0,
+              iconName: "DropdownArrowRight16px",
+              onClick: R,
+              variant: "secondary-gray",
+              size: "l"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ u("div", { className: o.b, children: [
+          J.map((t, e) => /* @__PURE__ */ a(
+            "div",
+            {
+              className: `${e > I ? [o.m, o.orange].join(" ") : o.m}`,
+              children: t
+            },
+            `v${e}`
+          )),
+          x.map((t, e) => /* @__PURE__ */ a("div", { className: o.m, children: t }, e)),
+          y.map((t, e) => /* @__PURE__ */ a(
+            "div",
+            {
+              className: $(
+                (/* @__PURE__ */ new Date(
+                  `${n.y}-${i.Number(2, n.m)}-${i.Number(2, t)}`
+                )).getTime()
+              ) ? o.m : o.a,
+              children: t !== 0 ? /* @__PURE__ */ a(
+                "b",
+                {
+                  className: f.y === n.y && f.m === n.m && f.d === t ? o.current : "",
+                  onClick: () => V(t),
+                  children: t
+                }
+              ) : /* @__PURE__ */ a("p", {})
+            },
+            e
+          )),
+          z.map((t, e) => /* @__PURE__ */ a("div", { className: o.m, children: t }, e))
+        ] })
+      ]
+    }
+  ) });
 }
 export {
-  DatePickerModal
+  st as DatePickerModal
 };

package/dist/components/DatePicker/MonthPickerModal.js

@@ -1,123 +1,102 @@
-import { jsx, Fragment, jsxs } from "react/jsx-runtime";
-import { useRef, useState, useEffect } from "react";
-import { months } from "./constants.js";
-import { c as cls } from "../../styles.module-Ugsf0AOb.js";
-import { Icon } from "../../icons/Icon.js";
-import { formating } from "../../utils/index.js";
-import { Button } from "../Button/Button.js";
-function MonthPickerModal({
-  date,
-  onChangeValue,
-  before,
-  onType
+import { jsx as o, Fragment as j, jsxs as u } from "react/jsx-runtime";
+import { useRef as z, useState as A, useEffect as E } from "react";
+import { months as F } from "./constants.js";
+import { c as i } from "../../styles.module-CaPkyXYQ.js";
+import { Icon as I } from "../../icons/Icon.js";
+import { formating as c } from "../../utils/index.js";
+import { Button as v } from "../Button/Button.js";
+function q({
+  date: d,
+  onChangeValue: $,
+  before: f,
+  onType: s
 }) {
-  const field = useRef(null);
-  const _current = new Date(date);
-  const _selecte = new Date(date);
-  const current = {
-    y: _current.getFullYear(),
-    d: _current.getDate(),
-    m: _current.getMonth() + 1
-  };
-  const selecte = {
-    y: _selecte.getFullYear(),
-    d: _selecte.getDate(),
-    m: _selecte.getMonth() + 1
-  };
-  const [year, setYear] = useState(selecte.y);
-  const blockWidth = 368;
-  useEffect(() => {
-    var _a, _b, _c, _d;
-    const windowHeight = window.innerHeight;
-    const windowWidth = window.innerWidth;
-    if (field.current !== null) {
-      const inputWidth = ((_b = (_a = field == null ? void 0 : field.current) == null ? void 0 : _a.parentElement) == null ? void 0 : _b.offsetWidth) || 0;
-      const inputHeight = (_d = (_c = field == null ? void 0 : field.current) == null ? void 0 : _c.parentElement) == null ? void 0 : _d.offsetHeight;
-      const inputPosition = field.current.getBoundingClientRect();
-      const calendarSize = field.current.offsetHeight;
-      if (windowHeight < inputPosition.y + calendarSize) {
-        field.current.style.top = -calendarSize + "px";
-      } else {
-        field.current.style.top = inputHeight + "px";
-      }
-      if (windowWidth < inputPosition.x + blockWidth) {
-        field.current.style.left = inputWidth - blockWidth + "px";
-      }
-      field.current.style.opacity = "1";
+  const t = z(null), a = new Date(d), m = new Date(d), h = {
+    y: a.getFullYear(),
+    d: a.getDate(),
+    m: a.getMonth() + 1
+  }, l = {
+    y: m.getFullYear(),
+    d: m.getDate(),
+    m: m.getMonth() + 1
+  }, [n, p] = A(l.y), g = 368;
+  E(() => {
+    var N, y, x, D;
+    const e = window.innerHeight, r = window.innerWidth;
+    if (t.current !== null) {
+      const W = ((y = (N = t == null ? void 0 : t.current) == null ? void 0 : N.parentElement) == null ? void 0 : y.offsetWidth) || 0, M = (D = (x = t == null ? void 0 : t.current) == null ? void 0 : x.parentElement) == null ? void 0 : D.offsetHeight, b = t.current.getBoundingClientRect(), k = t.current.offsetHeight;
+      e < b.y + k ? t.current.style.top = -k + "px" : t.current.style.top = M + "px", r < b.x + g && (t.current.style.left = W - g + "px"), t.current.style.opacity = "1";
     }
   }, []);
-  const next = () => {
-    setYear(year + 1);
-  };
-  const prev = () => {
-    setYear(year - 1);
-  };
-  const isBefore = (activeDate) => {
-    if (before) {
-      const beforeDate = before.getTime();
-      if (beforeDate > activeDate) return true;
-    }
-    return false;
-  };
-  const send = (searchDate) => {
-    if (isBefore(
+  const B = () => {
+    p(n + 1);
+  }, C = () => {
+    p(n - 1);
+  }, w = (e) => !!(f && f.getTime() > e), H = (e) => {
+    w(
       (/* @__PURE__ */ new Date(
-        `${year}-${formating.Number(2, searchDate)}-${formating.Number(2, selecte.d)}`
+        `${n}-${c.Number(2, e)}-${c.Number(2, l.d)}`
       )).getTime()
-    ))
-      return;
-    onChangeValue(
+    ) || $(
       /* @__PURE__ */ new Date(
-        `${year}-${formating.Number(2, searchDate)}-${formating.Number(2, selecte.d)}`
+        `${n}-${c.Number(2, e)}-${c.Number(2, l.d)}`
       )
     );
   };
-  return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("div", { className: [cls["calendar-block"]].join(" "), ref: field, children: [
-    /* @__PURE__ */ jsxs("div", { className: cls["h"], children: [
-      /* @__PURE__ */ jsx(
-        Button,
+  return /* @__PURE__ */ o(j, { children: /* @__PURE__ */ u("div", { className: [i["calendar-block"]].join(" "), ref: t, children: [
+    /* @__PURE__ */ u("div", { className: i.h, children: [
+      /* @__PURE__ */ o(
+        v,
         {
-          isIconButton: true,
+          isIconButton: !0,
           iconName: "DropdownArrowLeft16px",
-          onClick: prev,
+          onClick: C,
           variant: "secondary-gray",
           size: "l"
         }
       ),
-      /* @__PURE__ */ jsxs("div", { onClick: () => onType == null ? void 0 : onType("years"), className: cls["d"], children: [
-        year.toString(),
-        /* @__PURE__ */ jsx(Icon, { iconName: "DropdownArrowBottom16px" })
-      ] }),
-      /* @__PURE__ */ jsx(
-        Button,
+      /* @__PURE__ */ u(
+        "div",
+        {
+          onClick: () => s == null ? void 0 : s("years"),
+          className: i.d,
+          "data-testid": "year-button",
+          children: [
+            n.toString(),
+            /* @__PURE__ */ o(I, { iconName: "DropdownArrowBottom16px" })
+          ]
+        }
+      ),
+      /* @__PURE__ */ o(
+        v,
         {
-          isIconButton: true,
+          isIconButton: !0,
           iconName: "DropdownArrowRight16px",
-          onClick: next,
+          onClick: B,
           variant: "secondary-gray",
           size: "l"
         }
       )
     ] }),
-    /* @__PURE__ */ jsx("div", { className: cls["monthGrid"], children: months.map((i, s) => /* @__PURE__ */ jsx(
+    /* @__PURE__ */ o("div", { className: i.monthGrid, "data-testid": "month-picker", children: F.map((e, r) => /* @__PURE__ */ o(
       "div",
       {
-        className: isBefore(
-          (/* @__PURE__ */ new Date(`${year}-${formating.Number(2, s + 1)}`)).getTime()
-        ) ? cls["m"] : cls["a"],
-        children: /* @__PURE__ */ jsx(
+        className: w(
+          (/* @__PURE__ */ new Date(`${n}-${c.Number(2, r + 1)}`)).getTime()
+        ) ? i.m : i.a,
+        children: /* @__PURE__ */ o(
           "b",
           {
-            className: current.y === year && current.m === s + 1 ? cls["current"] : "",
-            onClick: () => send(s + 1),
-            children: i
+            className: h.y === n && h.m === r + 1 ? i.current : "",
+            onClick: () => H(r + 1),
+            children: e
           }
         )
       },
-      s
+      r
     )) })
   ] }) });
 }
 export {
-  MonthPickerModal
+  q as MonthPickerModal
 };