mimir-ui-kit 1.38.36 → 1.38.38

package/dist/components/DatePicker/DatePicker.js

@@ -0,0 +1,166 @@
+import { jsxs as R, jsx as a } from "react/jsx-runtime";
+import { c as h } from "../../index-DIxK0V-G.js";
+import { memo as tt, forwardRef as st, useState as D, useEffect as M } from "react";
+import { MAX_DAY as et, MAX_MONTH as it, DATE_LENGTH as rt } from "./constants.js";
+import { DatePickerModal as ot } from "./DatePickerModal.js";
+import { MonthPickerModal as ct } from "./MonthPickerModal.js";
+import { c as e } from "../../styles.module-BlOA4RBL.js";
+import { formatDatePart as U } from "./utils.js";
+import { YearPickerModal as at } from "./YearPickerModal.js";
+import { useClickOutside as mt } from "../../hooks/useClickOutside/useClickOutside.js";
+import { Icon as X } from "../../icons/Icon.js";
+import { formating as l } from "../../utils/index.js";
+import { I as pt } from "../../Input-DAmc_HxO.js";
+import { EInputStatus as dt, EInputSize as E } from "../Input/constants.js";
+const ft = {
+  days: ot,
+  months: ct,
+  years: at
+}, yt = tt(
+  st(
+    ({
+      size: x,
+      value: i,
+      onChangeValue: t,
+      name: o,
+      before: S,
+      type: p = "days",
+      error: $,
+      onError: d,
+      onBlur: r,
+      validateImmediately: O,
+      variant: F,
+      disabled: _ = !1,
+      editable: k = !1,
+      openOnInput: Y = !0,
+      sendIntermediateValues: G = !1,
+      ...K
+    }, W) => {
+      const [A, m] = D(!1), [g, f] = D(p), [c, I] = D(
+        () => i && !isNaN(new Date(i).getTime()) ? new Date(i) : void 0
+      ), [y, j] = D($), [q, P] = D("");
+      M(() => {
+        j($);
+      }, [$]), M(() => {
+        I(
+          i && !isNaN(new Date(i).getTime()) ? new Date(i) : void 0
+        );
+      }, [i]), M(() => {
+        c && typeof c != "string" && !isNaN(c == null ? void 0 : c.getTime()) ? P(l.Date(c, "dd/mm/yyyy")) : P("");
+      }, [c]);
+      const H = i && new Date(i).getTime;
+      M(() => {
+        O && (H ? (j(!1), d == null || d({ name: o, active: !1 })) : (j(!0), d == null || d({ name: o, active: !0 })));
+      }, [O, o, H]), mt({
+        isActive: A,
+        setActive: (s) => {
+          m(s), f(p);
+        },
+        className: e["calendar-block"]
+      });
+      const u = () => {
+        !_ && (Y || !k) && m(!0);
+      }, J = (s) => {
+        isNaN(s.getTime()) || (I(s), t == null || t({
+          value: l.Date(s, "yyyy-mm-dd"),
+          name: o
+        })), g === "years" && (p === "years" ? (m(!1), f(p)) : f("months")), g === "months" && (p === "months" ? (m(!1), f(p)) : f("days")), I(s), t == null || t({
+          value: l.Date(s, "yyyy-mm-dd"),
+          name: o
+        }), r == null || r(l.Date(s, "yyyy-mm-dd"));
+      }, Q = (s) => {
+        if (k) {
+          const N = s.target.value.replace(/[^\d]/g, "");
+          if (N.length === 0)
+            P(""), t == null || t({ value: "", name: o }), r == null || r("");
+          else {
+            const [n, T, w] = [
+              U(N.substring(0, 2), et),
+              U(N.substring(2, 4), it),
+              N.substring(4, 8)
+            ], L = [n, T, w].filter(Boolean).join("/");
+            if (P(L), G) {
+              const b = w ? `${w}-${T || "00"}-${n || "00"}` : [n, T, w].filter(Boolean).join("-");
+              t == null || t({
+                value: b,
+                name: o
+              });
+            }
+            if (L.length === rt) {
+              const b = parseInt(w), v = /* @__PURE__ */ new Date(
+                `${b}-${T.padStart(2, "0")}-${n.padStart(2, "0")}`
+              );
+              isNaN(v.getTime()) || (I(v), t == null || t({
+                value: l.Date(v, "yyyy-mm-dd"),
+                name: o
+              }), r == null || r(l.Date(v, "yyyy-mm-dd")));
+            }
+          }
+        }
+      }, Z = h(e.wrapper, A && e.active), z = h(e.input, e.inputBorderControl), C = {
+        onChangeValue: J,
+        date: c || /* @__PURE__ */ new Date(),
+        before: typeof S == "string" ? new Date(S) : S,
+        onChangeType: f,
+        setIsActive: m
+      }, B = ft[g], V = ({ isActive: s }) => /* @__PURE__ */ a("button", { onClick: (n) => {
+        n.stopPropagation(), _ || m(!s);
+      }, className: e["icon-button"], children: s ? /* @__PURE__ */ a(
+        X,
+        {
+          iconName: x === E.S ? "DropdownArrowUp16px" : "DropdownArrowUp24px"
+        }
+      ) : /* @__PURE__ */ a(
+        X,
+        {
+          iconName: x === E.S ? "DropdownArrowBottom16px" : "DropdownArrowDown24px"
+        }
+      ) });
+      return /* @__PURE__ */ R("div", { className: e["input-field-group-datePicker"], children: [
+        /* @__PURE__ */ R("div", { className: Z, "data-disabled": _, children: [
+          /* @__PURE__ */ a(
+            "div",
+            {
+              role: "button",
+              "data-error": !!y,
+              className: h(e["date-wrapper"], {
+                [e.editable]: k
+              }),
+              onClick: u,
+              children: /* @__PURE__ */ a(
+                pt,
+                {
+                  ref: W,
+                  className: z,
+                  wrapperClassName: e["input-wrapper"],
+                  size: x,
+                  type: "text",
+                  variant: F,
+                  status: y ? dt.Error : void 0,
+                  value: q,
+                  onChange: Q,
+                  rightAddon: {
+                    addonType: "react-node",
+                    addonContent: /* @__PURE__ */ a(V, { isActive: A })
+                  },
+                  rightSlotClassName: e["right-slot"],
+                  onFocus: () => {
+                    Y && !k && m(!0);
+                  },
+                  "data-error": !!y,
+                  ...K
+                }
+              )
+            }
+          ),
+          A && /* @__PURE__ */ a(B, { ...C })
+        ] }),
+        y && typeof y == "string" && /* @__PURE__ */ a("div", { className: e.textError, children: y })
+      ] });
+    }
+  )
+);
+yt.displayName = "DatePicker";
+export {
+  yt as DatePicker
+};

