mimir-ui-kit 1.21.2 → 1.21.4

package/dist/assets/Drawer.css

@@ -1 +1 @@
-._drawer_1y1lk_3{--drawer-width: 808px;--drawer-z-index: 10000;position:fixed;z-index:10000;z-index:var(--drawer-z-index);display:flex;flex-direction:column;width:808px;width:var(--drawer-width);height:100%;overflow:auto;background-color:var(--black-5);transition:all .3s ease;pointer-events:none}._drawer_1y1lk_3::-webkit-scrollbar{width:3px}._drawer_1y1lk_3::-webkit-scrollbar-thumb{background-color:var(--black-80);border-radius:2px}._drawer_1y1lk_3::-webkit-scrollbar-track{background-color:var(--white)}._drawer_1y1lk_3 ._content_1y1lk_27{position:relative;display:flex;flex:1;flex-direction:column;padding:var(--space-m) var(--space-4xl) var(--space-4xl);transition:all .3s ease}@media (max-width: 600px){._drawer_1y1lk_3 ._content_1y1lk_27{--drawer-width: 100%;padding:var(--space-m)}}._drawer_1y1lk_3 ._content_1y1lk_27._is-loading_1y1lk_41{align-items:center;justify-content:center}._drawer_1y1lk_3 ._header_1y1lk_45{display:flex;gap:var(--space-xs);min-height:68px}._drawer_1y1lk_3 ._header_1y1lk_45:not(:last-child){margin-bottom:var(--space-2xl)}._drawer_1y1lk_3 ._header_1y1lk_45._sticky-header_1y1lk_53{position:-webkit-sticky;position:sticky;top:0;left:0;background-color:var(--black-5)}._drawer_1y1lk_3 ._header_1y1lk_45 ._title_1y1lk_59{flex:1;align-self:flex-end;font-weight:var(--font-weight-text-medium);font-size:var(--size-text-xl3);line-height:var(--line-height-text-s1);letter-spacing:.7px}@media (max-width: 600px){._drawer_1y1lk_3 ._header_1y1lk_45 ._title_1y1lk_59{font-size:var(--size-text-xl2);line-height:var(--line-height-text-xs)}}._drawer_1y1lk_3 ._header_1y1lk_45 ._space_1y1lk_73{flex:0 0 var(--button-height-m)}@media (max-width: 600px){._drawer_1y1lk_3 ._header_1y1lk_45{min-height:55px}._drawer_1y1lk_3 ._header_1y1lk_45:not(:last-child){margin-bottom:var(--space-m)}}._drawer_1y1lk_3 ._inner_1y1lk_84{flex:1}._drawer_1y1lk_3 ._button_1y1lk_87{position:absolute;top:var(--space-m);right:var(--space-m)}._drawer_1y1lk_3 ._footer_1y1lk_92{display:block;padding-top:var(--space-4xl)}@media (max-width: 600px){._drawer_1y1lk_3 ._footer_1y1lk_92{padding-top:var(--space-m)}}._drawer_1y1lk_3 ._footer-button_1y1lk_101{display:block;margin-left:auto}._drawer_1y1lk_3._left_1y1lk_105{top:0;left:-100%}._drawer_1y1lk_3._right_1y1lk_109{top:0;right:-100%}._drawer_1y1lk_3._full_1y1lk_113{top:0;right:0;bottom:0;left:0;width:100%;height:100%;max-height:100vh;border-radius:0;transform:scale(.95);opacity:0;transition:transform .3s ease-in-out,opacity .3s ease-in-out}._drawer_1y1lk_3._bottom_1y1lk_123{right:50%;bottom:-100%;left:50%;height:-webkit-max-content;height:-moz-max-content;height:max-content;max-height:calc(100% - var(--space-xs));border-top-left-radius:var(--control-radius);border-top-right-radius:var(--control-radius);transform:translate(-50%)}._drawer_1y1lk_3._bottom_1y1lk_123._full-bottom-height_1y1lk_133{height:calc(100% - var(--space-xs))}._drawer_1y1lk_3._bottom_1y1lk_123._is-loading_1y1lk_41{height:50vh}._drawer_1y1lk_3._opened_1y1lk_139{transition:all .3s ease;pointer-events:auto}._drawer_1y1lk_3._opened_1y1lk_139._left_1y1lk_105{left:0%;transition:left .3s ease}._drawer_1y1lk_3._opened_1y1lk_139._right_1y1lk_109{right:0%;transition:right .3s ease}._drawer_1y1lk_3._opened_1y1lk_139._bottom_1y1lk_123{bottom:0%}._drawer_1y1lk_3._opened_1y1lk_139._full_1y1lk_113{transform:scale(1);opacity:1}._drawer_1y1lk_3._is-closing_1y1lk_158._left_1y1lk_105{left:-100%}._drawer_1y1lk_3._is-closing_1y1lk_158._right_1y1lk_109{right:-100%}._drawer_1y1lk_3._is-closing_1y1lk_158._bottom_1y1lk_123{bottom:-100%}._drawer_1y1lk_3._is-closing_1y1lk_158._full_1y1lk_113{transform:scale(.95);opacity:0}@media (max-width: 1440px){._drawer_1y1lk_3{--drawer-width: 608px}}@media (max-width: 1280px){._drawer_1y1lk_3{--drawer-width: 648px}}@media (max-width: 768px){._drawer_1y1lk_3{--drawer-width: 584px}}@media (max-width: 600px){._drawer_1y1lk_3{--drawer-width: 100%}._drawer_1y1lk_3._bottom_1y1lk_123{--drawer-width: calc(100% - var(--space-xs))}}._overlay_1y1lk_195{--overlay-z-index: 9990;position:fixed;top:0;left:0;z-index:9990;z-index:var(--overlay-z-index);width:100%;height:100%;background-color:#0009;opacity:0;transition:all .3s ease}._overlay_1y1lk_195._opened_1y1lk_139{opacity:1;transition:all .3s ease}._overlay_1y1lk_195._is-closing_1y1lk_158{opacity:0;transition:all .3s ease}
+._drawer_1atax_3{--drawer-width: 808px;--drawer-z-index: 10000;position:fixed;z-index:10000;z-index:var(--drawer-z-index);display:flex;flex-direction:column;width:808px;width:var(--drawer-width);height:100%;overflow:auto;background-color:var(--black-5);transition:all .3s ease;pointer-events:none}._drawer_1atax_3::-webkit-scrollbar{width:3px}._drawer_1atax_3::-webkit-scrollbar-thumb{background-color:var(--black-80);border-radius:2px}._drawer_1atax_3::-webkit-scrollbar-track{background-color:var(--white)}._drawer_1atax_3 ._content_1atax_27{position:relative;display:flex;flex:1;flex-direction:column;padding:var(--space-m) var(--space-4xl) var(--space-4xl);transition:all .3s ease}@media (max-width: 600px){._drawer_1atax_3 ._content_1atax_27{--drawer-width: 100%;padding:var(--space-m)}}._drawer_1atax_3 ._content_1atax_27._is-loading_1atax_41{align-items:center;justify-content:center}._drawer_1atax_3 ._header_1atax_45{display:flex;gap:var(--space-xs);min-height:68px}._drawer_1atax_3 ._header_1atax_45:not(:last-child){margin-bottom:var(--space-2xl)}._drawer_1atax_3 ._header_1atax_45._sticky-header_1atax_53{position:-webkit-sticky;position:sticky;top:0;left:0;background-color:var(--black-5)}._drawer_1atax_3 ._header_1atax_45 ._title_1atax_59{flex:1;align-self:flex-end;font-weight:var(--font-weight-text-medium);font-size:var(--size-text-xl3);line-height:var(--line-height-text-s1);letter-spacing:.7px}@media (max-width: 600px){._drawer_1atax_3 ._header_1atax_45 ._title_1atax_59{font-size:var(--size-text-xl2);line-height:var(--line-height-text-xs)}}._drawer_1atax_3 ._header_1atax_45 ._space_1atax_73{flex:0 0 var(--button-height-m)}@media (max-width: 600px){._drawer_1atax_3 ._header_1atax_45{min-height:55px}._drawer_1atax_3 ._header_1atax_45:not(:last-child){margin-bottom:var(--space-m)}}._drawer_1atax_3 ._inner_1atax_84{flex:1}._drawer_1atax_3 ._button_1atax_87{position:absolute;top:var(--space-m);right:var(--space-m)}._drawer_1atax_3 ._footer_1atax_92{display:block;padding-top:var(--space-4xl)}@media (max-width: 600px){._drawer_1atax_3 ._footer_1atax_92{padding-top:var(--space-m)}}._drawer_1atax_3 ._footer-button_1atax_101{display:block;margin-left:auto}._drawer_1atax_3._left_1atax_105{top:0;left:-100%}._drawer_1atax_3._right_1atax_109{top:0;right:-100%}._drawer_1atax_3._full_1atax_113{top:0;right:0;bottom:0;left:0;width:100%;height:100%;max-height:100vh;border-radius:0;transform:scale(.95);opacity:0;transition:transform .3s ease-in-out,opacity .3s ease-in-out}._drawer_1atax_3._bottom_1atax_123{--drawer-width: calc(100% - var(--space-m));right:50%;bottom:-100%;left:50%;height:-webkit-max-content;height:-moz-max-content;height:max-content;max-height:calc(100% - var(--space-xs));border-top-left-radius:var(--control-radius);border-top-right-radius:var(--control-radius);transform:translate(-50%)}._drawer_1atax_3._bottom_1atax_123._full-bottom-height_1atax_134{height:calc(100% - var(--space-xs))}._drawer_1atax_3._bottom_1atax_123._is-loading_1atax_41{height:50vh}._drawer_1atax_3._opened_1atax_140{transition:all .3s ease;pointer-events:auto}._drawer_1atax_3._opened_1atax_140._left_1atax_105{left:0%;transition:left .3s ease}._drawer_1atax_3._opened_1atax_140._right_1atax_109{right:0%;transition:right .3s ease}._drawer_1atax_3._opened_1atax_140._bottom_1atax_123{bottom:0%}._drawer_1atax_3._opened_1atax_140._full_1atax_113{transform:scale(1);opacity:1}._drawer_1atax_3._is-closing_1atax_159._left_1atax_105{left:-100%}._drawer_1atax_3._is-closing_1atax_159._right_1atax_109{right:-100%}._drawer_1atax_3._is-closing_1atax_159._bottom_1atax_123{bottom:-100%}._drawer_1atax_3._is-closing_1atax_159._full_1atax_113{transform:scale(.95);opacity:0}@media (max-width: 1440px){._drawer_1atax_3{--drawer-width: 608px}}@media (max-width: 1280px){._drawer_1atax_3{--drawer-width: 648px}}@media (max-width: 768px){._drawer_1atax_3{--drawer-width: 584px}}@media (max-width: 600px){._drawer_1atax_3{--drawer-width: 100%}._drawer_1atax_3._bottom_1atax_123{--drawer-width: calc(100% - var(--space-xs))}}._overlay_1atax_196{--overlay-z-index: 9990;position:fixed;top:0;left:0;z-index:9990;z-index:var(--overlay-z-index);width:100%;height:100%;background-color:#0009;opacity:0;transition:all .3s ease}._overlay_1atax_196._opened_1atax_140{opacity:1;transition:all .3s ease}._overlay_1atax_196._is-closing_1atax_159{opacity:0;transition:all .3s ease}

package/dist/assets/styles.css

@@ -0,0 +1 @@
+._input_3fxwe_2{padding-right:var(--space-3xl)}._input-wrapper_3fxwe_6{flex:1}._date-wrapper_3fxwe_10{position:relative;width:100%}._date-wrapper_3fxwe_10:hover ._input-wrapper_3fxwe_6{background-color:var(--input-bg-color-hover)}._date-wrapper_3fxwe_10:before{position:absolute;top:0;right:60px;bottom:0;left:0;z-index:3;cursor:pointer;content:""}[data-disabled=true] ._date-wrapper_3fxwe_10:before{cursor:auto}[data-disabled=true] ._date-wrapper_3fxwe_10 ._input-wrapper_3fxwe_6{background:var(--black-20)}[data-disabled=true] ._date-wrapper_3fxwe_10 ._input-wrapper_3fxwe_6 label,[data-disabled=true] ._date-wrapper_3fxwe_10 ._input-wrapper_3fxwe_6 input{color:var(--white)}[data-disabled=true] ._button-wrapper_3fxwe_35 svg{color:var(--white);fill:var(--white);cursor:default}._wrapper_3fxwe_41{position:relative;display:flex;align-items:center;border-radius:var(--control-radius-s)}._wrapper_3fxwe_41._active_3fxwe_47{border-bottom:1px solid var(--citrine-100)}._button-wrapper_3fxwe_35{position:absolute;top:0;right:0;z-index:2;display:flex;width:44px;height:100%;max-height:var(--button-height-xxl)}._button_3fxwe_35{align-self:center;background-color:transparent;border-radius:var(--control-radius-s)}._field-overlow_3fxwe_68{position:fixed;top:0;right:0;bottom:0;left:0;z-index:3}._calendar-block_3fxwe_74{position:absolute;z-index:3;display:flex;flex-direction:column;width:368px;max-height:none;padding:16px;font-weight:var(--font-weight-text-regular);font-size:var(--size-text-l);font-family:var(--font-inter);font-style:normal;line-height:var(--line-height-text-2xs);text-align:center;text-overflow:ellipsis;background:var(--white);border-radius:var(--control-radius-s);box-shadow:0 0 #16172705,0 2px 4px #16172705,0 6px 6px #16172705,0 15px 9px #16172703;opacity:0;transition:height .5s ease-in;font-feature-settings:"zero";font-variant-numeric:slashed-zero}._calendar-block_3fxwe_74 ._h_3fxwe_97{display:flex;width:100%;color:var(--black-100)}._calendar-block_3fxwe_74 ._b_3fxwe_35{display:grid;grid-template-columns:repeat(7,1fr)}._calendar-block_3fxwe_74 ._d_3fxwe_10{display:flex;flex:1;align-items:center;justify-content:center;color:var(--black-100);cursor:pointer;gap:4px}._calendar-block_3fxwe_74 ._m_3fxwe_118,._calendar-block_3fxwe_74 ._a_3fxwe_47,._calendar-block_3fxwe_74 ._prev_3fxwe_120{width:auto;height:48px;overflow:hidden}._calendar-block_3fxwe_74 ._m_3fxwe_118{display:flex;align-items:center;justify-content:center;color:var(--disabled)}._calendar-block_3fxwe_74 ._m_3fxwe_118 b{font-weight:var(--font-weight-text-regular)}._calendar-block_3fxwe_74 ._orange_3fxwe_136{color:var(--citrine-100)}._calendar-block_3fxwe_74 ._a_3fxwe_47{color:var(--black-100);border-radius:var(--control-radius-s)}._calendar-block_3fxwe_74 ._a_3fxwe_47 b{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-weight:var(--font-weight-text-regular);cursor:pointer}._calendar-block_3fxwe_74 ._a_3fxwe_47 b:hover{background:var(--black-10)}._calendar-block_3fxwe_74 ._a_3fxwe_47 b:active{color:var(--white);background:var(--sapphire-100)}._calendar-block_3fxwe_74 ._current_3fxwe_161{background:var(--sapphire-10);border-radius:var(--control-radius-s)}._calendar-block_3fxwe_74 ._monthGrid_3fxwe_166{display:grid;grid-template-columns:repeat(3,1fr)}

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

@@ -14,6 +14,12 @@ export type DatePicker = {
      * значение из стейта (data)
      */
     value?: string;
+    /**
+     * значение типа модально окна календаря
+     */
+    type?: 'days' | 'months' | 'years';
+    disabled?: boolean;
+    error?: boolean;
 } & TInputProps;
 export type TDatePickerValue = {
     value?: Date;
@@ -33,4 +39,10 @@ export declare const DatePicker: import('react').MemoExoticComponent<import('rea
      * значение из стейта (data)
      */
     value?: string;
+    /**
+     * значение типа модально окна календаря
+     */
+    type?: "days" | "months" | "years";
+    disabled?: boolean;
+    error?: boolean;
 } & import('../Input/types').TInputProps & import('../Input').TAdditionalProps & import('react').RefAttributes<HTMLInputElement>>>;

package/dist/components/DatePicker/DatePicker.js

@@ -1,44 +1,92 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { c as classNames } from "../../index-CweZ_OcN.js";
-import { memo, forwardRef, useState } from "react";
-import { c as cls, D as DatePickerModal } from "../../DatePickerModal-BM0BgzTb.js";
+import { memo, forwardRef, useState, useEffect } from "react";
+import { DatePickerModal } from "./DatePickerModal.js";
+import { MonthPickerModal } from "./MonthPickerModal.js";
+import { c as cls } from "../../styles.module-BZXDqssF.js";
+import { YearPickerModal } from "./YearPickerModal.js";
 import { useClickOutside } from "../../hooks/useClickOutside/useClickOutside.js";
 import { formating } from "../../utils/index.js";
 import { Button } from "../Button/Button.js";
 import { I as Input } from "../../Input-6mudFqTb.js";
+import { EInputVariant } from "../Input/constants.js";
 const DatePicker = memo(
   forwardRef(
-    ({ size, value, onChangeValue, name, before, ...props }, ref) => {
+    ({
+      size,
+      value,
+      onChangeValue,
+      name,
+      before,
+      type = "days",
+      error,
+      variant,
+      disabled = false,
+      ...props
+    }, ref) => {
       const [isActive, setActive] = useState(false);
+      const [pickerType, setType] = useState(type);
       const [date, setDate] = useState(
         value ? new Date(value) : /* @__PURE__ */ new Date()
       );
+      const [isError, setError] = useState(error);
+      useEffect(() => {
+        setError(error);
+      }, [error]);
       useClickOutside({
         isActive,
-        setActive,
+        setActive: (e) => {
+          setActive(e);
+          setType(type);
+        },
         className: cls["calendar-block"]
       });
       const onOpen = () => {
-        setActive(true);
+        if (!disabled) setActive(true);
       };
       const onDate = (d) => {
+        if (pickerType === "years") {
+          if (type === "years") {
+            setActive(false);
+            setType(type);
+          } else {
+            setType("months");
+          }
+        }
+        if (pickerType === "months") {
+          if (type === "months") {
+            setActive(false);
+            setType(type);
+          } else {
+            setType("days");
+          }
+        }
         setDate(d);
         onChangeValue == null ? void 0 : onChangeValue({ value: d, name });
       };
       const wrapperClassNames = classNames(cls.wrapper, isActive && cls.active);
-      return /* @__PURE__ */ jsxs("div", { className: wrapperClassNames, children: [
-        /* @__PURE__ */ jsx("div", { className: cls["date-wrapper"], onClick: onOpen, children: /* @__PURE__ */ jsx(
-          Input,
+      return /* @__PURE__ */ jsxs("div", { className: wrapperClassNames, "data-disabled": disabled, children: [
+        /* @__PURE__ */ jsx(
+          "div",
           {
-            ref,
-            className: cls.input,
-            wrapperClassName: cls["input-wrapper"],
-            size,
-            type: "text",
-            value: formating.Date(date, "dd.mm.yy"),
-            ...props
+            "data-error": isError,
+            className: cls["date-wrapper"],
+            onClick: onOpen,
+            children: /* @__PURE__ */ jsx(
+              Input,
+              {
+                ref,
+                className: cls.input,
+                wrapperClassName: cls["input-wrapper"],
+                size,
+                type: "text",
+                variant: isError ? EInputVariant.Error : variant,
+                value: formating.Date(date, "dd.mm.yy"),
+                ...props
+              }
+            )
           }
-        ) }),
+        ),
         /* @__PURE__ */ jsx("div", { className: cls["button-wrapper"], children: /* @__PURE__ */ jsx(
           Button,
           {
@@ -50,13 +98,34 @@ const DatePicker = memo(
             iconName: isActive ? "DropdownArrowUp16px" : "DropdownArrowBottom16px"
           }
         ) }),
-        isActive && /* @__PURE__ */ jsx(
+        pickerType === "days" && isActive && /* @__PURE__ */ jsx(
           DatePickerModal,
           {
             onChangeValue: onDate,
             date,
             setActive,
-            before: typeof before === "string" ? new Date(before) : before
+            before: typeof before === "string" ? new Date(before) : before,
+            onType: setType
+          }
+        ),
+        pickerType === "months" && isActive && /* @__PURE__ */ jsx(
+          MonthPickerModal,
+          {
+            onChangeValue: onDate,
+            date,
+            setActive,
+            before: typeof before === "string" ? new Date(before) : before,
+            onType: setType
+          }
+        ),
+        pickerType === "years" && isActive && /* @__PURE__ */ jsx(
+          YearPickerModal,
+          {
+            onChangeValue: onDate,
+            date,
+            setActive,
+            before: typeof before === "string" ? new Date(before) : before,
+            onType: setType
           }
         )
       ] });

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

@@ -3,6 +3,7 @@ type DatePickerModal = {
     onChangeValue: (d: Date) => void;
     setActive: (s: boolean) => void;
     before?: Date;
+    onType?: (s: 'days' | 'months' | 'years') => void;
 };
-export declare function DatePickerModal({ date, onChangeValue, setActive, before }: DatePickerModal): import("react/jsx-runtime").JSX.Element;
+export declare function DatePickerModal({ date, onChangeValue, setActive, before, onType }: DatePickerModal): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/DatePicker/DatePickerModal.js

@@ -1,9 +1,184 @@
-import "react/jsx-runtime";
-import "react";
-import "./constants.js";
-import { D } from "../../DatePickerModal-BM0BgzTb.js";
-import "../../utils/index.js";
-import "../Button/Button.js";
+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-BZXDqssF.js";
+import { Icon } from "../../icons/Icon.js";
+import { formating } from "../../utils/index.js";
+import { Button } from "../Button/Button.js";
+function DatePickerModal({
+  date,
+  onChangeValue,
+  setActive,
+  before,
+  onType
+}) {
+  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 countWorkDays = 4;
+  const [month, setMonth] = useState({ y: selecte.y, m: selecte.m });
+  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";
+    }
+  }, [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);
+    }
+    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(
+      (/* @__PURE__ */ new Date(
+        `${month.y}-${formating.Number(2, month.m)}-${formating.Number(2, searchDate)}`
+      )).getTime()
+    ))
+      return;
+    onChangeValue(
+      /* @__PURE__ */ new Date(
+        `${month.y}-${formating.Number(2, month.m)}-${formating.Number(2, searchDate)}`
+      )
+    );
+    onExit();
+  };
+  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: [
+        formating.Month(month.m).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",
+            {
+              className: current.y === month.y && current.m === month.m && current.d === i ? cls["current"] : "",
+              onClick: () => send(i),
+              children: i
+            }
+          ) : /* @__PURE__ */ jsx("p", {})
+        },
+        s
+      )),
+      nextDaysArray.map((el, key) => /* @__PURE__ */ jsx("div", { className: cls["m"], children: el }, key))
+    ] })
+  ] }) });
+}
 export {
-  D as DatePickerModal
+  DatePickerModal
 };

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