package/dist/components/DatePicker/DatePickerModal.d.ts

@@ -0,0 +1,9 @@
+type TProps = {
+    date: Date;
+    before?: Date;
+    onChangeValue: (date: Date) => void;
+    setIsActive: (isActive: boolean) => void;
+    onChangeType?: (s: 'days' | 'months' | 'years') => void;
+};
+export declare const DatePickerModal: ({ date, onChangeValue, setIsActive, before, onChangeType }: TProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/DatePicker/DatePickerModal.js

@@ -0,0 +1,147 @@
+import { jsxs as l, jsx as a } from "react/jsx-runtime";
+import { c as x } from "../../index-DIxK0V-G.js";
+import { useState as O } from "react";
+import { week as Y, COUNT_WORK_DAYS as j } from "./constants.js";
+import { useDatePickerPosition as z } from "./hooks.js";
+import { c as o } from "../../styles.module-BlOA4RBL.js";
+import { getUpdateDate as M } from "./utils.js";
+import { Icon as G } from "../../icons/Icon.js";
+import { formating as s } from "../../utils/index.js";
+import { Button as $ } from "../Button/Button.js";
+import { parseDate as k } from "../../utils/formating/Date.js";
+const tt = ({
+  date: i,
+  onChangeValue: P,
+  setIsActive: A,
+  before: h,
+  onChangeType: u
+}) => {
+  var b;
+  i = isNaN(new Date(i).getTime()) ? /* @__PURE__ */ new Date() : i;
+  const d = k(i), D = k(i), y = {
+    y: d.getFullYear(),
+    d: d.getDate(),
+    m: d.getMonth() + 1
+  }, f = {
+    y: D.getFullYear(),
+    d: D.getDate(),
+    m: D.getMonth() + 1
+  }, [e, g] = O({ y: f.y, m: f.m }), B = z([e]), I = (t) => {
+    let r = t.getDay();
+    return r === 0 && (r = 7), r - 1;
+  }, N = e.m - 1, m = new Date(e.y, N), p = [], v = (() => {
+    const t = new Date(m);
+    t.setDate(t.getDate() - 1);
+    const r = t.getDate(), c = [];
+    for (let n = 0; n < I(m); n++)
+      c.push(r - n);
+    return c.reverse(), c;
+  })();
+  for (; m.getMonth() === N; )
+    p.push(m.getDate()), m.setDate(m.getDate() + 1);
+  const S = (() => {
+    const r = 42 - (v.length + p.length), c = [];
+    for (let n = 1; n <= r; n++)
+      c.push(n);
+    return c;
+  })(), _ = () => {
+    A(!1);
+  }, C = () => {
+    g(M(e.m + 1, e.y));
+  }, F = () => {
+    g(M(e.m - 1, e.y));
+  }, w = (t) => !!(h && h.getTime() > t), L = (t) => {
+    w(
+      (/* @__PURE__ */ new Date(
+        `${e.y}-${s.Number(2, e.m)}-${s.Number(2, t)}`
+      )).getTime()
+    ) || (P(
+      /* @__PURE__ */ new Date(
+        `${e.y}-${s.Number(2, e.m)}-${s.Number(2, t)}`
+      )
+    ), _());
+  };
+  return /* @__PURE__ */ l(
+    "div",
+    {
+      className: o["calendar-block"],
+      ref: B,
+      "data-testid": "calendar-modal",
+      children: [
+        /* @__PURE__ */ l("div", { className: o.h, children: [
+          /* @__PURE__ */ a(
+            $,
+            {
+              isIconButton: !0,
+              iconName: "DropdownArrowLeft16px",
+              onClick: F,
+              variant: "secondary-gray",
+              size: "l"
+            }
+          ),
+          /* @__PURE__ */ l(
+            "button",
+            {
+              type: "button",
+              className: o.d,
+              onClick: () => u == null ? void 0 : u("months"),
+              "data-testid": "month-year-button",
+              children: [
+                (b = s.Month(e.m)) == null ? void 0 : b.name,
+                "’",
+                e.y.toString().slice(-2),
+                /* @__PURE__ */ a(G, { iconName: "DropdownArrowBottom16px" })
+              ]
+            }
+          ),
+          /* @__PURE__ */ a(
+            $,
+            {
+              isIconButton: !0,
+              iconName: "DropdownArrowRight16px",
+              onClick: C,
+              variant: "secondary-gray",
+              size: "l"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ l("div", { className: o.b, children: [
+          Y.map((t, r) => /* @__PURE__ */ a(
+            "div",
+            {
+              className: x(o.m, {
+                [o.orange]: r > j
+              }),
+              children: t
+            },
+            `v${r}`
+          )),
+          v.map((t, r) => /* @__PURE__ */ a("div", { className: o.m, children: t }, r)),
+          p.map((t, r) => /* @__PURE__ */ a(
+            "button",
+            {
+              type: "button",
+              onClick: () => L(t),
+              className: x(
+                w(
+                  (/* @__PURE__ */ new Date(
+                    `${e.y}-${s.Number(2, e.m)}-${s.Number(2, t)}`
+                  )).getTime()
+                ) ? o.m : o.a,
+                {
+                  [o.current]: y.y === e.y && y.m === e.m && y.d === t
+                }
+              ),
+              children: t !== 0 && t
+            },
+            r
+          )),
+          S.map((t, r) => /* @__PURE__ */ a("div", { className: o.m, children: t }, r))
+        ] })
+      ]
+    }
+  );
+};
+export {
+  tt as DatePickerModal
+};

package/dist/components/DatePicker/MonthPickerModal.d.ts

@@ -0,0 +1,8 @@
+type TProps = {
+    date: Date;
+    before?: Date;
+    onChangeValue: (date: Date) => void;
+    onChangeType?: (type: 'years') => void;
+};
+export declare const MonthPickerModal: ({ date, onChangeValue, before, onChangeType }: TProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/DatePicker/MonthPickerModal.js

@@ -0,0 +1,94 @@
+import { jsxs as l, jsx as n } from "react/jsx-runtime";
+import { c as k } from "../../index-DIxK0V-G.js";
+import { useState as $ } from "react";
+import { months as x } from "./constants.js";
+import { useDatePickerPosition as v } from "./hooks.js";
+import { c as e } from "../../styles.module-BlOA4RBL.js";
+import { Icon as B } from "../../icons/Icon.js";
+import { formating as a } from "../../utils/index.js";
+import { Button as b } from "../Button/Button.js";
+const F = ({
+  date: d,
+  onChangeValue: D,
+  before: u,
+  onChangeType: i
+}) => {
+  const h = v(), c = new Date(d), m = new Date(d), f = {
+    y: c.getFullYear(),
+    d: c.getDate(),
+    m: c.getMonth() + 1
+  }, s = {
+    y: m.getFullYear(),
+    d: m.getDate(),
+    m: m.getMonth() + 1
+  }, [t, p] = $(s.y), w = () => {
+    p(t + 1);
+  }, g = () => {
+    p(t - 1);
+  }, N = (r) => !!(u && u.getTime() > r), y = (r) => {
+    N(
+      (/* @__PURE__ */ new Date(
+        `${t}-${a.Number(2, r)}-${a.Number(2, s.d)}`
+      )).getTime()
+    ) || D(
+      /* @__PURE__ */ new Date(
+        `${t}-${a.Number(2, r)}-${a.Number(2, s.d)}`
+      )
+    );
+  };
+  return /* @__PURE__ */ l("div", { className: e["calendar-block"], ref: h, children: [
+    /* @__PURE__ */ l("div", { className: e.h, children: [
+      /* @__PURE__ */ n(
+        b,
+        {
+          isIconButton: !0,
+          iconName: "DropdownArrowLeft16px",
+          onClick: g,
+          variant: "secondary-gray",
+          size: "l"
+        }
+      ),
+      /* @__PURE__ */ l(
+        "button",
+        {
+          type: "button",
+          onClick: () => i == null ? void 0 : i("years"),
+          className: e.d,
+          "data-testid": "year-button",
+          children: [
+            t.toString(),
+            /* @__PURE__ */ n(B, { iconName: "DropdownArrowBottom16px" })
+          ]
+        }
+      ),
+      /* @__PURE__ */ n(
+        b,
+        {
+          isIconButton: !0,
+          iconName: "DropdownArrowRight16px",
+          onClick: w,
+          variant: "secondary-gray",
+          size: "l"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ n("div", { className: e.monthGrid, "data-testid": "month-picker", children: x.map((r, o) => /* @__PURE__ */ n(
+      "button",
+      {
+        type: "button",
+        onClick: () => y(o + 1),
+        className: k(
+          N(
+            (/* @__PURE__ */ new Date(`${t}-${a.Number(2, o + 1)}`)).getTime()
+          ) ? e.m : e.a,
+          { [e.current]: f.y === t && f.m === o + 1 }
+        ),
+        children: r
+      },
+      o
+    )) })
+  ] });
+};
+export {
+  F as MonthPickerModal
+};

package/dist/components/DatePicker/YearPickerModal.d.ts

@@ -0,0 +1,8 @@
+type TProps = {
+    date: Date;
+    before?: Date;
+    onChangeValue: (date: Date) => void;
+    onChangeType?: (type: 'years') => void;
+};
+export declare const YearPickerModal: ({ date, onChangeValue, before, onChangeType }: TProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/DatePicker/YearPickerModal.js

@@ -0,0 +1,89 @@
+import { jsxs as p, jsx as o } from "react/jsx-runtime";
+import { c as v } from "../../index-DIxK0V-G.js";
+import { useState as x } from "react";
+import { useDatePickerPosition as Y } from "./hooks.js";
+import { c as t } from "../../styles.module-BlOA4RBL.js";
+import { formating as n } from "../../utils/index.js";
+import { Button as y } from "../Button/Button.js";
+const F = ({
+  date: m,
+  onChangeValue: b,
+  before: l,
+  onChangeType: a
+}) => {
+  const D = Y(), s = new Date(m), c = new Date(m), u = {
+    y: s.getFullYear(),
+    d: s.getDate(),
+    m: s.getMonth() + 1
+  }, r = {
+    y: c.getFullYear(),
+    d: c.getDate(),
+    m: c.getMonth() + 1
+  }, [i, d] = x(r.y), g = i - 7, k = Array.from(Array(15).keys()).map((e) => e + g), w = () => {
+    d(i + 15);
+  }, $ = () => {
+    d(i - 15);
+  }, f = (e) => !!(l && l.getTime() > e), h = (e) => {
+    f(
+      (/* @__PURE__ */ new Date(
+        `${e}-${n.Number(2, r.m)}-${n.Number(2, r.d)}`
+      )).getTime()
+    ) || b(
+      /* @__PURE__ */ new Date(
+        `${e}-${n.Number(2, r.m)}-${n.Number(2, r.d)}`
+      )
+    );
+  };
+  return /* @__PURE__ */ p("div", { className: t["calendar-block"], ref: D, children: [
+    /* @__PURE__ */ p("div", { className: t.h, children: [
+      /* @__PURE__ */ o(
+        y,
+        {
+          isIconButton: !0,
+          iconName: "DropdownArrowLeft16px",
+          onClick: $,
+          variant: "secondary-gray",
+          size: "l"
+        }
+      ),
+      /* @__PURE__ */ o(
+        "button",
+        {
+          type: "button",
+          onClick: () => a == null ? void 0 : a("years"),
+          className: t.d
+        }
+      ),
+      /* @__PURE__ */ o(
+        y,
+        {
+          isIconButton: !0,
+          iconName: "DropdownArrowRight16px",
+          onClick: w,
+          variant: "secondary-gray",
+          size: "l"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ o("div", { className: t.monthGrid, "data-testid": "year-picker", children: k.map((e, N) => /* @__PURE__ */ o(
+      "button",
+      {
+        type: "button",
+        onClick: () => h(e),
+        className: v(
+          f(
+            (/* @__PURE__ */ new Date(`${e}-${n.Number(2, u.m)}`)).getTime()
+          ) ? t.m : t.a,
+          {
+            [t.current]: u.y === e
+          }
+        ),
+        children: e
+      },
+      N
+    )) })
+  ] });
+};
+export {
+  F as YearPickerModal
+};

package/dist/components/DatePicker/constants.d.ts

@@ -0,0 +1,17 @@
+export declare enum EDatePickerBeforeDate {
+    CurrentDate1 = "2024-08-01",
+    CurrentDate2 = "2024-07-01",
+    CurrentDate3 = "1995-07-11"
+}
+export declare const week: string[];
+export declare const months: string[];
+export declare enum EDatePickerValue {
+    CurrentDate1 = "",
+    CurrentDate = "20240510",
+    CurrentDate3 = "2024-09-10"
+}
+export declare const BLOCK_WIDTH = 368;
+export declare const COUNT_WORK_DAYS = 4;
+export declare const MAX_DAY = 31;
+export declare const MAX_MONTH = 12;
+export declare const DATE_LENGTH = 10;

package/dist/components/DatePicker/constants.js

@@ -0,0 +1,28 @@
+var n = /* @__PURE__ */ ((t) => (t.CurrentDate1 = "2024-08-01", t.CurrentDate2 = "2024-07-01", t.CurrentDate3 = "1995-07-11", t))(n || {});
+const s = ["пн", "вт", "ср", "чт", "пт", "сб", "вс"], C = [
+  "Январь",
+  "Февраль",
+  "Март",
+  "Апрель",
+  "Май",
+  "Июнь",
+  "Июль",
+  "Август",
+  "Сентябрь",
+  "Октябрь",
+  "Ноябрь",
+  "Декабрь"
+];
+var r = /* @__PURE__ */ ((t) => (t.CurrentDate1 = "", t.CurrentDate = "20240510", t.CurrentDate3 = "2024-09-10", t))(r || {});
+const o = 368, u = 4, _ = 31, A = 12, T = 10;
+export {
+  o as BLOCK_WIDTH,
+  u as COUNT_WORK_DAYS,
+  T as DATE_LENGTH,
+  n as EDatePickerBeforeDate,
+  r as EDatePickerValue,
+  _ as MAX_DAY,
+  A as MAX_MONTH,
+  C as months,
+  s as week
+};

package/dist/components/DatePicker/hooks.d.ts

@@ -0,0 +1,3 @@
+import { DependencyList } from 'react';
+
+export declare const useDatePickerPosition: (deps?: DependencyList) => import('react').RefObject<HTMLDivElement>;

package/dist/components/DatePicker/hooks.js

@@ -0,0 +1,20 @@
+import { useRef as x, useEffect as w } from "react";
+import { BLOCK_WIDTH as r } from "./constants.js";
+const H = (a) => {
+  const t = x(null);
+  return w(() => {
+    var o, c, s, l, u, p;
+    const d = window.innerHeight, h = window.innerWidth;
+    if (t.current !== null) {
+      const y = ((c = (o = t == null ? void 0 : t.current) == null ? void 0 : o.parentElement) == null ? void 0 : c.offsetWidth) ?? 0, f = ((l = (s = t == null ? void 0 : t.current) == null ? void 0 : s.parentElement) == null ? void 0 : l.offsetHeight) ?? 0, n = (p = (u = t == null ? void 0 : t.current) == null ? void 0 : u.parentElement) == null ? void 0 : p.getBoundingClientRect(), i = t.current.offsetHeight;
+      if (h < n.x + r) {
+        const e = y - r;
+        n.x - Math.abs(e) < 0 ? t.current.style.left = (e < 0 ? e / 2 : e) + "px" : t.current.style.left = e + "px";
+      }
+      d < n.y + i + f ? n.y - i > 0 ? t.current.style.top = -i + "px" : (t.current.style.position = "fixed", t.current.style.top = `calc(50vh - ${i / 2}px)`, t.current.style.left = `calc(50vw - ${r / 2}px)`) : t.current.style.top = f + "px", t.current.style.opacity = "1";
+    }
+  }, [a]), t;
+};
+export {
+  H as useDatePickerPosition
+};

package/dist/components/DatePicker/index.d.ts

@@ -0,0 +1,2 @@
+export { DatePicker } from './DatePicker';
+export type { TProps as TDatePickerProps, TDatePickerValue } from './DatePicker';

package/dist/components/DatePicker/index.js

@@ -0,0 +1,4 @@
+import { DatePicker as o } from "./DatePicker.js";
+export {
+  o as DatePicker
+};

package/dist/components/DatePicker/utils.d.ts

@@ -0,0 +1,6 @@
+export declare const formatDatePart: (value: string, max: number) => string;
+export declare const getFullYear: (year: string) => number;
+export declare const getUpdateDate: (m: number, y: number) => {
+    y: number;
+    m: number;
+};

package/dist/components/DatePicker/utils.js

@@ -0,0 +1,9 @@
+const o = (t, r) => parseInt(t) > r ? r.toString() : t, a = (t) => {
+  const r = (/* @__PURE__ */ new Date()).getFullYear(), e = Math.floor(r / 100) * 100, n = parseInt(t) + e;
+  return n > r + 20 ? n - 100 : n;
+}, c = (t, r) => (r = t > 12 ? r + 1 : t < 1 ? r - 1 : r, t = t > 12 ? 1 : t < 1 ? 12 : t, { y: r, m: t });
+export {
+  o as formatDatePart,
+  a as getFullYear,
+  c as getUpdateDate
+};