@@ -0,0 +1,9 @@
+type MonthPickerModal = {
+    date: Date;
+    onChangeValue: (d: Date) => void;
+    setActive: (s: boolean) => void;
+    before?: Date;
+    onType?: (s: 'years') => void;
+};
+export declare function MonthPickerModal({ date, onChangeValue, before, onType }: MonthPickerModal): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/DatePicker/MonthPickerModal.js

@@ -0,0 +1,123 @@
+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-BZXDqssF.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
+}) {
+  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 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(
+      (/* @__PURE__ */ new Date(
+        `${year}-${formating.Number(2, searchDate)}-${formating.Number(2, selecte.d)}`
+      )).getTime()
+    ))
+      return;
+    onChangeValue(
+      /* @__PURE__ */ new Date(
+        `${year}-${formating.Number(2, searchDate)}-${formating.Number(2, selecte.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,
+        {
+          isIconButton: true,
+          iconName: "DropdownArrowLeft16px",
+          onClick: prev,
+          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,
+        {
+          isIconButton: true,
+          iconName: "DropdownArrowRight16px",
+          onClick: next,
+          variant: "secondary-gray",
+          size: "l"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: cls["monthGrid"], children: months.map((i, s) => /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: isBefore(
+          (/* @__PURE__ */ new Date(`${year}-${formating.Number(2, s + 1)}`)).getTime()
+        ) ? cls["m"] : cls["a"],
+        children: /* @__PURE__ */ jsx(
+          "b",
+          {
+            className: current.y === year && current.m === s + 1 ? cls["current"] : "",
+            onClick: () => send(s + 1),
+            children: i
+          }
+        )
+      },
+      s
+    )) })
+  ] }) });
+}
+export {
+  MonthPickerModal
+};

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

@@ -0,0 +1,9 @@
+type YearPickerModal = {
+    date: Date;
+    onChangeValue: (d: Date) => void;
+    setActive: (s: boolean) => void;
+    before?: Date;
+    onType?: (s: 'years') => void;
+};
+export declare function YearPickerModal({ date, onChangeValue, before, onType }: YearPickerModal): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/DatePicker/YearPickerModal.js

@@ -0,0 +1,120 @@
+import { jsx, Fragment, jsxs } from "react/jsx-runtime";
+import { useRef, useState, useEffect } from "react";
+import { c as cls } from "../../styles.module-BZXDqssF.js";
+import { formating } from "../../utils/index.js";
+import { Button } from "../Button/Button.js";
+function YearPickerModal({
+  date,
+  onChangeValue,
+  before,
+  onType
+}) {
+  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;
+  const firstYears = year - 7;
+  const years = Array.from(Array(15).keys()).map((i) => i + firstYears);
+  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 next = () => {
+    setYear(year + 15);
+  };
+  const prev = () => {
+    setYear(year - 15);
+  };
+  const isBefore = (activeDate) => {
+    if (before) {
+      const beforeDate = before.getTime();
+      if (beforeDate > activeDate) return true;
+    }
+    return false;
+  };
+  const send = (searchDate) => {
+    if (isBefore(
+      (/* @__PURE__ */ new Date(
+        `${searchDate}-${formating.Number(2, selecte.m)}-${formating.Number(2, selecte.d)}`
+      )).getTime()
+    ))
+      return;
+    onChangeValue(
+      /* @__PURE__ */ new Date(
+        `${searchDate}-${formating.Number(2, selecte.m)}-${formating.Number(2, selecte.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,
+        {
+          isIconButton: true,
+          iconName: "DropdownArrowLeft16px",
+          onClick: prev,
+          variant: "secondary-gray",
+          size: "l"
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { onClick: () => onType == null ? void 0 : onType("years"), className: cls["d"] }),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          isIconButton: true,
+          iconName: "DropdownArrowRight16px",
+          onClick: next,
+          variant: "secondary-gray",
+          size: "l"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: cls["monthGrid"], children: years.map((i, s) => /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: isBefore(
+          (/* @__PURE__ */ new Date(`${i}-${formating.Number(2, current.m)}`)).getTime()
+        ) ? cls["m"] : cls["a"],
+        children: /* @__PURE__ */ jsx(
+          "b",
+          {
+            className: current.y === i ? cls["current"] : "",
+            onClick: () => send(i),
+            children: i
+          }
+        )
+      },
+      s
+    )) })
+  ] }) });
+}
+export {
+  YearPickerModal
+};

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

@@ -4,3 +4,4 @@ export declare enum EDatePickerBeforeDate {
     CurrentDate3 = "2024-07-11"
 }
 export declare const week: string[];
+export declare const months: string[];

package/dist/components/DatePicker/constants.js

@@ -5,7 +5,22 @@ var EDatePickerBeforeDate = /* @__PURE__ */ ((EDatePickerBeforeDate2) => {
   return EDatePickerBeforeDate2;
 })(EDatePickerBeforeDate || {});
 const week = ["пн", "вт", "ср", "чт", "пт", "сб", "вс"];
+const months = [
+  "Январь",
+  "Февраль",
+  "Март",
+  "Апрель",
+  "Май",
+  "Июнь",
+  "Июль",
+  "Август",
+  "Сентябрь",
+  "Октябрь",
+  "Ноябрь",
+  "Декабрь"
+];
 export {
   EDatePickerBeforeDate,
+  months,
   week
 };

package/dist/components/Drawer/Drawer.js

@@ -10,39 +10,39 @@ import { Button } from "../Button/Button.js";
 import { EButtonVariantDefault, EButtonSize } from "../Button/constants.js";
 import { Loader } from "../Loader/Loader.js";
 import { Portal } from "../Portal/Portal.js";
-import '../../assets/Drawer.css';const drawer = "_drawer_1y1lk_3";
-const content = "_content_1y1lk_27";
-const header = "_header_1y1lk_45";
-const title = "_title_1y1lk_59";
-const space = "_space_1y1lk_73";
-const inner = "_inner_1y1lk_84";
-const button = "_button_1y1lk_87";
-const footer = "_footer_1y1lk_92";
-const left = "_left_1y1lk_105";
-const right = "_right_1y1lk_109";
-const full = "_full_1y1lk_113";
-const bottom = "_bottom_1y1lk_123";
-const opened = "_opened_1y1lk_139";
-const overlay = "_overlay_1y1lk_195";
+import '../../assets/Drawer.css';const drawer = "_drawer_1atax_3";
+const content = "_content_1atax_27";
+const header = "_header_1atax_45";
+const title = "_title_1atax_59";
+const space = "_space_1atax_73";
+const inner = "_inner_1atax_84";
+const button = "_button_1atax_87";
+const footer = "_footer_1atax_92";
+const left = "_left_1atax_105";
+const right = "_right_1atax_109";
+const full = "_full_1atax_113";
+const bottom = "_bottom_1atax_123";
+const opened = "_opened_1atax_140";
+const overlay = "_overlay_1atax_196";
 const cls = {
   drawer,
   content,
-  "is-loading": "_is-loading_1y1lk_41",
+  "is-loading": "_is-loading_1atax_41",
   header,
-  "sticky-header": "_sticky-header_1y1lk_53",
+  "sticky-header": "_sticky-header_1atax_53",
   title,
   space,
   inner,
   button,
   footer,
-  "footer-button": "_footer-button_1y1lk_101",
+  "footer-button": "_footer-button_1atax_101",
   left,
   right,
   full,
   bottom,
-  "full-bottom-height": "_full-bottom-height_1y1lk_133",
+  "full-bottom-height": "_full-bottom-height_1atax_134",
   opened,
-  "is-closing": "_is-closing_1y1lk_158",
+  "is-closing": "_is-closing_1atax_159",
   overlay
 };
 const ANIMATION_DELAY = 300;

package/dist/components/Steps/Steps.js

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import { c as classNames } from "../../index-CweZ_OcN.js";
 import { forwardRef, useId, useState, useRef, useEffect } from "react";
-import { ZERO_STEP, EStepsSize, ID_SEPARATOR, StepSize, DIFF_BETWEEN_STEP_AND_INDEX } from "./constants.js";
+import { ZERO_STEP, EStepsSize, ID_SEPARATOR, STEP_ICONS_MAP, StepSize, DIFF_BETWEEN_STEP_AND_INDEX } from "./constants.js";
 import { Icon } from "../../icons/Icon.js";
 import '../../assets/Steps.css';const container = "_container_1qg9i_2";
 const step = "_step_1qg9i_6";
@@ -69,7 +69,7 @@ const Steps = forwardRef(
           onMouseEnter: handleMouseEnter,
           onMouseLeave: handleMouseLeave,
           style: { color },
-          children: /* @__PURE__ */ jsx(Icon, { iconName: "Step", ...StepSize[size] })
+          children: /* @__PURE__ */ jsx(Icon, { iconName: STEP_ICONS_MAP[size].icon, ...StepSize[size] })
         },
         idx
       );

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

@@ -1,3 +1,5 @@
+import { TIcon } from '../../icons';
+
 export declare const ZERO_STEP = 0;
 export declare const DIFF_BETWEEN_STEP_AND_INDEX = 1;
 export declare const ID_SEPARATOR = "-//-";
@@ -6,7 +8,8 @@ export declare enum EStepsSize {
     XS1 = "XS1",
     S = "S",
     M = "M",
-    L = "L"
+    L = "L",
+    XL = "XL"
 }
 export declare const StepSize: {
     XS: {
@@ -29,7 +32,14 @@ export declare const StepSize: {
         width: number;
         height: number;
     };
+    XL: {
+        width: number;
+        height: number;
+    };
 };
+export declare const STEP_ICONS_MAP: Record<EStepsSize, {
+    icon: TIcon;
+}>;
 export declare enum EStepColor {
     ASPHALT = "#333333",
     CITRINE = "#ff7900",

package/dist/components/Steps/constants.js

@@ -7,6 +7,7 @@ var EStepsSize = /* @__PURE__ */ ((EStepsSize2) => {
   EStepsSize2["S"] = "S";
   EStepsSize2["M"] = "M";
   EStepsSize2["L"] = "L";
+  EStepsSize2["XL"] = "XL";
   return EStepsSize2;
 })(EStepsSize || {});
 const StepSize = {
@@ -29,6 +30,48 @@ const StepSize = {
   L: {
     width: 64,
     height: 28
+  },
+  XL: {
+    width: 72,
+    height: 12
+  }
+};
+const STEP_ICONS_MAP = {
+  [
+    "XS"
+    /* XS */
+  ]: {
+    icon: "Step"
+  },
+  [
+    "XS1"
+    /* XS1 */
+  ]: {
+    icon: "Step"
+  },
+  [
+    "S"
+    /* S */
+  ]: {
+    icon: "Step"
+  },
+  [
+    "M"
+    /* M */
+  ]: {
+    icon: "Step"
+  },
+  [
+    "L"
+    /* L */
+  ]: {
+    icon: "Step"
+  },
+  [
+    "XL"
+    /* XL */
+  ]: {
+    icon: "StepXL"
   }
 };
 var EStepColor = /* @__PURE__ */ ((EStepColor2) => {
@@ -44,6 +87,7 @@ export {
   EStepColor,
   EStepsSize,
   ID_SEPARATOR,
+  STEP_ICONS_MAP,
   StepSize,
   ZERO_STEP
 };

package/dist/components/Uploader/Uploader.js

@@ -23,7 +23,7 @@ const MIME = {
 };
 const filesTyps = ["jpeg", "jpg", "png", "tiff", "gif"];
 const generateId = (min, max) => {
-  return Math.random() * (max - min) + min;
+  return Math.round(Math.random() * (max - min) + min);
 };
 const Uploader = forwardRef(
   (props, ref) => {

package/dist/icons/Icon.js

@@ -1,6 +1,6 @@
 import { jsx } from "react/jsx-runtime";
 import { Suspense } from "react";
-import { i as icons } from "../index-Cxiikb7g.js";
+import { i as icons } from "../index-VvtoJisa.js";
 const Icon = ({ iconName, ...props }) => {
   const Component = icons[iconName];
   if (!Component) {

package/dist/icons/components/StepXL.d.ts

@@ -0,0 +1,4 @@
+import { SVGProps } from 'react';
+
+declare const StepXL: ({ ...props }: SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
+export default StepXL;

package/dist/icons/components/StepXL.js

@@ -0,0 +1,32 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+const StepXL = ({ ...props }) => /* @__PURE__ */ jsxs(
+  "svg",
+  {
+    ...props,
+    viewBox: "0 0 71.1113 12",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    children: [
+      /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "M0 11.99L3.78 3.51C4.73 1.37 6.89 0 9.25 0L10 0L10 11.99L0 11.99L0 11.99Z",
+          fill: "currentColor",
+          fillRule: "evenodd"
+        }
+      ),
+      /* @__PURE__ */ jsx("path", { d: "M10,0H61.11V12H10Z", fill: "currentColor" }),
+      /* @__PURE__ */ jsx(
+        "path",
+        {
+          d: "M71.11 0L67.32 8.48C66.37 10.62 64.22 11.99 61.86 11.99L61.11 11.99L61.11 0L71.11 0L71.11 0Z",
+          fill: "currentColor",
+          fillRule: "evenodd"
+        }
+      )
+    ]
+  }
+);
+export {
+  StepXL as default
+};

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

@@ -574,3 +574,4 @@ export declare const Car: import('react').LazyExoticComponent<(props: import('re
 export declare const Bike: import('react').LazyExoticComponent<(props: import('react').SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element>;
 export declare const Mans: import('react').LazyExoticComponent<(props: import('react').SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element>;
 export declare const Step: import('react').LazyExoticComponent<(props: import('react').SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element>;
+export declare const StepXL: import('react').LazyExoticComponent<({ ...props }: import('react').SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element>;

package/dist/icons/components/index.js

@@ -1,5 +1,5 @@
 import "react";
-import { i5, A, b4, cZ, eQ, a, b, b5, b6, c_, c, d, b7, b8, c$, d0, e, f, b9, ba, d1, g, bb, d2, eT, hK, hJ, eU, eS, h, bc, d3, k, bd, d4, l, be, d5, m, bf, d6, j, bg, d7, n, hI, o, bh, d8, eR, hH, hG, gk, gl, hF, B, p, bi, bj, d9, da, i4, i9, i3, i2, i1, hE, hD, hC, hB, hA, hz, i0, q, bk, db, r, s, bm, dc, dd, bl, t, bn, de, u, bo, df, i8, v, w, bp, bq, dg, dh, h$, h_, hZ, hy, hx, hw, hv, hu, ht, hs, hr, hq, hp, ho, hn, hm, hl, hk, hj, hi, gj, x, br, di, y, z, bs, bt, dj, dk, fz, fy, D, bu, dl, E, F, bv, bw, dm, dn, G, bx, dp, eV, fK, h3, C, H, by, dq, I, bz, dr, J, bA, ds, K, L, bB, bC, dt, du, hh, hg, hf, he, M, N, bD, bE, dv, dw, O, bF, dx, hd, hY, gi, gh, gg, gf, hX, P, bG, dy, ge, Q, bH, dz, R, bI, dA, S, bJ, dB, T, bK, dC, hc, U, bL, dD, V, bM, dE, W, bN, dF, X, bO, dG, gd, hb, Y, bP, dH, hW, i7, Z, bQ, dI, ha, gc, _, bR, dJ, $, bS, dK, a0, a1, bT, bU, dL, dM, gb, ga, g9, a2, bV, dN, a3, bW, dO, a4, bX, dP, g8, h9, h8, g7, h7, hV, a5, bY, dQ, g6, a6, bZ, dR, g5, a7, b_, dS, hU, g4, g3, a8, b$, dT, g2, g1, g0, f$, h6, f_, fZ, a9, c0, dU, fY, aa, ab, c1, c2, dV, dW, fX, fW, fV, ac, c3, dX, fU, fT, h5, c4, c5, fS, h4, fR, fQ, fO, fP, fN, fI, fM, fL, fJ, ad, c6, dY, fH, fG, fE, fF, fD, h2, hT, ae, c7, dZ, fC, hS, af, c8, d_, fB, fA, fs, fx, ia, ag, c9, d$, fw, ah, ca, e0, ai, cb, e1, fv, fu, h1, h0, g$, g_, gZ, aj, cc, e2, ft, gY, gW, gX, ak, cd, e3, fr, al, am, ce, cf, e4, e5, an, cg, e6, hR, hQ, fq, gV, fp, gU, gT, gS, ao, ch, e7, ap, ci, e8, aq, ar, cj, ck, e9, ea, gR, gQ, fm, as, cl, eb, fo, at, au, cm, cn, ec, ed, fn, av, co, ee, gP, gO, gN, aw, cp, ef, ax, cq, eg, ay, cr, eh, az, cs, ei, aA, ct, ej, gM, gL, gK, aB, aC, cu, cv, ek, el, fl, fk, fj, fi, aD, cw, em, fh, aE, cx, en, fg, ff, gJ, aF, cy, eo, gI, fe, fd, aG, cz, ep, eq, aH, cA, fc, fb, gH, fa, f9, f8, aI, cB, er, aJ, aK, cC, cD, es, et, aL, cE, eu, ib, gG, aM, cF, ev, aN, cG, ew, gF, gE, aO, cH, ex, f7, f6, gD, f5, gC, gB, hP, gA, gz, gy, gx, gw, gv, gu, gt, gs, gr, gq, aP, cI, ey, f4, i6, gp, aQ, cJ, ez, aR, cK, eA, f3, aS, cL, eB, f2, aT, aU, cM, cN, eC, eD, aV, cO, eE, go, hO, f1, aW, aX, cP, cQ, eF, eG, aY, aZ, cR, cS, eH, eI, f0, a_, cT, eJ, e$, gn, e_, eZ, a$, cU, eK, hN, b0, cV, eL, hM, hL, eY, b1, cW, eM, eX, gm, b2, cX, eN, b3, cY, eO, eW, eP } from "../../index-Cxiikb7g.js";
+import { i5, A, b4, cZ, eQ, a, b, b5, b6, c_, c, d, b7, b8, c$, d0, e, f, b9, ba, d1, g, bb, d2, eT, hK, hJ, eU, eS, h, bc, d3, k, bd, d4, l, be, d5, m, bf, d6, j, bg, d7, n, hI, o, bh, d8, eR, hH, hG, gk, gl, hF, B, p, bi, bj, d9, da, i4, i9, i3, i2, i1, hE, hD, hC, hB, hA, hz, i0, q, bk, db, r, s, bm, dc, dd, bl, t, bn, de, u, bo, df, i8, v, w, bp, bq, dg, dh, h$, h_, hZ, hy, hx, hw, hv, hu, ht, hs, hr, hq, hp, ho, hn, hm, hl, hk, hj, hi, gj, x, br, di, y, z, bs, bt, dj, dk, fz, fy, D, bu, dl, E, F, bv, bw, dm, dn, G, bx, dp, eV, fK, h3, C, H, by, dq, I, bz, dr, J, bA, ds, K, L, bB, bC, dt, du, hh, hg, hf, he, M, N, bD, bE, dv, dw, O, bF, dx, hd, hY, gi, gh, gg, gf, hX, P, bG, dy, ge, Q, bH, dz, R, bI, dA, S, bJ, dB, T, bK, dC, hc, U, bL, dD, V, bM, dE, W, bN, dF, X, bO, dG, gd, hb, Y, bP, dH, hW, i7, Z, bQ, dI, ha, gc, _, bR, dJ, $, bS, dK, a0, a1, bT, bU, dL, dM, gb, ga, g9, a2, bV, dN, a3, bW, dO, a4, bX, dP, g8, h9, h8, g7, h7, hV, a5, bY, dQ, g6, a6, bZ, dR, g5, a7, b_, dS, hU, g4, g3, a8, b$, dT, g2, g1, g0, f$, h6, f_, fZ, a9, c0, dU, fY, aa, ab, c1, c2, dV, dW, fX, fW, fV, ac, c3, dX, fU, fT, h5, c4, c5, fS, h4, fR, fQ, fO, fP, fN, fI, fM, fL, fJ, ad, c6, dY, fH, fG, fE, fF, fD, h2, hT, ae, c7, dZ, fC, hS, af, c8, d_, fB, fA, fs, fx, ia, ag, c9, d$, fw, ah, ca, e0, ai, cb, e1, fv, fu, h1, h0, g$, g_, gZ, aj, cc, e2, ft, gY, gW, gX, ak, cd, e3, fr, al, am, ce, cf, e4, e5, an, cg, e6, hR, hQ, fq, gV, fp, gU, gT, gS, ao, ch, e7, ap, ci, e8, aq, ar, cj, ck, e9, ea, gR, gQ, fm, as, cl, eb, fo, at, au, cm, cn, ec, ed, fn, av, co, ee, gP, gO, gN, aw, cp, ef, ax, cq, eg, ay, cr, eh, az, cs, ei, aA, ct, ej, gM, gL, gK, aB, aC, cu, cv, ek, el, fl, fk, fj, fi, aD, cw, em, fh, aE, cx, en, fg, ff, gJ, aF, cy, eo, gI, fe, fd, aG, cz, ep, eq, aH, cA, fc, fb, gH, fa, f9, f8, aI, cB, er, aJ, aK, cC, cD, es, et, aL, cE, eu, ib, ic, gG, aM, cF, ev, aN, cG, ew, gF, gE, aO, cH, ex, f7, f6, gD, f5, gC, gB, hP, gA, gz, gy, gx, gw, gv, gu, gt, gs, gr, gq, aP, cI, ey, f4, i6, gp, aQ, cJ, ez, aR, cK, eA, f3, aS, cL, eB, f2, aT, aU, cM, cN, eC, eD, aV, cO, eE, go, hO, f1, aW, aX, cP, cQ, eF, eG, aY, aZ, cR, cS, eH, eI, f0, a_, cT, eJ, e$, gn, e_, eZ, a$, cU, eK, hN, b0, cV, eL, hM, hL, eY, b1, cW, eM, eX, gm, b2, cX, eN, b3, cY, eO, eW, eP } from "../../index-VvtoJisa.js";
 export {
   i5 as Acceleration,
   A as Accept16px,
@@ -475,6 +475,7 @@ export {
   cE as StarHalf24pxF,
   eu as StarHalf32pxF,
   ib as Step,
+  ic as StepXL,
   gG as TankerTruck,
   aM as Telegram16pxF,
   cF as Telegram24pxF,

package/dist/{index-Cxiikb7g.js → index-VvtoJisa.js}

@@ -839,6 +839,7 @@ const Car = lazy(() => import("./icons/components/cars-stubus/Car.js"));
 const Bike = lazy(() => import("./icons/components/cars-stubus/Bike.js"));
 const Mans = lazy(() => import("./icons/components/Mans.js"));
 const Step = lazy(() => import("./icons/components/Step.js"));
+const StepXL = lazy(() => import("./icons/components/StepXL.js"));
 const icons = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   Acceleration,
@@ -1315,6 +1316,7 @@ const icons = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePropert
   StarHalf24pxF,
   StarHalf32pxF,
   Step,
+  StepXL,
   TankerTruck,
   Telegram16pxF,
   Telegram24pxF,
@@ -1979,6 +1981,7 @@ export {
   Bike as i9,
   Mans as ia,
   Step as ib,
+  StepXL as ic,
   ArrowUpRight16px as j,
   ArrowLeft16px as k,
   ArrowRight16px as l,

package/dist/styles.module-BZXDqssF.js

@@ -0,0 +1,36 @@
+import './assets/styles.css';const input = "_input_3fxwe_2";
+const wrapper = "_wrapper_3fxwe_41";
+const active = "_active_3fxwe_47";
+const button = "_button_3fxwe_35";
+const h = "_h_3fxwe_97";
+const b = "_b_3fxwe_35";
+const d = "_d_3fxwe_10";
+const m = "_m_3fxwe_118";
+const a = "_a_3fxwe_47";
+const prev = "_prev_3fxwe_120";
+const orange = "_orange_3fxwe_136";
+const current = "_current_3fxwe_161";
+const monthGrid = "_monthGrid_3fxwe_166";
+const cls = {
+  input,
+  "input-wrapper": "_input-wrapper_3fxwe_6",
+  "date-wrapper": "_date-wrapper_3fxwe_10",
+  "button-wrapper": "_button-wrapper_3fxwe_35",
+  wrapper,
+  active,
+  button,
+  "field-overlow": "_field-overlow_3fxwe_68",
+  "calendar-block": "_calendar-block_3fxwe_74",
+  h,
+  b,
+  d,
+  m,
+  a,
+  prev,
+  orange,
+  current,
+  monthGrid
+};
+export {
+  cls as c
+};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "mimir-ui-kit",
   "private": false,
-  "version": "1.21.2",
+  "version": "1.21.4",
   "type": "module",
   "exports": {
     ".": {

package/dist/DatePickerModal-BM0BgzTb.js

@@ -1,204 +0,0 @@
-import { jsx, Fragment, jsxs } from "react/jsx-runtime";
-import { useRef, useState, useEffect } from "react";
-import { week } from "./components/DatePicker/constants.js";
-import { formating } from "./utils/index.js";
-import { Button } from "./components/Button/Button.js";
-import './assets/DatePickerModal.css';const input = "_input_1ndkx_2";
-const wrapper = "_wrapper_1ndkx_21";
-const active = "_active_1ndkx_27";
-const button = "_button_1ndkx_35";
-const h = "_h_1ndkx_81";
-const b = "_b_1ndkx_35";
-const d = "_d_1ndkx_6";
-const m = "_m_1ndkx_100";
-const a = "_a_1ndkx_27";
-const prev = "_prev_1ndkx_102";
-const orange = "_orange_1ndkx_118";
-const current = "_current_1ndkx_143";
-const cls = {
-  input,
-  "date-wrapper": "_date-wrapper_1ndkx_6",
-  wrapper,
-  active,
-  "input-wrapper": "_input-wrapper_1ndkx_31",
-  "button-wrapper": "_button-wrapper_1ndkx_35",
-  button,
-  "field-overlow": "_field-overlow_1ndkx_52",
-  "calendar-block": "_calendar-block_1ndkx_58",
-  h,
-  b,
-  d,
-  m,
-  a,
-  prev,
-  orange,
-  current
-};
-function DatePickerModal({
-  date,
-  onChangeValue,
-  setActive,
-  before
-}) {
-  const field = useRef(null);
-  const _current = new Date(date);
-  const _selecte = new Date(date);
-  const current2 = {
-    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 });
-  useEffect(() => {
-    const windowHeight = window.innerHeight;
-    if (field.current !== null) {
-      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 = "65px";
-      }
-      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);
-    }
-    return nextList;
-  };
-  const nextDaysArray = nextDays();
-  const update = (m2, y) => {
-    y = m2 > 12 ? y + 1 : m2 < 1 ? y - 1 : y;
-    m2 = m2 > 12 ? 1 : m2 < 1 ? 12 : m2;
-    return { y, m: m2 };
-  };
-  const onExit = () => {
-    setActive(false);
-  };
-  const next = () => {
-    setMonth(update(month.m + 1, month.y));
-  };
-  const prev2 = () => {
-    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(
-      (/* @__PURE__ */ new Date(
-        `${month.y}-${formating.Number(2, month.m)}-${formating.Number(2, searchDate)}`
-      )).getTime()
-    ))
-      return;
-    onChangeValue(
-      /* @__PURE__ */ new Date(
-        `${month.y}-${formating.Number(2, month.m)}-${formating.Number(2, searchDate)}`
-      )
-    );
-    onExit();
-  };
-  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: prev2,
-          variant: "secondary-gray",
-          size: "l"
-        }
-      ),
-      /* @__PURE__ */ jsxs("div", { className: cls["d"], children: [
-        formating.Month(month.m).name,
-        "’",
-        month.y.toString().slice(-2)
-      ] }),
-      /* @__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",
-            {
-              className: current2.y === month.y && current2.m === month.m && current2.d === i ? cls["current"] : "",
-              onClick: () => send(i),
-              children: i
-            }
-          ) : /* @__PURE__ */ jsx("p", {})
-        },
-        s
-      )),
-      nextDaysArray.map((el, key) => /* @__PURE__ */ jsx("div", { className: cls["m"], children: el }, key))
-    ] })
-  ] }) });
-}
-export {
-  DatePickerModal as D,
-  cls as c
-};

package/dist/assets/DatePickerModal.css

@@ -1 +0,0 @@
-._input_1ndkx_2{padding-right:var(--space-3xl)}._date-wrapper_1ndkx_6{position:relative;width:100%}._date-wrapper_1ndkx_6:hover input{background:var(--input-bg-color-hover)}._date-wrapper_1ndkx_6:before{position:absolute;top:0;right:60px;bottom:0;left:0;z-index:3;cursor:pointer;content:""}._wrapper_1ndkx_21{position:relative;display:flex;align-items:center;border-radius:var(--control-radius-s)}._wrapper_1ndkx_21._active_1ndkx_27{border-bottom:1px solid var(--citrine-100)}._input-wrapper_1ndkx_31{flex:1}._button-wrapper_1ndkx_35{position:absolute;top:0;right:0;z-index:2;display:flex;width:44px;height:100%;max-height:var(--button-height-xxl)}._button_1ndkx_35{align-self:center;background-color:transparent;border-radius:var(--control-radius-s)}._field-overlow_1ndkx_52{position:fixed;top:0;right:0;bottom:0;left:0;z-index:3}._calendar-block_1ndkx_58{position:absolute;z-index:3;display:flex;flex-direction:column;width:368px;max-height:none;padding:16px;font-weight:var(--font-weight-text-regular);font-size:var(--size-text-l);font-family:var(--font-inter);font-style:normal;line-height:var(--line-height-text-2xs);text-align:center;text-overflow:ellipsis;background:#fff;border-radius:var(--control-radius-s);box-shadow:0 0 #16172705,0 2px 4px #16172705,0 6px 6px #16172705,0 15px 9px #16172703;opacity:0;transition:height .5s ease-in;font-feature-settings:"zero";font-variant-numeric:slashed-zero}._calendar-block_1ndkx_58 ._h_1ndkx_81{display:flex;width:100%;color:var(--black-100)}._calendar-block_1ndkx_58 ._b_1ndkx_35{display:grid;grid-template-columns:repeat(7,1fr)}._calendar-block_1ndkx_58 ._d_1ndkx_6{display:flex;flex:1;align-items:center;justify-content:center;color:var(--black-100)}._calendar-block_1ndkx_58 ._m_1ndkx_100,._calendar-block_1ndkx_58 ._a_1ndkx_27,._calendar-block_1ndkx_58 ._prev_1ndkx_102{width:48px;height:48px;overflow:hidden}._calendar-block_1ndkx_58 ._m_1ndkx_100{display:flex;align-items:center;justify-content:center;color:var(--disabled)}._calendar-block_1ndkx_58 ._m_1ndkx_100 b{font-weight:var(--font-weight-text-regular)}._calendar-block_1ndkx_58 ._orange_1ndkx_118{color:var(--citrine-100)}._calendar-block_1ndkx_58 ._a_1ndkx_27{color:var(--black-100);border-radius:var(--control-radius-s)}._calendar-block_1ndkx_58 ._a_1ndkx_27 b{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-weight:var(--font-weight-text-regular);cursor:pointer}._calendar-block_1ndkx_58 ._a_1ndkx_27 b:hover{background:var(--black-10)}._calendar-block_1ndkx_58 ._a_1ndkx_27 b:active{color:var(--white);background:var(--sapphire-100)}._calendar-block_1ndkx_58 ._current_1ndkx_143{background:var(--sapphire-10);border-radius:var(--control-radius-s)}