intelicoreact 2.0.4 → 2.0.5

package/dist/form.js

@@ -491,6 +491,95 @@ var CheckboxesLine_default2 = CheckboxesLine_default;
 // src/Atomic/FormElements/CheckboxInput/index.ts
 var CheckboxInput_default2 = CheckboxInput_default;
 
+// src/Atomic/FormElements/Datepicker/components/DatepickerCalendar.tsx
+import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
+import cn9 from "classnames";
+import moment2 from "moment";
+import { useEffect as useEffect2, useMemo as useMemo2, useState as useState2 } from "react";
+import * as Icon from "react-feather";
+var DatepickerCalendar = ({
+  date,
+  setDate,
+  startDate,
+  endDate,
+  allowPrev = true,
+  allowNext = true,
+  onClick,
+  onHover,
+  startPrevDate,
+  endPrevDate,
+  limitRange
+}) => {
+  const [days, setDays] = useState2({});
+  const title = useMemo2(() => `${moment2(date).format("MMM")} ${moment2(date).format("YYYY")}`, [date]);
+  useEffect2(() => {
+    const result = {};
+    const day = moment2(date).startOf("month");
+    const daysInMonth = day.daysInMonth();
+    for (let d = 0; d < daysInMonth; d++) {
+      let week = day.week();
+      if (day.month() === 11 && week === 1) week = 53;
+      if (day.month() === 0 && week === 53) week = 0;
+      if (!result[week]) result[week] = {};
+      result[week][day.weekday()] = { date: day.toDate() };
+      day.add(1, "d");
+    }
+    setDays(result);
+  }, [date]);
+  const renderDay = (week, dayOfWeek) => {
+    const day = days[+week]?.[dayOfWeek];
+    const isFutureDay = day && moment2(day.date).isAfter(moment2(), "day");
+    const isPastDay = limitRange ? day && moment2(day.date).isBefore(moment2().subtract(limitRange, "days"), "day") : null;
+    const isRangeEnd = day && (moment2(day.date).isSame(startDate, "day") || moment2(day.date).isSame(moment2(endDate).subtract(1, "hour"), "day"));
+    const isRangeInside = day && startDate && endDate && moment2(day.date).isAfter(startDate, "day") && moment2(day.date).isBefore(moment2(endDate).subtract(1, "hour"), "day");
+    const isPrevRangeEnd = day && (moment2(day.date).isSame(startPrevDate, "day") || moment2(day.date).isSame(moment2(endPrevDate).subtract(1, "day"), "day"));
+    const isPrevRangeInside = day && startPrevDate && endPrevDate && moment2(day.date).isAfter(startPrevDate, "day") && moment2(day.date).isBefore(moment2(endPrevDate).subtract(1, "day"), "day");
+    const classNames2 = cn9(
+      "calendar__day",
+      { "calendar__day--clickable": day },
+      { "calendar__day--disabled": isFutureDay || isPastDay },
+      { "calendar__day--range-end": isRangeEnd },
+      { "calendar__day--range-inside": isRangeInside },
+      { "calendar__day--prev-range-end": isPrevRangeEnd },
+      { "calendar__day--prev-range-inside": isPrevRangeInside }
+    );
+    return /* @__PURE__ */ jsx9(
+      "div",
+      {
+        className: classNames2,
+        onClick: day && !isFutureDay ? () => onClick(day.date) : void 0,
+        onMouseOver: day && !isFutureDay ? () => onHover(day.date) : void 0,
+        onMouseLeave: () => onHover(null),
+        children: day && day.date.getDate()
+      },
+      `${week}_${dayOfWeek}`
+    );
+  };
+  const handlePrev = () => {
+    setDate(moment2(date).subtract(1, "month").toDate());
+  };
+  const handleNext = () => {
+    setDate(moment2(date).add(1, "month").toDate());
+  };
+  return /* @__PURE__ */ jsxs8("div", { className: "calendar", children: [
+    /* @__PURE__ */ jsxs8("div", { className: "calendar-header", children: [
+      /* @__PURE__ */ jsx9("div", { className: "calendar-header__prev", children: allowPrev && /* @__PURE__ */ jsx9("button", { type: "button", "data-testid": "datepicker-calendar-prev", onClick: handlePrev, "aria-label": "Previous month", children: /* @__PURE__ */ jsx9(Icon.ChevronLeft, { size: 16 }) }) }),
+      /* @__PURE__ */ jsx9("div", { className: "calendar-header__title", children: title }),
+      /* @__PURE__ */ jsx9("div", { className: "calendar-header__next", children: allowNext && /* @__PURE__ */ jsx9("button", { type: "button", "data-testid": "datepicker-calendar-next", onClick: handleNext, "aria-label": "Next month", children: /* @__PURE__ */ jsx9(Icon.ChevronRight, { size: 16 }) }) })
+    ] }),
+    /* @__PURE__ */ jsx9("div", { className: "calendar__week", children: Array.from({ length: 7 }, (_, dayOfWeek) => /* @__PURE__ */ jsx9(
+      "div",
+      {
+        className: "calendar__day calendar__day--title",
+        children: moment2().weekday(dayOfWeek).format("dd").charAt(0)
+      },
+      `day-of-week_${dayOfWeek}`
+    )) }),
+    Object.keys(days).map((week, index) => /* @__PURE__ */ jsx9("div", { className: "calendar__week", children: Array.from({ length: 7 }, (_, dayOfWeek) => renderDay(week, dayOfWeek)) }, `week_${index}`))
+  ] });
+};
+var DatepickerCalendar_default = DatepickerCalendar;
+
 // src/Atomic/FormElements/Datepicker/Datepicker.tsx
 import { Fragment as Fragment3, jsx as jsx22, jsxs as jsxs19 } from "react/jsx-runtime";
 
@@ -663,7 +752,7 @@ var Langs = {
 var Langs_default = Langs;
 
 // src/Atomic/FormElements/Dropdown/Dropdown.tsx
-import { Fragment, jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
 
 // src/Constants/index.constants.js
 var KEYBOARD_SERVICE_KEYS = [
@@ -741,8 +830,8 @@ var OS = {
 };
 
 // src/Functions/utils.js
-import { useEffect as useEffect2 } from "react";
-import moment2 from "moment-timezone";
+import { useEffect as useEffect3 } from "react";
+import moment3 from "moment-timezone";
 var uuid = () => Date.now().toString(36) + Math.random().toString(36).substring(2);
 var getIsOnlyAnObject = (input) => {
   return typeof input === "object" && // "отбивает" примитивы и функции
@@ -771,7 +860,7 @@ var useOutsideToggle = (ref, setOut, open) => {
       setOut(open);
     }
   }
-  useEffect2(() => {
+  useEffect3(() => {
     document.addEventListener("mouseup", handleClickOutside);
     return () => {
       document.removeEventListener("mouseup", handleClickOutside);
@@ -787,17 +876,17 @@ var clone = (input) => {
 var getResponseClone = async (res) => await (typeof res?.clone === "function" ? res.clone() : clone(res));
 function transformUTCTimeToLocal(date, format = "YYYY-MM-DD HH:mm:ss") {
   if (!date) return;
-  const utcDate = moment2.utc(date).toDate();
-  return moment2(utcDate, format).local().format(format);
+  const utcDate = moment3.utc(date).toDate();
+  return moment3(utcDate, format).local().format(format);
 }
 function transformLocalTimeToUTC(date, format = "YYYY-MM-DD HH:mm:ss") {
   if (!date) return;
-  return moment2(date, format).utc().format(format);
+  return moment3(date, format).utc().format(format);
 }
 function transformUTCHoursToLocal(time, format = "HH:mm:ss") {
   if (!time) return;
   const splitedTime = time.split(":");
-  const offset = moment2().utcOffset();
+  const offset = moment3().utcOffset();
   let HH = Number(splitedTime[0]);
   let mm = Number(splitedTime[1]);
   const ss = splitedTime[2];
@@ -821,17 +910,17 @@ function transformDateOrTimeOrTogetherToFormat(data, outputFormat = "HH:mm", add
     additional
   ) ? additional : {};
   if (typeof data !== "string" && typeof data !== "number") {
-    return isReturnAsMomentInstance ? moment2("error") : ERROR_MESSGE;
+    return isReturnAsMomentInstance ? moment3("error") : ERROR_MESSGE;
   }
   const momentArgs = [
     data,
     ...!Number.isNaN(Number(data)) || typeof parseFormat === "string" ? [] : [parseFormat]
   ];
   const momentInstance = (() => {
-    let instance = moment2(...momentArgs);
+    let instance = moment3(...momentArgs);
     if (instance.format(outputFormat) !== ERROR_VALUE) return instance;
     else if (/^\d\d.\d\d/.test(data)) {
-      instance = moment2();
+      instance = moment3();
       const symbols = data.split("");
       const timeArr = symbols.reduce(
         (acc, symbol, idx) => {
@@ -849,7 +938,7 @@ function transformDateOrTimeOrTogetherToFormat(data, outputFormat = "HH:mm", add
       instance.minutes(Number(timeArr.pop()));
       instance.seconds(timeArr.length ? Number(timeArr.pop()) : 0);
       instance.milliseconds(timeArr.length ? Number(timeArr.pop()) : 0);
-    } else instance = moment2("error");
+    } else instance = moment3("error");
     return instance;
   })();
   if (isReturnAsMomentInstance) return momentInstance;
@@ -873,7 +962,7 @@ function transformDateOrTimeOrTogetherToFormattedLocal(data, outputFormat = "HH:
     outputFormat,
     compositeAdditional
   );
-  const dateWithLocale = date.add(moment2().utcOffset(), "minutes");
+  const dateWithLocale = date.add(moment3().utcOffset(), "minutes");
   const output = dateWithLocale.format(outputFormat);
   return output === ERROR_VALUE ? ERROR_MESSGE : output;
 }
@@ -1302,21 +1391,21 @@ var formatToHideValuePartially = (value, settings) => {
 };
 
 // src/Atomic/FormElements/Input/Input.tsx
-import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
 
 // src/Atomic/Layout/Spinner/Spinner.tsx
-import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
-import cn9 from "classnames";
+import { jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
+import cn10 from "classnames";
 var CN2 = "loader-box";
 var Spinner = ({ size = null, className, testId = CN2 }) => {
-  return /* @__PURE__ */ jsx9(
+  return /* @__PURE__ */ jsx10(
     "div",
     {
       role: "status",
       "aria-live": "polite",
       "aria-busy": "true",
       "data-testid": testId,
-      className: cn9(
+      className: cn10(
         CN2,
         {
           j5: size !== "small",
@@ -1324,11 +1413,11 @@ var Spinner = ({ size = null, className, testId = CN2 }) => {
         },
         className
       ),
-      children: /* @__PURE__ */ jsxs8("div", { className: cn9("lds-ring", { [`lds-ring_${size}`]: size }), children: [
-        /* @__PURE__ */ jsx9("div", {}),
-        /* @__PURE__ */ jsx9("div", {}),
-        /* @__PURE__ */ jsx9("div", {}),
-        /* @__PURE__ */ jsx9("div", {})
+      children: /* @__PURE__ */ jsxs9("div", { className: cn10("lds-ring", { [`lds-ring_${size}`]: size }), children: [
+        /* @__PURE__ */ jsx10("div", {}),
+        /* @__PURE__ */ jsx10("div", {}),
+        /* @__PURE__ */ jsx10("div", {}),
+        /* @__PURE__ */ jsx10("div", {})
       ] })
     }
   );
@@ -1336,11 +1425,11 @@ var Spinner = ({ size = null, className, testId = CN2 }) => {
 var Spinner_default = Spinner;
 
 // src/Atomic/UI/DynamicIcon/DynamicIcon.tsx
-import { jsx as jsx10 } from "react/jsx-runtime";
-import { useEffect as useEffect3, useState as useState2 } from "react";
+import { jsx as jsx11 } from "react/jsx-runtime";
+import { useEffect as useEffect4, useState as useState3 } from "react";
 var DynamicIcon = ({ iconKey, ...props }) => {
-  const [Icon2, setIcon] = useState2(null);
-  useEffect3(() => {
+  const [Icon2, setIcon] = useState3(null);
+  useEffect4(() => {
     const fetchData = async () => {
       const FeatherIcons = await import("react-feather");
       const iconComponent = FeatherIcons[iconKey];
@@ -1348,21 +1437,21 @@ var DynamicIcon = ({ iconKey, ...props }) => {
     };
     fetchData();
   }, [iconKey]);
-  return Icon2 ? /* @__PURE__ */ jsx10(Icon2, { ...props }) : null;
+  return Icon2 ? /* @__PURE__ */ jsx11(Icon2, { ...props }) : null;
 };
 var DynamicIcon_default = DynamicIcon;
 
 // src/Atomic/FormElements/Input/hooks/useErrorBlink.ts
-import { useEffect as useEffect4, useState as useState3 } from "react";
+import { useEffect as useEffect5, useState as useState4 } from "react";
 var DEFAULT_BLINK_TIME = 100;
 function useErrorBlink({
   isUseErrorsBlink,
   blinkTime = DEFAULT_BLINK_TIME
 }) {
-  const [isAttemptToChange, setIsAttemptToChange] = useState3(false);
-  const [isToHighlightError, setIsToHighlightError] = useState3(false);
-  const [prevValue, setPreviousValue] = useState3("");
-  useEffect4(() => {
+  const [isAttemptToChange, setIsAttemptToChange] = useState4(false);
+  const [isToHighlightError, setIsToHighlightError] = useState4(false);
+  const [prevValue, setPreviousValue] = useState4("");
+  useEffect5(() => {
     if (!isAttemptToChange) return;
     let timerId = null;
     setIsToHighlightError(true);
@@ -1411,19 +1500,19 @@ function useErrorBlink({
 }
 
 // src/Atomic/FormElements/Input/hooks/useInputFocus.ts
-import { useEffect as useEffect5, useState as useState4 } from "react";
+import { useEffect as useEffect6, useState as useState5 } from "react";
 function useInputFocus({
   isSelect,
   isFocusDefault = false,
   onFocus = () => {
   }
 }) {
-  const [isFocused, setIsFocused] = useState4(false);
-  const [isEditing, setEditing] = useState4(false);
-  useEffect5(() => {
+  const [isFocused, setIsFocused] = useState5(false);
+  const [isEditing, setEditing] = useState5(false);
+  useEffect6(() => {
     setEditing(isSelect ?? false);
   }, [isSelect]);
-  useEffect5(() => {
+  useEffect6(() => {
     if (typeof isFocusDefault === "boolean") {
       setIsFocused(isFocusDefault);
       setEditing(isFocusDefault);
@@ -1447,9 +1536,9 @@ function useInputFocus({
 }
 
 // src/Atomic/FormElements/Input/hooks/useInputHover.ts
-import { useState as useState5 } from "react";
+import { useState as useState6 } from "react";
 function useInputHover() {
-  const [onInputHover, setOnInputHover] = useState5(false);
+  const [onInputHover, setOnInputHover] = useState6(false);
   const handleMouseEnter = () => setOnInputHover(true);
   const handleMouseLeave = () => setOnInputHover(false);
   return {
@@ -1613,7 +1702,7 @@ function useInputValueProcessing({
 }
 
 // src/Atomic/FormElements/Input/hooks/useKeyboardHandling.ts
-import { useState as useState6 } from "react";
+import { useState as useState7 } from "react";
 function useKeyboardHandling({
   onKeyDown,
   onKeyUp,
@@ -1621,7 +1710,7 @@ function useKeyboardHandling({
   setPreviousValue,
   value
 }) {
-  const [keyDownData, setKeyDownData] = useState6({
+  const [keyDownData, setKeyDownData] = useState7({
     start: null,
     end: null,
     keyCode: null
@@ -1648,14 +1737,14 @@ function useKeyboardHandling({
 }
 
 // src/Atomic/FormElements/Input/Input.tsx
-import cn10 from "classnames";
-import { useEffect as useEffect6, useMemo as useMemo2, useRef as useRef2 } from "react";
+import cn11 from "classnames";
+import { useEffect as useEffect7, useMemo as useMemo3, useRef as useRef2 } from "react";
 function defaultCallback() {
 }
 function Input({ ref, blurTrim, autocomplete = "off", isSelect, onChange = defaultCallback, onBlur = defaultCallback, onFocus = defaultCallback, onKeyUp = defaultCallback, onKeyDown = defaultCallback, isNotBlinkErrors, isPriceInput, onlyNumbers, disabled, withDelete, value, placeholder, className, type = "text", mask, maskChar, formatChars, error, icon, iconDynamicKey, iconDynamicProps = {}, symbolsLimit, blinkTime, isFocusDefault = false, isNotValidateASCII = false, isNumericMobileKeyboard = false, isCropFirstNool = false, testId = "input", action, isUseAutoSelect = true, isReadOnly = false, isLoading = false, name, fieldKey, id, attributesOfNativeInput = {} }) {
-  const DynamicIconComponent = iconDynamicKey && !icon ? /* @__PURE__ */ jsx11(DynamicIcon_default, { iconKey: iconDynamicKey, ...iconDynamicProps }) : null;
+  const DynamicIconComponent = iconDynamicKey && !icon ? /* @__PURE__ */ jsx12(DynamicIcon_default, { iconKey: iconDynamicKey, ...iconDynamicProps }) : null;
   const inputInnerRef = useRef2(null);
-  const inputRef = useMemo2(() => ref || inputInnerRef, [ref]);
+  const inputRef = useMemo3(() => ref || inputInnerRef, [ref]);
   const isUseErrorsBlink = !isNotBlinkErrors && !mask;
   const inputName = name || fieldKey || id;
   const {
@@ -1720,7 +1809,7 @@ function Input({ ref, blurTrim, autocomplete = "off", isSelect, onChange = defau
     setIsFocused(false);
     setEditing(false);
   };
-  useEffect6(() => {
+  useEffect7(() => {
     if (isEditing) inputRef?.current?.focus?.();
   }, [isEditing, isFocused]);
   const getInputType = () => {
@@ -1729,7 +1818,7 @@ function Input({ ref, blurTrim, autocomplete = "off", isSelect, onChange = defau
   };
   const uniProps = {
     name: inputName,
-    className: cn10("input", className, {
+    className: cn11("input", className, {
       "input--with-icon": icon,
       "input--with-delete": withDelete
     }),
@@ -1745,11 +1834,11 @@ function Input({ ref, blurTrim, autocomplete = "off", isSelect, onChange = defau
     ...maskChar ? { maskChar } : {},
     ...formatChars ? { formatChars } : {}
   };
-  return /* @__PURE__ */ jsxs9(
+  return /* @__PURE__ */ jsxs10(
     "div",
     {
       "data-testid": testId,
-      className: cn10(
+      className: cn11(
         `input__wrap`,
         { [`input__wrap_focus`]: isFocused },
         { [`input__wrap_error`]: error || isToHighlightError },
@@ -1758,7 +1847,7 @@ function Input({ ref, blurTrim, autocomplete = "off", isSelect, onChange = defau
       onMouseEnter: handleMouseEnter,
       onMouseLeave: handleMouseLeave,
       children: [
-        /* @__PURE__ */ jsx11(
+        /* @__PURE__ */ jsx12(
           "input",
           {
             readOnly: isReadOnly,
@@ -1780,14 +1869,14 @@ function Input({ ref, blurTrim, autocomplete = "off", isSelect, onChange = defau
         ),
         DynamicIconComponent ?? icon,
         action,
-        withDelete && onInputHover && /* @__PURE__ */ jsx11(
+        withDelete && onInputHover && /* @__PURE__ */ jsx12(
           "span",
           {
-            className: cn10(`input__close`, { hidden: !getSafelyValue(value) }),
+            className: cn11(`input__close`, { hidden: !getSafelyValue(value) }),
             onClick: handleToggleWithClear
           }
         ),
-        isLoading && /* @__PURE__ */ jsx11(Spinner_default, { size: "small" })
+        isLoading && /* @__PURE__ */ jsx12(Spinner_default, { size: "small" })
       ]
     }
   );
@@ -1795,8 +1884,8 @@ function Input({ ref, blurTrim, autocomplete = "off", isSelect, onChange = defau
 var Input_default = Input;
 
 // src/Atomic/FormElements/RadioInput/RadioInput.tsx
-import { jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
-import cn11 from "classnames";
+import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
+import cn12 from "classnames";
 var RC6 = "radio-input";
 var RadioInput = ({
   label,
@@ -1810,21 +1899,21 @@ var RadioInput = ({
   onChange,
   attributesOfNativeInput
 }) => {
-  return /* @__PURE__ */ jsxs10(
+  return /* @__PURE__ */ jsxs11(
     "label",
     {
       "data-testid": testId,
-      className: cn11(RC6, className, { [`${RC6}_disabled`]: disabled }),
+      className: cn12(RC6, className, { [`${RC6}_disabled`]: disabled }),
       htmlFor: id,
       children: [
-        /* @__PURE__ */ jsxs10(
+        /* @__PURE__ */ jsxs11(
           "div",
           {
-            className: cn11(`${RC6}__input`, {
+            className: cn12(`${RC6}__input`, {
               [`${RC6}__input--checked`]: checked === value
             }),
             children: [
-              /* @__PURE__ */ jsx12(
+              /* @__PURE__ */ jsx13(
                 "input",
                 {
                   id,
@@ -1838,11 +1927,11 @@ var RadioInput = ({
                   ...attributesOfNativeInput
                 }
               ),
-              /* @__PURE__ */ jsx12("div", { className: `${RC6}__mark` })
+              /* @__PURE__ */ jsx13("div", { className: `${RC6}__mark` })
             ]
           }
         ),
-        label && /* @__PURE__ */ jsx12("div", { className: `${RC6}__label`, children: label })
+        label && /* @__PURE__ */ jsx13("div", { className: `${RC6}__label`, children: label })
       ]
     }
   );
@@ -1850,18 +1939,18 @@ var RadioInput = ({
 var RadioInput_default = RadioInput;
 
 // src/Atomic/FormElements/Dropdown/components/DropdownLoader.js
-import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
-import React12 from "react";
+import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
+import React13 from "react";
 var DropdownLoader = function({ variant = "" }) {
-  return /* @__PURE__ */ jsx13("div", { className: "dropdown-loader-box j5", children: /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsx14("div", { className: "dropdown-loader-box j5", children: /* @__PURE__ */ jsxs12(
     "div",
     {
       className: `lds-ring${variant === "little" ? " lds-ring_little" : ""}`,
       children: [
-        /* @__PURE__ */ jsx13("div", {}),
-        /* @__PURE__ */ jsx13("div", {}),
-        /* @__PURE__ */ jsx13("div", {}),
-        /* @__PURE__ */ jsx13("div", {})
+        /* @__PURE__ */ jsx14("div", {}),
+        /* @__PURE__ */ jsx14("div", {}),
+        /* @__PURE__ */ jsx14("div", {}),
+        /* @__PURE__ */ jsx14("div", {})
       ]
     }
   ) });
@@ -1869,7 +1958,7 @@ var DropdownLoader = function({ variant = "" }) {
 var DropdownLoader_default = DropdownLoader;
 
 // src/Functions/useIsMobile/useIsMobile.ts
-import { useEffect as useEffect7, useState as useState7 } from "react";
+import { useEffect as useEffect8, useState as useState8 } from "react";
 function useIsMobile({ isWithoutWidthCheck = false } = {}) {
   const isIPad = () => {
     const ua = navigator.userAgent || navigator.vendor || window.opera;
@@ -1880,8 +1969,8 @@ function useIsMobile({ isWithoutWidthCheck = false } = {}) {
   const getIsMobile = () => {
     return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) || isIPad();
   };
-  const [isMobile, setIsMobile] = useState7(getIsMobile());
-  useEffect7(() => {
+  const [isMobile, setIsMobile] = useState8(getIsMobile());
+  useEffect8(() => {
     if (getIsMobile()) {
       setIsMobile(true);
     }
@@ -1969,59 +2058,59 @@ function getSortedOptions(data, sortAlphabetical = false) {
 }
 
 // src/Atomic/FormElements/Dropdown/useDropdown.tsx
-import { useMemo as useMemo3, useRef as useRef3, useState as useState8 } from "react";
+import { useMemo as useMemo4, useRef as useRef3, useState as useState9 } from "react";
 function useDropdown({ id, fieldKey, value, sortAlphabetical, withMobileLogic, options, minItemsForShowMobileSearch, isSearchable: isSearchableProp, isDoNotPullOutListOfMainContainer } = {}) {
   const { isMobile: isMobileProp } = useIsMobile_default2();
   const isMobile = isMobileProp && withMobileLogic;
-  const [dropdownId] = useState8(
+  const [dropdownId] = useState9(
     (id || fieldKey || Math.random().toString(16).slice(2)).toString()
   );
-  const [isOpen, setIsOpen] = useState8(false);
-  const [valueToApply, setValueToApplyState] = useState8(null);
+  const [isOpen, setIsOpen] = useState9(false);
+  const [valueToApply, setValueToApplyState] = useState9(null);
   const valueToApplyRef = useRef3(null);
   const setValueToApply = (value2) => {
     valueToApplyRef.current = value2;
     setValueToApplyState(value2);
   };
-  const [searchValue, setSearchValue] = useState8();
+  const [searchValue, setSearchValue] = useState9();
   const dropdownRef = useRef3(null);
   const dropdownListRef = useRef3(null);
   const dropdownFooterRef = useRef3(null);
   const dropdownListWrapperRef = useRef3(null);
   const searchInputRef = useRef3(null);
   const wrapperRef = useRef3(null);
-  const [initListHeight, setInitListHeight] = useState8(null);
-  const [isSearchChanged, setIsSearchChanged] = useState8(false);
-  const [isSearchInputFocused, setIsSearchInputFocused] = useState8(false);
-  const [isScrollableList, setIsScrollableList] = useState8(false);
-  const [isFixedMaxHeight, setIsFixedMaxHeight] = useState8(false);
-  const [scrollTop, setScrollTop] = useState8(0);
-  const [scrollHeight, setScrollHeight] = useState8(1);
-  const [maxListContainerHeight, setMaxListContainerHeight] = useState8(0);
-  const totalOptionsLength = useMemo3(() => options ? getTotalOptions(options) : 0, [options]);
-  const isSearchable = useMemo3(() => {
+  const [initListHeight, setInitListHeight] = useState9(null);
+  const [isSearchChanged, setIsSearchChanged] = useState9(false);
+  const [isSearchInputFocused, setIsSearchInputFocused] = useState9(false);
+  const [isScrollableList, setIsScrollableList] = useState9(false);
+  const [isFixedMaxHeight, setIsFixedMaxHeight] = useState9(false);
+  const [scrollTop, setScrollTop] = useState9(0);
+  const [scrollHeight, setScrollHeight] = useState9(1);
+  const [maxListContainerHeight, setMaxListContainerHeight] = useState9(0);
+  const totalOptionsLength = useMemo4(() => options ? getTotalOptions(options) : 0, [options]);
+  const isSearchable = useMemo4(() => {
     return isMobile ? totalOptionsLength > (minItemsForShowMobileSearch || MIN_ITEMS_FOR_SHOW_MOBILE_SEARCH) : isSearchableProp;
   }, [isMobile, isSearchableProp, totalOptionsLength, minItemsForShowMobileSearch, MIN_ITEMS_FOR_SHOW_MOBILE_SEARCH]);
-  const optionsWithOtherAtTheEnd = useMemo3(() => moveOtherToEnd(options ?? []), [options]);
-  const filteredGroups = useMemo3(() => optionsWithOtherAtTheEnd.map((item) => ({
+  const optionsWithOtherAtTheEnd = useMemo4(() => moveOtherToEnd(options ?? []), [options]);
+  const filteredGroups = useMemo4(() => optionsWithOtherAtTheEnd.map((item) => ({
     ...item,
     items: !isSearchable || !isSearchChanged ? item?.items : item.items?.slice().filter(
       (el) => el?.label?.toLowerCase().includes(searchValue?.toString()?.toLowerCase() || "") || !el?.value || el?.value === ""
     )
   })).filter((item) => (item.items?.length ?? 0) > 0), [optionsWithOtherAtTheEnd, searchValue, isSearchable, isSearchChanged]);
-  const filteredItems = useMemo3(() => optionsWithOtherAtTheEnd.filter((item) => !item.items?.length).filter((item) => {
+  const filteredItems = useMemo4(() => optionsWithOtherAtTheEnd.filter((item) => !item.items?.length).filter((item) => {
     if (!isSearchable || !isSearchChanged) return true;
     return item?.label?.toLowerCase().includes(searchValue?.toString()?.toLowerCase() || "") || !item?.value || item?.value === "";
   }), [optionsWithOtherAtTheEnd, searchValue, isSearchable, isSearchChanged]);
-  const filteredOptions = useMemo3(() => [...filteredItems, ...filteredGroups], [filteredItems, filteredGroups]);
-  const selectedLabel = useMemo3(() => options?.find((el) => el.value === value)?.label ?? options?.reduce(
+  const filteredOptions = useMemo4(() => [...filteredItems, ...filteredGroups], [filteredItems, filteredGroups]);
+  const selectedLabel = useMemo4(() => options?.find((el) => el.value === value)?.label ?? options?.reduce(
     (acc, item) => {
       if (!acc?.length) return item.items?.find((el) => el.value === value)?.label ?? "";
       return acc;
     },
     ""
   ), [options, value]);
-  const postfixText = useMemo3(() => selectedLabel && filteredOptions.find((option) => option.value === value)?.postfix || null, [selectedLabel, filteredOptions, value]);
+  const postfixText = useMemo4(() => selectedLabel && filteredOptions.find((option) => option.value === value)?.postfix || null, [selectedLabel, filteredOptions, value]);
   return {
     isMobile,
     dropdownId,
@@ -2071,12 +2160,12 @@ function useDropdown({ id, fieldKey, value, sortAlphabetical, withMobileLogic, o
 var useDropdown_default = useDropdown;
 
 // src/Atomic/FormElements/Dropdown/Dropdown.tsx
-import cn12 from "classnames";
+import cn13 from "classnames";
 import {
   useCallback,
-  useEffect as useEffect8,
+  useEffect as useEffect9,
   useLayoutEffect,
-  useMemo as useMemo4
+  useMemo as useMemo5
 } from "react";
 import { createPortal } from "react-dom";
 import { Check, ChevronDown, ChevronUp, Code, X } from "react-feather";
@@ -2328,16 +2417,16 @@ function Dropdown({
       options: getDependsTrigger ? newOptions : options
     };
   };
-  const modalBtnTrigger = useMemo4(() => entity && entity !== "" && typeof entity === "string", [entity]);
-  const depend = useMemo4(() => getDepends(modalBtnTrigger), [modalBtnTrigger, filteredOptions]);
+  const modalBtnTrigger = useMemo5(() => entity && entity !== "" && typeof entity === "string", [entity]);
+  const depend = useMemo5(() => getDepends(modalBtnTrigger), [modalBtnTrigger, filteredOptions]);
   const getMarkupForElement = (item, _index, optTestId) => {
-    return /* @__PURE__ */ jsxs12(
+    return /* @__PURE__ */ jsxs13(
       "button",
       {
         type: "button",
         "data-testid": `${testId}-${optTestId}-option`,
         onMouseDown: () => depend.onChange(item),
-        className: cn12(
+        className: cn13(
           `${RC7}__list-item`,
           {
             [`${RC7}__list-item_active`]: item.value === (valueToApply ?? value),
@@ -2347,19 +2436,19 @@ function Dropdown({
         ),
         value: item?.value,
         children: [
-          !isMobile && /* @__PURE__ */ jsx14(
+          !isMobile && /* @__PURE__ */ jsx15(
             "span",
             {
-              className: cn12(`${RC7}__active-icon`, {
+              className: cn13(`${RC7}__active-icon`, {
                 [`${RC7}__active-icon_active`]: item.value === value
               }),
-              children: /* @__PURE__ */ jsx14(Check, {})
+              children: /* @__PURE__ */ jsx15(Check, {})
             }
           ),
-          /* @__PURE__ */ jsx14(
+          /* @__PURE__ */ jsx15(
             "div",
             {
-              className: cn12(`${RC7}__list-item-label`, item.labelClassName || ""),
+              className: cn13(`${RC7}__list-item-label`, item.labelClassName || ""),
               dangerouslySetInnerHTML: {
                 __html: getPreparedOptionLabel2(
                   item.label,
@@ -2370,19 +2459,19 @@ function Dropdown({
             }
           ),
           item?.icon || "",
-          isMobile ? item?.customMobileIcon ?? /* @__PURE__ */ jsx14(RadioInput_default, { value: item.value, checked: valueToApply ?? value }) : ""
+          isMobile ? item?.customMobileIcon ?? /* @__PURE__ */ jsx15(RadioInput_default, { value: item.value, checked: valueToApply ?? value }) : ""
         ]
       },
       item.value?.toString()?.replace(/ /g, "_")
     );
   };
   const filteredOptionList = (filteredOption) => {
-    return (filteredOption.items?.length ?? 0) > 0 ? /* @__PURE__ */ jsxs12(
+    return (filteredOption.items?.length ?? 0) > 0 ? /* @__PURE__ */ jsxs13(
       "div",
       {
-        className: cn12(`${RC7}-group`, filteredOption.className),
+        className: cn13(`${RC7}-group`, filteredOption.className),
         children: [
-          /* @__PURE__ */ jsx14("div", { className: `${RC7}-group__name`, children: filteredOption.label }),
+          /* @__PURE__ */ jsx15("div", { className: `${RC7}-group__name`, children: filteredOption.label }),
           filteredOption.items?.map(
             (el, index) => getMarkupForElement(el, index, (el?.testId || index)?.toString())
           )
@@ -2392,44 +2481,44 @@ function Dropdown({
     ) : null;
   };
   const getListMarkUp = () => {
-    return /* @__PURE__ */ jsx14(
+    return /* @__PURE__ */ jsx15(
       "div",
       {
         "data-testid": `${testId}-container-wrapper`,
-        className: cn12(`${RC7}__container-wrapper`),
+        className: cn13(`${RC7}__container-wrapper`),
         ref: wrapperRef,
         onClick: isMobile ? onWrapperClick : () => {
         },
-        children: /* @__PURE__ */ jsxs12(
+        children: /* @__PURE__ */ jsxs13(
           "div",
           {
-            className: cn12(`${RC7}__list-wrapper`, {
+            className: cn13(`${RC7}__list-wrapper`, {
               [`${RC7}__list-wrapper--fixed-height`]: isFixedMaxHeight,
               [`${RC7}__list-wrapper--with-bottom-shadow`]: isScrollableList && isMobile && !footerContent,
               [`${RC7}__list-wrapper--with-bottom-shadow-hidden`]: scrollTop === scrollHeight && !footerContent
             }),
             ref: dropdownListWrapperRef,
             children: [
-              isMobile && /* @__PURE__ */ jsxs12(
+              isMobile && /* @__PURE__ */ jsxs13(
                 "div",
                 {
-                  className: cn12(`${RC7}__list-header`, {
+                  className: cn13(`${RC7}__list-header`, {
                     [`${RC7}__list-header-with-shadow`]: isScrollableList && isMobile,
                     [`${RC7}__list-header-with-shadow-hidden`]: scrollTop === 0
                   }),
                   children: [
-                    /* @__PURE__ */ jsxs12("div", { className: cn12(`${RC7}__list-header-row`), children: [
-                      /* @__PURE__ */ jsx14("div", { className: cn12(`${RC7}__list-label`), children: label }),
-                      /* @__PURE__ */ jsx14(
+                    /* @__PURE__ */ jsxs13("div", { className: cn13(`${RC7}__list-header-row`), children: [
+                      /* @__PURE__ */ jsx15("div", { className: cn13(`${RC7}__list-label`), children: label }),
+                      /* @__PURE__ */ jsx15(
                         "div",
                         {
-                          className: cn12(`${RC7}__list-close-icon`),
+                          className: cn13(`${RC7}__list-close-icon`),
                           onClick: onCancelClick,
-                          children: /* @__PURE__ */ jsx14(X, { onClick: onCancelClick })
+                          children: /* @__PURE__ */ jsx15(X, { onClick: onCancelClick })
                         }
                       )
                     ] }),
-                    isSearchable && /* @__PURE__ */ jsx14("div", { className: cn12(`${RC7}__list-header-row`), children: /* @__PURE__ */ jsx14(
+                    isSearchable && /* @__PURE__ */ jsx15("div", { className: cn13(`${RC7}__list-header-row`), children: /* @__PURE__ */ jsx15(
                       Input_default,
                       {
                         ref: searchInputRef,
@@ -2445,10 +2534,10 @@ function Dropdown({
                   ]
                 }
               ),
-              /* @__PURE__ */ jsxs12(
+              /* @__PURE__ */ jsxs13(
                 "div",
                 {
-                  className: cn12(`${RC7}__list`, {
+                  className: cn13(`${RC7}__list`, {
                     [`${RC7}__list-top`]: isListTop,
                     [`${RC7}__list--with-footer`]: footerContent
                   }),
@@ -2471,16 +2560,16 @@ function Dropdown({
                       }
                       return null;
                     }),
-                    !filteredItems?.length && !filteredGroups?.length && /* @__PURE__ */ jsx14("div", { className: `${RC7}__list-item ${RC7}__list-item--no-options`, children: noOptionsText }),
-                    disabled && isOpen && /* @__PURE__ */ jsx14(DropdownLoader_default, {})
+                    !filteredItems?.length && !filteredGroups?.length && /* @__PURE__ */ jsx15("div", { className: `${RC7}__list-item ${RC7}__list-item--no-options`, children: noOptionsText }),
+                    disabled && isOpen && /* @__PURE__ */ jsx15(DropdownLoader_default, {})
                   ]
                 }
               ),
-              footerContent && /* @__PURE__ */ jsx14(
+              footerContent && /* @__PURE__ */ jsx15(
                 "div",
                 {
                   ref: dropdownFooterRef,
-                  className: cn12(`${RC7}__footer`, {
+                  className: cn13(`${RC7}__footer`, {
                     [`${RC7}__footer-with-shadow`]: isMobile && isScrollableList,
                     [`${RC7}__footer-with-shadow-hidden`]: scrollTop === scrollHeight
                   }),
@@ -2498,7 +2587,7 @@ function Dropdown({
     if (!lc) return null;
     return createPortal(getListMarkUp(), lc);
   };
-  useEffect8(() => {
+  useEffect9(() => {
     document.addEventListener("click", handleClickOutside, true);
     return () => {
       getListContainer2()?.remove();
@@ -2506,7 +2595,7 @@ function Dropdown({
       document.removeEventListener("click", handleClickOutside, true);
     };
   }, []);
-  useEffect8(() => {
+  useEffect9(() => {
     if (!isDoNotPullOutListOfMainContainer || dropdownRef.current) {
       initListContainer();
       if (isDefaultOpened && !isMobile || isDefaultOpenedMobile) setIsOpen(true);
@@ -2543,7 +2632,7 @@ function Dropdown({
     isFixedMaxHeight,
     options
   ]);
-  useEffect8(() => {
+  useEffect9(() => {
     const fn = isOpen ? "addEventListener" : "removeEventListener";
     cancelButtonRef?.current?.[fn]("click", onCancelClick, true);
     applyButtonRef?.current?.[fn]("click", onApplyClick, true);
@@ -2559,7 +2648,7 @@ function Dropdown({
         removeEventListener("scroll", doScrollCallback);
     };
   }, [isOpen, dropdownListRef]);
-  useEffect8(() => {
+  useEffect9(() => {
     let timeout;
     if (!searchValue && isSearchInputFocused && !isMobile) {
       setSearchValue(selectedLabel);
@@ -2572,7 +2661,7 @@ function Dropdown({
       clearTimeout(timeout);
     };
   }, [isSearchInputFocused]);
-  useEffect8(() => {
+  useEffect9(() => {
     if (isOpen && !isSearchInputFocused && searchInputRef?.current && !isMobile)
       searchInputRef.current?.focus();
     if (isOpen) {
@@ -2589,7 +2678,7 @@ function Dropdown({
       setSearchValue(null);
     }
   }, [isOpen]);
-  useEffect8(() => {
+  useEffect9(() => {
     const dropdownListEl = getListContainer2()?.getElementsByClassName("dropdown__list")[0];
     if (!isMobile && dropdownListEl) {
       const handleWheel = (e) => {
@@ -2614,7 +2703,7 @@ function Dropdown({
     return () => {
     };
   }, [isOpen, isMobile, getListContainer2()]);
-  useEffect8(() => {
+  useEffect9(() => {
     if (isOpen && isMobile && dropdownListRef?.current && !searchValue) {
       setIsScrollableList(
         dropdownListRef?.current?.scrollHeight > dropdownListRef?.current?.clientHeight
@@ -2631,7 +2720,7 @@ function Dropdown({
     dropdownListRef?.current?.scrollHeight,
     dropdownListRef?.current?.clientHeight
   ]);
-  useEffect8(() => {
+  useEffect9(() => {
     const setScrollTopValue = (e) => {
       setScrollTop(Number.parseInt(e?.target?.scrollTop?.toString(), 10));
     };
@@ -2647,7 +2736,7 @@ function Dropdown({
       }
     };
   }, [isOpen, isMobile, dropdownListRef?.current]);
-  useEffect8(() => {
+  useEffect9(() => {
     if (dropdownListRef?.current) {
       setScrollHeight(
         Number.parseInt(
@@ -2658,10 +2747,10 @@ function Dropdown({
     }
   }, [scrollTop, dropdownListRef?.current]);
   if (!options) return null;
-  return /* @__PURE__ */ jsxs12(
+  return /* @__PURE__ */ jsxs13(
     "div",
     {
-      className: cn12(RC7, className, {
+      className: cn13(RC7, className, {
         disabled,
         [`${RC7}-mobile`]: isMobile,
         [`${RC7}--focused`]: isOpen && !isMobile,
@@ -2671,12 +2760,12 @@ function Dropdown({
       onKeyDown,
       onKeyUp,
       children: [
-        /* @__PURE__ */ jsx14(
+        /* @__PURE__ */ jsx15(
           "button",
           {
             type: "button",
             "data-testid": testId,
-            className: cn12(`${RC7}__trigger`, "input__wrap", {
+            className: cn13(`${RC7}__trigger`, "input__wrap", {
               [`${RC7}__trigger--with-actions`]: withActions,
               placeholder: value === null || value === void 0 || value === "",
               error
@@ -2685,8 +2774,8 @@ function Dropdown({
             onKeyDown,
             onKeyUp,
             tabIndex,
-            children: customTrigger || /* @__PURE__ */ jsxs12(Fragment, { children: [
-              isSearchable && !isMobile ? /* @__PURE__ */ jsx14(
+            children: customTrigger || /* @__PURE__ */ jsxs13(Fragment, { children: [
+              isSearchable && !isMobile ? /* @__PURE__ */ jsx15(
                 "input",
                 {
                   ref: searchInputRef,
@@ -2697,38 +2786,38 @@ function Dropdown({
                   onFocus: () => setIsSearchInputFocused(true),
                   onBlur: () => setIsSearchInputFocused(false)
                 }
-              ) : /* @__PURE__ */ jsxs12(Fragment, { children: [
-                /* @__PURE__ */ jsx14("span", { className: "text", children: selectedLabel || placeholder || "" }),
-                postfixText && /* @__PURE__ */ jsx14("span", { className: "dropdown__list-item-postfix", children: postfixText })
+              ) : /* @__PURE__ */ jsxs13(Fragment, { children: [
+                /* @__PURE__ */ jsx15("span", { className: "text", children: selectedLabel || placeholder || "" }),
+                postfixText && /* @__PURE__ */ jsx15("span", { className: "dropdown__list-item-postfix", children: postfixText })
               ] }),
-              /* @__PURE__ */ jsx14(
+              /* @__PURE__ */ jsx15(
                 "span",
                 {
-                  className: cn12(`${RC7}__arrow`, {
+                  className: cn13(`${RC7}__arrow`, {
                     [`${RC7}__arrow_active`]: isOpen
                   }),
                   onClick: toggleList,
-                  children: isMobile ? /* @__PURE__ */ jsx14(Code, { className: "mobile-icon" }) : isOpen ? /* @__PURE__ */ jsx14(ChevronUp, {}) : /* @__PURE__ */ jsx14(ChevronDown, {})
+                  children: isMobile ? /* @__PURE__ */ jsx15(Code, { className: "mobile-icon" }) : isOpen ? /* @__PURE__ */ jsx15(ChevronUp, {}) : /* @__PURE__ */ jsx15(ChevronDown, {})
                 }
               )
             ] })
           }
         ),
-        withActions && /* @__PURE__ */ jsxs12("div", { className: cn12(`${RC7}__actions`), children: [
-          /* @__PURE__ */ jsx14(
+        withActions && /* @__PURE__ */ jsxs13("div", { className: cn13(`${RC7}__actions`), children: [
+          /* @__PURE__ */ jsx15(
             "div",
             {
-              className: cn12(`${RC7}__actions-item`),
+              className: cn13(`${RC7}__actions-item`),
               onClick: onActionConfirmClick,
-              children: /* @__PURE__ */ jsx14(Check, {})
+              children: /* @__PURE__ */ jsx15(Check, {})
             }
           ),
-          /* @__PURE__ */ jsx14(
+          /* @__PURE__ */ jsx15(
             "div",
             {
-              className: cn12(`${RC7}__actions-item`),
+              className: cn13(`${RC7}__actions-item`),
               onClick: onActionCancelClick,
-              children: /* @__PURE__ */ jsx14(X, {})
+              children: /* @__PURE__ */ jsx15(X, {})
             }
           )
         ] }),
@@ -2740,15 +2829,15 @@ function Dropdown({
 var Dropdown_default = Dropdown;
 
 // src/Atomic/FormElements/Switcher/Switcher.tsx
-import { jsx as jsx20, jsxs as jsxs17 } from "react/jsx-runtime";
+import { jsx as jsx21, jsxs as jsxs18 } from "react/jsx-runtime";
 
 // src/Atomic/UI/Hint/Hint.tsx
-import { Fragment as Fragment2, jsx as jsx19, jsxs as jsxs16 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx20, jsxs as jsxs17 } from "react/jsx-runtime";
 
 // src/Molecular/CustomIcons/components/Check2.tsx
-import { jsx as jsx15 } from "react/jsx-runtime";
+import { jsx as jsx16 } from "react/jsx-runtime";
 function Check2(props) {
-  return /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsx16(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
@@ -2756,15 +2845,15 @@ function Check2(props) {
       height: 16,
       fill: "none",
       ...props,
-      children: /* @__PURE__ */ jsx15("path", { stroke: "#000", d: "M13.333 4 6 11.333 2.667 8" })
+      children: /* @__PURE__ */ jsx16("path", { stroke: "#000", d: "M13.333 4 6 11.333 2.667 8" })
     }
   );
 }
 
 // src/Molecular/CustomIcons/components/Email.tsx
-import { jsx as jsx16, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs14 } from "react/jsx-runtime";
 function Email(props) {
-  return /* @__PURE__ */ jsxs13(
+  return /* @__PURE__ */ jsxs14(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
@@ -2773,7 +2862,7 @@ function Email(props) {
       fill: "none",
       ...props,
       children: [
-        /* @__PURE__ */ jsxs13(
+        /* @__PURE__ */ jsxs14(
           "mask",
           {
             id: "a",
@@ -2783,27 +2872,27 @@ function Email(props) {
             y: 0,
             maskUnits: "userSpaceOnUse",
             children: [
-              /* @__PURE__ */ jsx16(
+              /* @__PURE__ */ jsx17(
                 "path",
                 {
                   stroke: "#000",
                   d: "M2.667 2.667h10.666c.734 0 1.334.6 1.334 1.333v8c0 .733-.6 1.333-1.334 1.333H2.667c-.734 0-1.334-.6-1.334-1.333V4c0-.733.6-1.333 1.334-1.333Z"
                 }
               ),
-              /* @__PURE__ */ jsx16("path", { stroke: "#000", d: "M14.667 4 8 8.667 1.333 4" })
+              /* @__PURE__ */ jsx17("path", { stroke: "#000", d: "M14.667 4 8 8.667 1.333 4" })
             ]
           }
         ),
-        /* @__PURE__ */ jsx16("g", { mask: "url(#a)", children: /* @__PURE__ */ jsx16("path", { fill: "#1F7499", d: "M0 0h16v16H0z" }) })
+        /* @__PURE__ */ jsx17("g", { mask: "url(#a)", children: /* @__PURE__ */ jsx17("path", { fill: "#1F7499", d: "M0 0h16v16H0z" }) })
       ]
     }
   );
 }
 
 // src/Molecular/CustomIcons/components/HelpCircleFilled.tsx
-import { jsx as jsx17, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx18, jsxs as jsxs15 } from "react/jsx-runtime";
 function HelpCircleFilled(props) {
-  return /* @__PURE__ */ jsxs14(
+  return /* @__PURE__ */ jsxs15(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
@@ -2812,14 +2901,14 @@ function HelpCircleFilled(props) {
       fill: "none",
       ...props,
       children: [
-        /* @__PURE__ */ jsx17(
+        /* @__PURE__ */ jsx18(
           "path",
           {
             fill: "#9AA0B9",
             d: "M8 14.667A6.667 6.667 0 1 0 8 1.333a6.667 6.667 0 0 0 0 13.334Z"
           }
         ),
-        /* @__PURE__ */ jsx17(
+        /* @__PURE__ */ jsx18(
           "path",
           {
             stroke: "#fff",
@@ -2832,9 +2921,9 @@ function HelpCircleFilled(props) {
 }
 
 // src/Molecular/CustomIcons/components/Phone.tsx
-import { jsx as jsx18, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx19, jsxs as jsxs16 } from "react/jsx-runtime";
 function Phone(props) {
-  return /* @__PURE__ */ jsxs15(
+  return /* @__PURE__ */ jsxs16(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
@@ -2843,7 +2932,7 @@ function Phone(props) {
       fill: "none",
       ...props,
       children: [
-        /* @__PURE__ */ jsx18(
+        /* @__PURE__ */ jsx19(
           "mask",
           {
             id: "a",
@@ -2852,7 +2941,7 @@ function Phone(props) {
             x: 0,
             y: 0,
             maskUnits: "userSpaceOnUse",
-            children: /* @__PURE__ */ jsx18(
+            children: /* @__PURE__ */ jsx19(
               "path",
               {
                 stroke: "#000",
@@ -2861,7 +2950,7 @@ function Phone(props) {
             )
           }
         ),
-        /* @__PURE__ */ jsx18("g", { mask: "url(#a)", children: /* @__PURE__ */ jsx18("path", { fill: "#1F7499", d: "M0 0h16v16H0z" }) })
+        /* @__PURE__ */ jsx19("g", { mask: "url(#a)", children: /* @__PURE__ */ jsx19("path", { fill: "#1F7499", d: "M0 0h16v16H0z" }) })
       ]
     }
   );
@@ -2910,8 +2999,8 @@ function HandleClickOutsideObj(id, setIsOpen) {
 }
 
 // src/Atomic/UI/Hint/Hint.tsx
-import cn13 from "classnames";
-import { useEffect as useEffect9, useRef as useRef4, useState as useState9 } from "react";
+import cn14 from "classnames";
+import { useEffect as useEffect10, useRef as useRef4, useState as useState10 } from "react";
 import { createPortal as createPortal2 } from "react-dom";
 import { AlertTriangle, HelpCircle } from "react-feather";
 var hintTimeoutMap = /* @__PURE__ */ new Map();
@@ -2940,12 +3029,12 @@ var Hint = ({
   isCloseOnChildrenClick = false
 }) => {
   const hintRef = useRef4(null);
-  const [hintId] = useState9(id ?? key ?? Math.random().toString(16).slice(2));
-  const [iAmOpenedOptions] = useState9({ ...I_AM_OPENED_EVENT_OPTIONS, detail: { hintId } });
-  const [isOpen, setIsOpen] = useState9(false);
-  const [isStyleComputed, setIsStyleComputed] = useState9(false);
-  const [handleScroll] = useState9(new HandleScrollObj(setIsOpen));
-  const [handleClickOutside] = useState9(new HandleClickOutsideObj(hintId, setIsOpen));
+  const [hintId] = useState10(id ?? key ?? Math.random().toString(16).slice(2));
+  const [iAmOpenedOptions] = useState10({ ...I_AM_OPENED_EVENT_OPTIONS, detail: { hintId } });
+  const [isOpen, setIsOpen] = useState10(false);
+  const [isStyleComputed, setIsStyleComputed] = useState10(false);
+  const [handleScroll] = useState10(new HandleScrollObj(setIsOpen));
+  const [handleClickOutside] = useState10(new HandleClickOutsideObj(hintId, setIsOpen));
   const isCallbackExist = typeof onClickCallback === "function";
   const handle = {
     onMouseEnter: () => {
@@ -2995,11 +3084,11 @@ var Hint = ({
     }
   };
   const getHintMarkUp = (className2) => {
-    return /* @__PURE__ */ jsxs16(
+    return /* @__PURE__ */ jsxs17(
       "div",
       {
         "data-testid": "test-hint-text",
-        className: cn13("hint__text", `hint__text_${side}`, `hint--${className2}__text`),
+        className: cn14("hint__text", `hint__text_${side}`, `hint--${className2}__text`),
         onMouseEnter: () => {
           if (isHoverableContent) isContentHoveredOuter = true;
         },
@@ -3007,7 +3096,7 @@ var Hint = ({
         onClick: handle.onClick,
         style: { visibility: isStyleComputed ? "visible" : "hidden" },
         children: [
-          isLoading && /* @__PURE__ */ jsx19(Spinner_default, { size: "small" }),
+          isLoading && /* @__PURE__ */ jsx20(Spinner_default, { size: "small" }),
           hint,
           children
         ]
@@ -3064,7 +3153,7 @@ var Hint = ({
     if (!hc) return null;
     return createPortal2(getHintMarkUp(className2), hc);
   };
-  useEffect9(() => {
+  useEffect10(() => {
     initHintContainer(hintId, hintContainer);
     const iAmOpenedCallback = (ev) => {
       const event = ev;
@@ -3090,7 +3179,7 @@ var Hint = ({
       }
     };
   }, []);
-  useEffect9(() => {
+  useEffect10(() => {
     setIsStyleComputed(false);
     setHintContainerStyles();
     onOpenChange?.(isOpen);
@@ -3109,8 +3198,8 @@ var Hint = ({
       }
     };
   }, [isOpen]);
-  return /* @__PURE__ */ jsxs16("div", { "data-testid": testId, className: cn13("hint", className), ref: hintRef, children: [
-    /* @__PURE__ */ jsxs16(
+  return /* @__PURE__ */ jsxs17("div", { "data-testid": testId, className: cn14("hint", className), ref: hintRef, children: [
+    /* @__PURE__ */ jsxs17(
       "button",
       {
         tabIndex: isAccessability ? 0 : -1,
@@ -3119,14 +3208,14 @@ var Hint = ({
         onClick: () => handleOpenType === "click" && (isCallbackExist ? onClickCallback?.() : setIsOpen(!isOpen)),
         onMouseEnter: handle.onMouseEnter,
         onMouseLeave: handle.onMouseLeave,
-        className: cn13("hint__button", { hint__button_active: isOpen }),
+        className: cn14("hint__button", { hint__button_active: isOpen }),
         children: [
-          icon || icon === null || /* @__PURE__ */ jsxs16(Fragment2, { children: [
-            variant === "outlined" && /* @__PURE__ */ jsx19(HelpCircle, { width: 16, height: 16, className: "hint__icon outlined" }),
-            variant === "filled" && /* @__PURE__ */ jsx19(HelpCircleFilled, { className: "hint__icon filled" }),
-            variant === "warning" && /* @__PURE__ */ jsx19(AlertTriangle, { className: "hint__icon", color: "#F06D8D", width: 16, height: 16 })
+          icon || icon === null || /* @__PURE__ */ jsxs17(Fragment2, { children: [
+            variant === "outlined" && /* @__PURE__ */ jsx20(HelpCircle, { width: 16, height: 16, className: "hint__icon outlined" }),
+            variant === "filled" && /* @__PURE__ */ jsx20(HelpCircleFilled, { className: "hint__icon filled" }),
+            variant === "warning" && /* @__PURE__ */ jsx20(AlertTriangle, { className: "hint__icon", color: "#F06D8D", width: 16, height: 16 })
           ] }),
-          label && /* @__PURE__ */ jsx19("span", { className: cn13("hint__label", { "color--primary": isOpen }), children: typeof label === "string" ? capitalized(label) : label })
+          label && /* @__PURE__ */ jsx20("span", { className: cn14("hint__label", { "color--primary": isOpen }), children: typeof label === "string" ? capitalized(label) : label })
         ]
       }
     ),
@@ -3136,7 +3225,7 @@ var Hint = ({
 var Hint_default = Hint;
 
 // src/Atomic/FormElements/Switcher/Switcher.tsx
-import cn14 from "classnames";
+import cn15 from "classnames";
 var RC8 = "switcher";
 var Switcher = ({
   label,
@@ -3149,34 +3238,34 @@ var Switcher = ({
   hintSide,
   testId = "switcher"
 }) => {
-  return /* @__PURE__ */ jsxs17(
+  return /* @__PURE__ */ jsxs18(
     "div",
     {
       "data-testid": testId,
-      className: cn14(RC8, className, { [`${RC8}_disabled`]: disabled }),
+      className: cn15(RC8, className, { [`${RC8}_disabled`]: disabled }),
       children: [
-        /* @__PURE__ */ jsxs17(
+        /* @__PURE__ */ jsxs18(
           "button",
           {
             type: "button",
             "data-testid": `${testId}-button`,
-            className: cn14(`${RC8}__button`),
+            className: cn15(`${RC8}__button`),
             disabled,
             onClick: (e) => onChange(!isActive, e),
             children: [
-              /* @__PURE__ */ jsx20(
+              /* @__PURE__ */ jsx21(
                 "div",
                 {
-                  className: cn14(`${RC8}__button-content`, {
+                  className: cn15(`${RC8}__button-content`, {
                     [`${RC8}__button-content_active`]: isActive
                   }),
-                  children: /* @__PURE__ */ jsx20("div", { className: `${RC8}__ball` })
+                  children: /* @__PURE__ */ jsx21("div", { className: `${RC8}__ball` })
                 }
               ),
-              label && /* @__PURE__ */ jsx20(
+              label && /* @__PURE__ */ jsx21(
                 "span",
                 {
-                  className: cn14(`${RC8}__label`, {
+                  className: cn15(`${RC8}__label`, {
                     [`${RC8}__label_bold`]: isLabelBold
                   }),
                   children: label
@@ -3185,102 +3274,13 @@ var Switcher = ({
             ]
           }
         ),
-        hint && /* @__PURE__ */ jsx20(Hint_default, { className: `${RC8}__hint`, hint, side: hintSide })
+        hint && /* @__PURE__ */ jsx21(Hint_default, { className: `${RC8}__hint`, hint, side: hintSide })
       ]
     }
   );
 };
 var Switcher_default = Switcher;
 
-// src/Atomic/FormElements/Datepicker/components/DatepickerCalendar.tsx
-import { jsx as jsx21, jsxs as jsxs18 } from "react/jsx-runtime";
-import cn15 from "classnames";
-import moment3 from "moment";
-import { useEffect as useEffect10, useMemo as useMemo5, useState as useState10 } from "react";
-import * as Icon from "react-feather";
-var DatepickerCalendar = ({
-  date,
-  setDate,
-  startDate,
-  endDate,
-  allowPrev = true,
-  allowNext = true,
-  onClick,
-  onHover,
-  startPrevDate,
-  endPrevDate,
-  limitRange
-}) => {
-  const [days, setDays] = useState10({});
-  const title = useMemo5(() => `${moment3(date).format("MMM")} ${moment3(date).format("YYYY")}`, [date]);
-  useEffect10(() => {
-    const result = {};
-    const day = moment3(date).startOf("month");
-    const daysInMonth = day.daysInMonth();
-    for (let d = 0; d < daysInMonth; d++) {
-      let week = day.week();
-      if (day.month() === 11 && week === 1) week = 53;
-      if (day.month() === 0 && week === 53) week = 0;
-      if (!result[week]) result[week] = {};
-      result[week][day.weekday()] = { date: day.toDate() };
-      day.add(1, "d");
-    }
-    setDays(result);
-  }, [date]);
-  const renderDay = (week, dayOfWeek) => {
-    const day = days[+week]?.[dayOfWeek];
-    const isFutureDay = day && moment3(day.date).isAfter(moment3(), "day");
-    const isPastDay = limitRange ? day && moment3(day.date).isBefore(moment3().subtract(limitRange, "days"), "day") : null;
-    const isRangeEnd = day && (moment3(day.date).isSame(startDate, "day") || moment3(day.date).isSame(moment3(endDate).subtract(1, "hour"), "day"));
-    const isRangeInside = day && startDate && endDate && moment3(day.date).isAfter(startDate, "day") && moment3(day.date).isBefore(moment3(endDate).subtract(1, "hour"), "day");
-    const isPrevRangeEnd = day && (moment3(day.date).isSame(startPrevDate, "day") || moment3(day.date).isSame(moment3(endPrevDate).subtract(1, "day"), "day"));
-    const isPrevRangeInside = day && startPrevDate && endPrevDate && moment3(day.date).isAfter(startPrevDate, "day") && moment3(day.date).isBefore(moment3(endPrevDate).subtract(1, "day"), "day");
-    const classNames2 = cn15(
-      "calendar__day",
-      { "calendar__day--clickable": day },
-      { "calendar__day--disabled": isFutureDay || isPastDay },
-      { "calendar__day--range-end": isRangeEnd },
-      { "calendar__day--range-inside": isRangeInside },
-      { "calendar__day--prev-range-end": isPrevRangeEnd },
-      { "calendar__day--prev-range-inside": isPrevRangeInside }
-    );
-    return /* @__PURE__ */ jsx21(
-      "div",
-      {
-        className: classNames2,
-        onClick: day && !isFutureDay ? () => onClick(day.date) : void 0,
-        onMouseOver: day && !isFutureDay ? () => onHover(day.date) : void 0,
-        onMouseLeave: () => onHover(null),
-        children: day && day.date.getDate()
-      },
-      `${week}_${dayOfWeek}`
-    );
-  };
-  const handlePrev = () => {
-    setDate(moment3(date).subtract(1, "month").toDate());
-  };
-  const handleNext = () => {
-    setDate(moment3(date).add(1, "month").toDate());
-  };
-  return /* @__PURE__ */ jsxs18("div", { className: "calendar", children: [
-    /* @__PURE__ */ jsxs18("div", { className: "calendar-header", children: [
-      /* @__PURE__ */ jsx21("div", { className: "calendar-header__prev", children: allowPrev && /* @__PURE__ */ jsx21("button", { type: "button", "data-testid": "datepicker-calendar-prev", onClick: handlePrev, "aria-label": "Previous month", children: /* @__PURE__ */ jsx21(Icon.ChevronLeft, { size: 16 }) }) }),
-      /* @__PURE__ */ jsx21("div", { className: "calendar-header__title", children: title }),
-      /* @__PURE__ */ jsx21("div", { className: "calendar-header__next", children: allowNext && /* @__PURE__ */ jsx21("button", { type: "button", "data-testid": "datepicker-calendar-next", onClick: handleNext, "aria-label": "Next month", children: /* @__PURE__ */ jsx21(Icon.ChevronRight, { size: 16 }) }) })
-    ] }),
-    /* @__PURE__ */ jsx21("div", { className: "calendar__week", children: Array.from({ length: 7 }, (_, dayOfWeek) => /* @__PURE__ */ jsx21(
-      "div",
-      {
-        className: "calendar__day calendar__day--title",
-        children: moment3().weekday(dayOfWeek).format("dd").charAt(0)
-      },
-      `day-of-week_${dayOfWeek}`
-    )) }),
-    Object.keys(days).map((week, index) => /* @__PURE__ */ jsx21("div", { className: "calendar__week", children: Array.from({ length: 7 }, (_, dayOfWeek) => renderDay(week, dayOfWeek)) }, `week_${index}`))
-  ] });
-};
-var DatepickerCalendar_default = DatepickerCalendar;
-
 // src/Atomic/FormElements/Datepicker/Datepicker.tsx
 import cn16 from "classnames";
 import moment4 from "moment";
@@ -3608,6 +3608,9 @@ var Datepicker = ({
 };
 var Datepicker_default = Datepicker;
 
+// src/Atomic/FormElements/Dropdown/index.ts
+var Dropdown_default2 = Dropdown_default;
+
 // src/Atomic/FormElements/DropdownLiveSearch/DropdownLiveSearch.tsx
 import { jsx as jsx23, jsxs as jsxs20 } from "react/jsx-runtime";
 
@@ -5740,6 +5743,12 @@ var FormattedRawSSN = ({
 };
 var FormattedRawSSN_default = FormattedRawSSN;
 
+// src/Atomic/FormElements/FormattedRawSSN/index.ts
+var FormattedRawSSN_default2 = FormattedRawSSN_default;
+
+// src/Atomic/FormElements/Input/index.ts
+var Input_default2 = Input_default;
+
 // src/Atomic/FormElements/InputCalendar/InputCalendar.tsx
 import { jsx as jsx34, jsxs as jsxs31 } from "react/jsx-runtime";
 
@@ -5941,6 +5950,9 @@ var InputColor = ({
 };
 var InputColor_default = InputColor;
 
+// src/Atomic/FormElements/InputColor/index.ts
+var InputColor_default2 = InputColor_default;
+
 // src/Atomic/FormElements/InputCurrency/InputCurrency.tsx
 import { jsx as jsx36 } from "react/jsx-runtime";
 import cn29 from "classnames";
@@ -6094,196 +6106,92 @@ var InputCurrency = ({
 InputCurrency.displayName = "InputCurrency";
 var InputCurrency_default = InputCurrency;
 
-// src/Atomic/FormElements/InputDateRange/dependencies.ts
+// src/Atomic/FormElements/InputDateRange/components/DateInput.tsx
+import { jsx as jsx37 } from "react/jsx-runtime";
+
+// src/Functions/presets/mobileKeyboardTypesPresets.js
+var ALL_KEYBOARD_TYPES = {
+  numeric: { inputMode: "decimal" },
+  email: { inputMode: "email" }
+};
+var NUMERIC_KEYBOARD = {
+  attributesOfNativeInput: ALL_KEYBOARD_TYPES.numeric
+};
+var EMAIL_KEYBOARD = {
+  attributesOfNativeInput: ALL_KEYBOARD_TYPES.email
+};
+
+// src/Atomic/FormElements/InputDateRange/components/DateInput.tsx
+import cn30 from "classnames";
 import moment6 from "moment-timezone";
-import { useCallback as useCallback4, useEffect as useEffect22, useRef as useRef12, useState as useState23 } from "react";
-var getIsDateValid = (date) => moment6(date).isValid();
-function useClickOutside2(hideComponent, additionalComponent, onlyGetRef) {
-  const ref = useRef12(null);
-  const checkCondition = (target) => {
-    if (additionalComponent && additionalComponent?.length) {
-      return !ref.current?.contains(target) && !Array.from(additionalComponent)?.some((item) => item?.contains(target));
-    } else {
-      return !ref.current?.contains(target);
-    }
-  };
-  const handleClickOutside = useCallback4(
-    (e) => {
-      const target = e.target;
-      if (checkCondition(target)) hideComponent();
-    },
-    [hideComponent]
-  );
-  useEffect22(() => {
-    if (!onlyGetRef) {
-      document.addEventListener("mousedown", handleClickOutside, true);
-      return () => {
-        document.removeEventListener("mousedown", handleClickOutside, true);
-      };
-    }
-    return () => {
-    };
-  }, []);
-  return ref;
-}
-function useToggle(initialState) {
-  const [isToggled, setToggle] = useState23(Boolean(initialState));
-  const toggle = useCallback4(() => setToggle((isOn) => !isOn), []);
-  const toggleOn = useCallback4(() => setToggle(true), []);
-  const toggleOff = useCallback4(() => setToggle(false), []);
-  return {
-    isToggled,
-    toggle,
-    toggleOn,
-    toggleOff
-  };
+function handleDateInputOnChange(value) {
+  const replace = (val) => val?.replace(/[^0-9/]/g, "");
+  const input = replace(value);
+  const lastSymbol = input ? input.slice(-1) : "";
+  const previousValue = input ? input.slice(0, input.length - 1) : "";
+  if (value.length > 10 || lastSymbol === "/") return previousValue;
+  return previousValue.length === 2 || previousValue.length === 5 ? `${previousValue}/${lastSymbol}` : input;
 }
-var INTERVALS = {
-  today: {
-    label: "today",
-    start: () => moment6().startOf("day"),
-    end: () => moment6().add(1, "day").startOf("day")
-  },
-  yesterday: {
-    label: "yesterday",
-    start: () => moment6().subtract(1, "day").startOf("day"),
-    end: () => moment6().startOf("day")
-  },
-  thisWeek: {
-    label: "This Week",
-    start: () => moment6().startOf("week"),
-    end: () => moment6().add(1, "day").startOf("day")
-  },
-  lastWeek: {
-    label: "Last Week",
-    start: () => moment6().subtract(1, "week").startOf("week"),
-    end: () => moment6().startOf("week")
-  },
-  last7Days: {
-    label: "Last 7 Days",
-    start: () => moment6().subtract(6, "day").startOf("day"),
-    end: () => moment6().add(1, "day").startOf("day")
-  },
-  last14Days: {
-    label: "Last 14 Days",
-    start: () => moment6().subtract(13, "day").startOf("day"),
-    end: () => moment6().add(1, "day").startOf("day")
-  },
-  last30Days: {
-    label: "Last 30 Days",
-    start: () => moment6().subtract(29, "day").startOf("day"),
-    end: () => moment6().add(1, "day").startOf("day")
-  },
-  thisMonth: {
-    label: "This Month",
-    start: () => moment6().startOf("month"),
-    end: () => moment6().add(1, "day").startOf("day")
-  },
-  lastMonth: {
-    label: "Last Month",
-    start: () => moment6().subtract(1, "month").startOf("month"),
-    end: () => moment6().startOf("month")
-  },
-  last3Months: {
-    label: "Last 3 Months",
-    start: () => moment6().subtract(3, "month").startOf("month"),
-    end: () => moment6().startOf("month")
-  },
-  last6Months: {
-    label: "Last 6 Months",
-    start: () => moment6().subtract(6, "month").startOf("month"),
-    end: () => moment6().startOf("month")
-  },
-  sixMonths: {
-    label: "6 Months",
-    isHidden: true,
-    start: () => moment6().subtract(6, "month"),
-    end: () => moment6().add(1, "day").startOf("day")
-  },
-  thisYear: {
-    label: "This Year",
-    start: () => moment6().startOf("year"),
-    end: () => moment6().add(1, "day").startOf("day")
-  },
-  year: {
-    label: "Year",
-    isHidden: true,
-    start: () => moment6().subtract(1, "year"),
-    end: () => moment6().add(1, "day").startOf("day")
-  },
-  lastYear: {
-    label: "Last Year",
-    start: () => moment6().subtract(1, "year").startOf("year"),
-    end: () => moment6().startOf("year")
-  },
-  allTime: {
-    label: "All Time",
-    start: () => moment6("2022-01-01T00:00:00"),
-    end: () => moment6()
-    // start: () => null,
-    // end: () => null,
-  }
-};
-var ALL_TIME_KEY = "allTime";
-var CUSTOM_INTERVAL_KEY = "customDate";
-var CUSTOM_INTERVAL_KEY_TEXT = "Custom Date";
-var MAIN_FORMAT = "YYYY-MM-DDTHH:mm";
-var MAIN_DATE_FORMAT = "YYYY-MM-DD";
-var MAIN_TIME_FORMAT = "HH:mm";
-function getActualDateRange(inputDateRange) {
-  const getActualIntervalKey = () => {
-    if (inputDateRange?.intervalKey && Object.keys(INTERVALS).includes(inputDateRange.intervalKey)) {
-      return inputDateRange.intervalKey;
-    } else if (inputDateRange?.start && inputDateRange?.end) {
-      for (const [key, interval2] of Object.entries(INTERVALS)) {
-        if (moment6(inputDateRange.start).isSame(interval2.start()) && moment6(inputDateRange.end).isSame(interval2.end())) {
-          return key;
-        }
-      }
-      return CUSTOM_INTERVAL_KEY;
-    }
-    return ALL_TIME_KEY;
-  };
-  const getIntervalDate = (intervalKey) => {
-    if (intervalKey === ALL_TIME_KEY || intervalKey === CUSTOM_INTERVAL_KEY) {
-      return {
-        start: null,
-        end: null,
-        compare: inputDateRange?.compare,
-        startPrevDate: null,
-        endPrevDate: null
-      };
+function DateInput({ ref, ...props }) {
+  const {
+    RC: RC36,
+    className,
+    testId,
+    isFocused,
+    disabled,
+    value,
+    date,
+    prepareDate,
+    onChange,
+    onFocus,
+    onBlur,
+    onKeyUp
+  } = props;
+  const preparedDate = (() => {
+    const prepareDateDefault = (date2) => moment6(date2).format("MM/DD/YYYY");
+    const output = prepareDate?.(date) ?? prepareDateDefault(date);
+    return (output?.toString?.().toLowerCase() || "") !== "invalid date" ? output : "";
+  })();
+  return isFocused ? /* @__PURE__ */ jsx37(
+    Input_default,
+    {
+      ref,
+      testId,
+      className: cn30(className, `${RC36}-interactive`),
+      value,
+      disabled,
+      onChange: (value2) => onChange(handleDateInputOnChange(value2)),
+      onBlur,
+      onKeyUp,
+      ...NUMERIC_KEYBOARD
     }
-    const actualValues = {
-      start: INTERVALS[intervalKey]?.start()?.format(MAIN_FORMAT),
-      end: INTERVALS[intervalKey]?.end()?.format(MAIN_FORMAT),
-      compare: inputDateRange?.compare
-    };
-    if (actualValues.compare) {
-      const intervalHoursCount = moment6(actualValues.end).diff(
-        actualValues.start,
-        "hours"
-      );
-      actualValues.startPrevDate = moment6(actualValues.start).subtract(intervalHoursCount, "hours").toDate();
-      actualValues.endPrevDate = actualValues.start;
+  ) : /* @__PURE__ */ jsx37(
+    "div",
+    {
+      className: cn30(className, `${RC36}-emulation`, {
+        [`${RC36}-emulation_disabled`]: disabled
+      }),
+      onClick: disabled ? void 0 : onFocus,
+      children: /* @__PURE__ */ jsx37("span", { className: cn30(""), children: preparedDate })
     }
-    return actualValues;
-  };
-  const interval = getActualIntervalKey();
-  return interval !== CUSTOM_INTERVAL_KEY && interval !== ALL_TIME_KEY ? { intervalKey: interval, ...getIntervalDate(interval) } : { ...inputDateRange, intervalKey: interval };
+  );
 }
+var DateInput_default = DateInput;
 
-// src/Atomic/FormElements/InputDateRange/InputDateRange.tsx
-import { Fragment as Fragment11, jsx as jsx47, jsxs as jsxs40 } from "react/jsx-runtime";
+// src/Atomic/FormElements/InputDateRange/components/Datepicker.tsx
+import { Fragment as Fragment8, jsx as jsx40, jsxs as jsxs35 } from "react/jsx-runtime";
+
+// src/Atomic/FormElements/RangeCalendar/RangeCalendar.js
+import { jsx as jsx39, jsxs as jsxs34 } from "react/jsx-runtime";
 
 // src/Atomic/UI/Arrow/Arrow.tsx
-import { jsx as jsx37, jsxs as jsxs33 } from "react/jsx-runtime";
-import cn30 from "classnames";
-import { useEffect as useEffect23, useRef as useRef13, useState as useState24 } from "react";
+import { jsx as jsx38, jsxs as jsxs33 } from "react/jsx-runtime";
+import cn31 from "classnames";
+import { useEffect as useEffect22, useRef as useRef12, useState as useState23 } from "react";
 function Arrow({ type, className, onClick, disabled, testId, isAlt }) {
-  const ref = useRef13(null);
-  const [color, setColor] = useState24("currentColor");
-  useEffect23(() => {
+  const ref = useRef12(null);
+  const [color, setColor] = useState23("currentColor");
+  useEffect22(() => {
     if (ref.current) {
       setColor(getStyles(ref.current, "color"));
     }
@@ -6303,7 +6211,7 @@ function Arrow({ type, className, onClick, disabled, testId, isAlt }) {
             height: "16",
             viewBox: "0 0 16 16",
             children: [
-              /* @__PURE__ */ jsx37(
+              /* @__PURE__ */ jsx38(
                 "path",
                 {
                   d: "M12.7,8H3.3",
@@ -6314,7 +6222,7 @@ function Arrow({ type, className, onClick, disabled, testId, isAlt }) {
                   strokeLinejoin: "round"
                 }
               ),
-              /* @__PURE__ */ jsx37(
+              /* @__PURE__ */ jsx38(
                 "path",
                 {
                   d: "M8,3.3L3.3,8L8,12.7",
@@ -6329,7 +6237,7 @@ function Arrow({ type, className, onClick, disabled, testId, isAlt }) {
           }
         );
       }
-      return /* @__PURE__ */ jsx37(
+      return /* @__PURE__ */ jsx38(
         "svg",
         {
           "data-testid": testId,
@@ -6338,7 +6246,7 @@ function Arrow({ type, className, onClick, disabled, testId, isAlt }) {
           viewBox: "0 0 24 24",
           fill: "none",
           xmlns: "http://www.w3.org/2000/svg",
-          children: /* @__PURE__ */ jsx37(
+          children: /* @__PURE__ */ jsx38(
             "path",
             {
               d: "M15 18L9 12L15 6",
@@ -6362,7 +6270,7 @@ function Arrow({ type, className, onClick, disabled, testId, isAlt }) {
           height: "16",
           viewBox: "0 0 16 16",
           children: [
-            /* @__PURE__ */ jsx37(
+            /* @__PURE__ */ jsx38(
               "path",
               {
                 d: "M3.3,8h9.3",
@@ -6373,7 +6281,7 @@ function Arrow({ type, className, onClick, disabled, testId, isAlt }) {
                 strokeLinejoin: "round"
               }
             ),
-            /* @__PURE__ */ jsx37(
+            /* @__PURE__ */ jsx38(
               "path",
               {
                 d: "M8,3.3L12.7,8L8,12.7",
@@ -6388,7 +6296,7 @@ function Arrow({ type, className, onClick, disabled, testId, isAlt }) {
         }
       );
     }
-    return /* @__PURE__ */ jsx37(
+    return /* @__PURE__ */ jsx38(
       "svg",
       {
         "data-testid": testId,
@@ -6397,7 +6305,7 @@ function Arrow({ type, className, onClick, disabled, testId, isAlt }) {
         viewBox: "0 0 24 24",
         fill: "none",
         xmlns: "http://www.w3.org/2000/svg",
-        children: /* @__PURE__ */ jsx37(
+        children: /* @__PURE__ */ jsx38(
           "path",
           {
             d: "M9 18L15 12L9 6",
@@ -6410,12 +6318,12 @@ function Arrow({ type, className, onClick, disabled, testId, isAlt }) {
       }
     );
   }
-  return /* @__PURE__ */ jsx37(
+  return /* @__PURE__ */ jsx38(
     "div",
     {
       "data-testid": `arrow--key-${testId}--type-${type}`,
       ref,
-      className: cn30("arrow", `arrow_${type}`, className, {
+      className: cn31("arrow", `arrow_${type}`, className, {
         arrow_disabled: disabled
       }),
       onClick,
@@ -6425,1353 +6333,1456 @@ function Arrow({ type, className, onClick, disabled, testId, isAlt }) {
 }
 var Arrow_default = Arrow;
 
-// src/Atomic/FormElements/InputDateRange/components/OpenedPart.tsx
-import { Fragment as Fragment10, jsx as jsx46, jsxs as jsxs39 } from "react/jsx-runtime";
-
-// src/Functions/useResize.js
-import { useEffect as useEffect24, useLayoutEffect as useLayoutEffect3, useState as useState25 } from "react";
-var useResize = (element) => {
-  const [elemPosition, setElemPosition] = useState25("");
-  const onResize = (elemRightPosition) => {
-    if (elemRightPosition > document.documentElement.clientWidth) {
-      return setElemPosition("left");
-    } else setElemPosition("");
-  };
-  useEffect24(() => {
-    const elemRightPosition = element?.current?.getBoundingClientRect().right + 20;
-    window.addEventListener("resize", () => onResize(elemRightPosition));
-    return () => {
-      window.removeEventListener("resize", () => setElemPosition(""));
-    };
-  }, []);
-  useLayoutEffect3(() => {
-    const elemRightPosition = element?.current?.getBoundingClientRect().right + 20;
-    if (elemRightPosition > document.documentElement.clientWidth) {
-      return setElemPosition("left");
-    }
-  }, []);
-  return { elemPosition };
-};
-
-// src/Atomic/UI/Modal/Modal.tsx
-import { Fragment as Fragment8, jsx as jsx41, jsxs as jsxs35 } from "react/jsx-runtime";
-
-// src/Functions/useKeyPress/useKeyPress.ts
-import { useCallback as useCallback5, useEffect as useEffect25, useState as useState26 } from "react";
-function isISuspendProcessing(x) {
-  return getIsOnlyAnObject(x) && Object.values(x).every((v) => typeof v === "function");
-}
-function useKeyPress(targetKey, clamping = true, isForbidden, suspendProcessing) {
-  const [keyPressed, setKeyPressed] = useState26(false);
-  const safelySuspendProcessing = isISuspendProcessing(suspendProcessing) ? suspendProcessing : {};
-  const downHandler = useCallback5(
-    (event) => {
-      const { key, repeat, altKey, ctrlKey, shiftKey, metaKey } = event;
-      const isPressingWithoutAuxiliaryKeys = !altKey && !ctrlKey && !shiftKey && !metaKey;
-      if (key === targetKey && isPressingWithoutAuxiliaryKeys && !safelySuspendProcessing[key]?.(event)) {
-        if (!clamping && repeat) return;
-        setKeyPressed(true);
-      }
+// src/Atomic/FormElements/RangeCalendar/RangeCalendar.js
+import React34, { useEffect as useEffect23, useMemo as useMemo12, useState as useState24 } from "react";
+import cn32 from "classnames";
+import moment7 from "moment-timezone";
+var RangeCalendar = (props) => {
+  const {
+    className,
+    date,
+    setDate,
+    startDate,
+    endDate,
+    allowPrev = true,
+    allowNext = true,
+    onClick = () => {
     },
-    // ? Намерянно в зависимостях используем именно входной suspendProcessing,
-    // ? хоть в коде используем "безопасный"
-    [clamping, targetKey, suspendProcessing]
-  );
-  const upHandler = useCallback5(
-    (event) => {
-      const { key, repeat, altKey, ctrlKey, shiftKey, metaKey } = event;
-      const isPressingWithoutAuxiliaryKeys = !altKey && !ctrlKey && !shiftKey && !metaKey;
-      if (key === targetKey && isPressingWithoutAuxiliaryKeys && !safelySuspendProcessing[key]?.(event)) {
-        if (!clamping && repeat) return;
-        setKeyPressed(false);
-      }
+    onHover = () => {
     },
-    // ? Намерянно в зависимостях используем именно входной suspendProcessing,
-    // ? хоть в коде используем "безопасный"
-    [clamping, targetKey, suspendProcessing]
+    startPrevDate,
+    endPrevDate,
+    limitRange,
+    isShortWeekNames,
+    minDate,
+    maxDate,
+    momentMinDate,
+    momentMaxDate,
+    isDontLimitFuture,
+    testId = "range-calendar"
+  } = props;
+  const [days, setDays] = useState24({});
+  const title = useMemo12(
+    () => `${moment7(date).format("MMM")} ${moment7(date).format("YYYY")}`,
+    [date]
   );
-  useEffect25(
-    () => {
-      const handleDown = (event) => downHandler(event);
-      const handleUp = (event) => upHandler(event);
-      if (!isForbidden) {
-        window.addEventListener("keydown", handleDown);
-        window.addEventListener("keyup", handleUp);
+  useEffect23(() => {
+    const result = {};
+    const day = moment7(date).startOf("month");
+    const daysInMonth = day.daysInMonth();
+    for (let d = 0; d < daysInMonth; d += 1) {
+      let week = day.week();
+      if (day.month() === 11 && week === 1) week = 53;
+      if (day.month() === 0 && week === 53) week = 0;
+      if (!Object.prototype.hasOwnProperty.call(result, week)) {
+        result[week] = {};
       }
-      return () => {
-        window.removeEventListener("keydown", handleDown);
-        window.removeEventListener("keyup", handleUp);
-      };
-    },
-    // ? Намерянно в зависимостях используем именно входной suspendProcessing,
-    // ? хоть в коде используем "безопасный"
-    [downHandler, upHandler, isForbidden, suspendProcessing]
-  );
-  return keyPressed;
-}
-var useKeyPress_default = useKeyPress;
-
-// src/Functions/useKeyPress/useHandleKeyPress.ts
-import { useEffect as useEffect26 } from "react";
-function useHandleKeyPress({
-  escCallback,
-  enterCallback,
-  withClamping = true,
-  withEventManagementStructure,
-  suspendProcessing = null
-}) {
-  const { isWithSubmitAndCloseManagement } = withEventManagementStructure || {};
-  const isPressEnter = useKeyPress_default("Enter", withClamping, isWithSubmitAndCloseManagement, suspendProcessing);
-  const isPressEscape = useKeyPress_default("Escape", withClamping, isWithSubmitAndCloseManagement, suspendProcessing);
-  useEffect26(() => {
-    if (!isWithSubmitAndCloseManagement && isPressEscape && typeof escCallback === "function") {
-      escCallback();
-    }
-  }, [isPressEscape, escCallback]);
-  useEffect26(() => {
-    if (!isWithSubmitAndCloseManagement && isPressEnter && typeof enterCallback === "function") {
-      enterCallback();
+      result[week][day.weekday()] = { date: day.toDate() };
+      day.add(1, "d");
     }
-  }, [isPressEnter, enterCallback]);
-}
-var useHandleKeyPress_default = useHandleKeyPress;
-
-// src/Atomic/UI/Modal/partials/_constants.ts
-var DEFAULT_EVENT_OPTIONS = Object.freeze({
-  bubbles: true,
-  cancelable: true,
-  composed: false
-});
-var ModalEventsInnerKeys = /* @__PURE__ */ ((ModalEventsInnerKeys2) => {
-  ModalEventsInnerKeys2["iGotAnEnterKeyPress"] = "iGotAnEnterKeyPress";
-  ModalEventsInnerKeys2["iGotAnEscKeyPress"] = "iGotAnEscKeyPress";
-  return ModalEventsInnerKeys2;
-})(ModalEventsInnerKeys || {});
-var EVENTS = Object.freeze({
-  ["iGotAnEnterKeyPress" /* iGotAnEnterKeyPress */]: {
-    innerKey: "iGotAnEnterKeyPress" /* iGotAnEnterKeyPress */,
-    name: "modal:i-got-an-enter-key-press",
-    shortName: "enterIsPressed",
-    middlewareKey: "Enter",
-    options: DEFAULT_EVENT_OPTIONS
-  },
-  ["iGotAnEscKeyPress" /* iGotAnEscKeyPress */]: {
-    innerKey: "iGotAnEscKeyPress" /* iGotAnEscKeyPress */,
-    name: "modal:i-got-an-esc-key-press",
-    shortName: "escIsPressed",
-    middlewareKey: "Escape",
-    options: DEFAULT_EVENT_OPTIONS
-  }
-});
-
-// src/Atomic/UI/Modal/partials/_utils.ts
-function getWithEventManagementStructure(modalId, withEventManagement) {
-  const output = {
-    isWithSubmitAndCloseManagement: false
+    setDays(result);
+  }, [date]);
+  const renderDay = (week, dayOfWeek) => {
+    const day = days[week][dayOfWeek];
+    const isFutureDay = day && moment7(day.date).isAfter(moment7(), "day");
+    const isPastDay = limitRange ? day && moment7(day.date).isBefore(moment7().subtract(limitRange, "days"), "day") : null;
+    const isRangeStart = day && moment7(day.date).isSame(startDate, "day");
+    const isRangeEnd = day && moment7(day.date).isSame(moment7(endDate).subtract(1, "hour"), "day");
+    const isRangeInside = day && startDate && endDate && moment7(day.date).isAfter(startDate, "day") && moment7(day.date).isBefore(moment7(endDate).subtract(1, "hour"), "day");
+    const isPrevRangeEnd = day && (moment7(day.date).isSame(startPrevDate, "day") || moment7(day.date).isSame(moment7(endPrevDate).subtract(1, "day"), "day"));
+    const isPrevRangeInside = day && startPrevDate && endPrevDate && moment7(day.date).isAfter(startPrevDate, "day") && moment7(day.date).isBefore(moment7(endPrevDate).subtract(1, "day"), "day");
+    const classNames2 = cn32(
+      "range-calendar__day",
+      { "range-calendar__day--clickable": day },
+      {
+        "range-calendar__day--disabled": isPastDay || minDate && moment7(day?.date).isBefore(momentMinDate, "day") || !isDontLimitFuture && (maxDate ? moment7(day?.date).isAfter(momentMaxDate) : isFutureDay)
+      },
+      { "range-calendar__day--range-start": isRangeStart },
+      { "range-calendar__day--range-end": isRangeEnd },
+      { "range-calendar__day--range-inside": isRangeInside },
+      { "range-calendar__day--prev-range-end": isPrevRangeEnd },
+      { "range-calendar__day--prev-range-inside": isPrevRangeInside }
+    );
+    return /* @__PURE__ */ jsx39(
+      "div",
+      {
+        className: classNames2,
+        onClick: day ? (e) => onClick(day.date, e) : null,
+        onMouseOver: day ? () => onHover(day.date) : null,
+        onMouseLeave: () => onHover(null),
+        children: /* @__PURE__ */ jsx39("span", { className: "calendar__day-num", children: day && day.date.getDate() })
+      },
+      `${week}_${dayOfWeek}`
+    );
   };
-  for (const key in output) {
-    if (!modalId) {
-      output[key] = false;
-    } else {
-      output[key] = getIsOnlyAnObject(withEventManagement) ? withEventManagement[key] ?? false : !!withEventManagement;
-    }
-  }
-  return output;
-}
-function getOnKeyPress({
-  id: modalId,
-  onSubmit,
-  onClose,
-  suspendProcessing
-}) {
-  if (!modalId) return null;
-  return function onKeyPress(ev) {
-    const customEvent = ev;
-    const { id: eventId, realEvent } = customEvent.detail || {};
-    const constantInfoAboutCustomEvent = Object.values(EVENTS).find((ev2) => ev2.name === customEvent.type || ev2.shortName === customEvent.type) || {};
-    const middlewareKey = constantInfoAboutCustomEvent.middlewareKey || "incorrectKey";
-    const safelySuspendProcessing = isISuspendProcessing(suspendProcessing) ? suspendProcessing : {};
-    if (modalId && eventId && eventId === modalId && !safelySuspendProcessing[middlewareKey]?.(realEvent)) {
-      switch (customEvent.type) {
-        case EVENTS.iGotAnEnterKeyPress.name: {
-          onSubmit?.();
-          break;
-        }
-        case EVENTS.iGotAnEscKeyPress.name: {
-          onClose?.();
-          break;
+  const handlePrev = () => {
+    setDate(moment7(date).subtract(1, "month").toDate());
+  };
+  const handleNext = () => {
+    setDate(moment7(date).add(1, "month").toDate());
+  };
+  const getFormatedWeekName = (input) => isShortWeekNames ? input.charAt(0) : input;
+  return /* @__PURE__ */ jsxs34("div", { className: cn32("range-calendar", className), "data-testid": testId, children: [
+    /* @__PURE__ */ jsxs34("div", { className: "range-calendar-header", children: [
+      /* @__PURE__ */ jsx39(
+        Arrow_default,
+        {
+          type: "left",
+          disabled: !allowPrev || minDate && moment7(date).startOf("month").isSameOrBefore(momentMinDate, "months"),
+          onClick: handlePrev,
+          className: "range-calendar-header__prev"
         }
-        default: {
-          break;
+      ),
+      /* @__PURE__ */ jsx39("div", { className: "range-calendar-header__title", children: title }),
+      /* @__PURE__ */ jsx39(
+        Arrow_default,
+        {
+          type: "right",
+          disabled: !allowNext || !isDontLimitFuture && moment7(date).startOf("month").isSameOrAfter(
+            maxDate ? momentMaxDate : moment7().add(1, "day").startOf("day"),
+            "months"
+          ),
+          onClick: handleNext,
+          className: "range-calendar-header__next"
         }
-      }
+      )
+    ] }),
+    /* @__PURE__ */ jsx39("div", { className: "range-calendar__week range-calendar__week-title", children: [...Array(7).keys()].map((dayOfWeek) => {
+      return /* @__PURE__ */ jsx39(
+        "div",
+        {
+          className: "range-calendar__day range-calendar__day--title",
+          children: getFormatedWeekName(moment7().weekday(dayOfWeek).format("dd"))
+        },
+        `day-of-week_${dayOfWeek}`
+      );
+    }) }),
+    Object.keys(days).map((week, index) => /* @__PURE__ */ jsx39("div", { className: "range-calendar__week", children: [...Array(7).keys()].map((dayOfWeek) => renderDay(week, dayOfWeek)) }, `week_${index}`))
+  ] });
+};
+var RangeCalendar_default = RangeCalendar;
+
+// src/Atomic/FormElements/InputDateRange/dependencies.ts
+import moment8 from "moment-timezone";
+import { useCallback as useCallback4, useEffect as useEffect24, useRef as useRef13, useState as useState25 } from "react";
+var getIsDateValid = (date) => moment8(date).isValid();
+function useClickOutside2(hideComponent, additionalComponent, onlyGetRef) {
+  const ref = useRef13(null);
+  const checkCondition = (target) => {
+    if (additionalComponent && additionalComponent?.length) {
+      return !ref.current?.contains(target) && !Array.from(additionalComponent)?.some((item) => item?.contains(target));
+    } else {
+      return !ref.current?.contains(target);
     }
   };
-}
-function dispatchEventForModalManagement(realEvent, nameOfCustomEvent, uniqueIdOfRecipient, target) {
-  const { repeat, altKey, ctrlKey, shiftKey, metaKey } = realEvent;
-  const isPressingWithoutAuxiliaryKeys = !altKey && !ctrlKey && !shiftKey && !metaKey;
-  if (!repeat && isPressingWithoutAuxiliaryKeys) {
-    const event = Object.values(EVENTS).find((ev) => ev.name === nameOfCustomEvent || ev.shortName === nameOfCustomEvent);
-    if (event && uniqueIdOfRecipient) {
-      (target ?? document).dispatchEvent(new CustomEvent(event.name, { ...event.options, detail: { id: uniqueIdOfRecipient, realEvent } }));
+  const handleClickOutside = useCallback4(
+    (e) => {
+      const target = e.target;
+      if (checkCondition(target)) hideComponent();
+    },
+    [hideComponent]
+  );
+  useEffect24(() => {
+    if (!onlyGetRef) {
+      document.addEventListener("mousedown", handleClickOutside, true);
+      return () => {
+        document.removeEventListener("mousedown", handleClickOutside, true);
+      };
     }
-  }
+    return () => {
+    };
+  }, []);
+  return ref;
 }
-
-// src/Atomic/UI/Modal/partials/ModalFooter.tsx
-import { jsx as jsx38 } from "react/jsx-runtime";
-import cn31 from "classnames";
-import { memo } from "react";
-var ModalFooter = memo(
-  ({ className = "", children, wrapperRef, testId = "modal-footer" }) => {
-    return /* @__PURE__ */ jsx38(
-      "footer",
-      {
-        "data-testid": testId,
-        ref: wrapperRef,
-        className: cn31("modal__footer", className),
-        role: "contentinfo",
-        "aria-label": "Modal footer",
-        children
-      }
-    );
-  }
-);
-ModalFooter.displayName = "ModalFooter";
-var ModalFooter_default = ModalFooter;
-
-// src/Atomic/UI/Modal/partials/ModalTitle.tsx
-import { jsx as jsx39, jsxs as jsxs34 } from "react/jsx-runtime";
-import cn32 from "classnames";
-import { memo as memo2, useLayoutEffect as useLayoutEffect4, useMemo as useMemo12, useRef as useRef14 } from "react";
-import { X as X5 } from "react-feather";
-var ModalTitle = memo2(
-  ({
-    variant = "primary",
-    children,
-    isForced = false,
-    onClose,
-    closeBtnDisable,
-    noHeaderCloseBtn = false,
-    className,
-    wrapperRef,
-    testId = "modal-title"
-  }) => {
-    const closeModalRef = useRef14(onClose);
-    const handleClick = useMemo12(() => () => closeModalRef.current?.(), []);
-    useLayoutEffect4(() => {
-      closeModalRef.current = closeBtnDisable ? void 0 : onClose;
-    }, [onClose, closeBtnDisable]);
-    return /* @__PURE__ */ jsxs34(
-      "header",
-      {
-        "data-testid": testId,
-        ref: wrapperRef,
-        className: cn32("modal__header", className, {
-          [`modal__header-${variant}`]: variant
-        }),
-        role: "banner",
-        "aria-label": "Modal header",
-        children: [
-          /* @__PURE__ */ jsx39(
-            "span",
-            {
-              className: cn32("modal__header-title", {
-                [`modal__header-${variant}-title`]: variant
-              }),
-              id: `${testId}-heading`,
-              children
-            }
-          ),
-          !isForced && /* @__PURE__ */ jsx39(
-            "button",
-            {
-              type: "button",
-              onClick: handleClick,
-              className: cn32("modal-close-icon-box", {
-                "modal-close-icon-box-primary": variant === "primary",
-                "modal-close-icon-box--hidden": noHeaderCloseBtn
-              }),
-              "aria-label": "Close modal",
-              title: "Close modal",
-              children: !noHeaderCloseBtn && /* @__PURE__ */ jsx39(X5, { className: "modal-close-icon", role: "img", "aria-hidden": "true" })
-            }
-          )
-        ]
-      }
-    );
+function useToggle(initialState) {
+  const [isToggled, setToggle] = useState25(Boolean(initialState));
+  const toggle = useCallback4(() => setToggle((isOn) => !isOn), []);
+  const toggleOn = useCallback4(() => setToggle(true), []);
+  const toggleOff = useCallback4(() => setToggle(false), []);
+  return {
+    isToggled,
+    toggle,
+    toggleOn,
+    toggleOff
+  };
+}
+var INTERVALS = {
+  today: {
+    label: "today",
+    start: () => moment8().startOf("day"),
+    end: () => moment8().add(1, "day").startOf("day")
+  },
+  yesterday: {
+    label: "yesterday",
+    start: () => moment8().subtract(1, "day").startOf("day"),
+    end: () => moment8().startOf("day")
+  },
+  thisWeek: {
+    label: "This Week",
+    start: () => moment8().startOf("week"),
+    end: () => moment8().add(1, "day").startOf("day")
+  },
+  lastWeek: {
+    label: "Last Week",
+    start: () => moment8().subtract(1, "week").startOf("week"),
+    end: () => moment8().startOf("week")
+  },
+  last7Days: {
+    label: "Last 7 Days",
+    start: () => moment8().subtract(6, "day").startOf("day"),
+    end: () => moment8().add(1, "day").startOf("day")
+  },
+  last14Days: {
+    label: "Last 14 Days",
+    start: () => moment8().subtract(13, "day").startOf("day"),
+    end: () => moment8().add(1, "day").startOf("day")
+  },
+  last30Days: {
+    label: "Last 30 Days",
+    start: () => moment8().subtract(29, "day").startOf("day"),
+    end: () => moment8().add(1, "day").startOf("day")
+  },
+  thisMonth: {
+    label: "This Month",
+    start: () => moment8().startOf("month"),
+    end: () => moment8().add(1, "day").startOf("day")
+  },
+  lastMonth: {
+    label: "Last Month",
+    start: () => moment8().subtract(1, "month").startOf("month"),
+    end: () => moment8().startOf("month")
+  },
+  last3Months: {
+    label: "Last 3 Months",
+    start: () => moment8().subtract(3, "month").startOf("month"),
+    end: () => moment8().startOf("month")
+  },
+  last6Months: {
+    label: "Last 6 Months",
+    start: () => moment8().subtract(6, "month").startOf("month"),
+    end: () => moment8().startOf("month")
+  },
+  sixMonths: {
+    label: "6 Months",
+    isHidden: true,
+    start: () => moment8().subtract(6, "month"),
+    end: () => moment8().add(1, "day").startOf("day")
+  },
+  thisYear: {
+    label: "This Year",
+    start: () => moment8().startOf("year"),
+    end: () => moment8().add(1, "day").startOf("day")
+  },
+  year: {
+    label: "Year",
+    isHidden: true,
+    start: () => moment8().subtract(1, "year"),
+    end: () => moment8().add(1, "day").startOf("day")
+  },
+  lastYear: {
+    label: "Last Year",
+    start: () => moment8().subtract(1, "year").startOf("year"),
+    end: () => moment8().startOf("year")
+  },
+  allTime: {
+    label: "All Time",
+    start: () => moment8("2022-01-01T00:00:00"),
+    end: () => moment8()
+    // start: () => null,
+    // end: () => null,
   }
-);
-ModalTitle.displayName = "ModalTitle";
-var ModalTitle_default = ModalTitle;
-
-// src/Atomic/UI/Modal/partials/useMobileModal.tsx
-import { jsx as jsx40 } from "react/jsx-runtime";
-import { useCallback as useCallback6, useEffect as useEffect27, useLayoutEffect as useLayoutEffect5, useRef as useRef15, useState as useState27 } from "react";
-var SCROLL_DIRECTION = {
-  UP: "up",
-  DOWN: "down"
 };
-function useMobileModal({
-  modalRef,
-  withMobileLogic = false,
-  withFixedFooter = false,
-  isOpen = false
-}) {
-  const modalMobileContainerRef = useRef15(null);
-  const modalMobileHeaderRef = useRef15(null);
-  const modalMobileFooterRef = useRef15(null);
-  const modalMobileBodyRef = useRef15(null);
-  const { isMobile } = useIsMobile_default();
-  const [modalHeight, setModalHeight] = useState27(0);
-  const [modalsLogic, setModalsLogic] = useState27({
-    IS_HEADER_HIDDEN: false,
-    IS_HEADER_STICKY: false,
-    IS_FOOTER_HIDDEN: false,
-    IS_FOOTER_STICKY: withFixedFooter
-  });
-  const [modalsLogicProps, setModalsLogicProps] = useState27({
-    headerHeight: 0,
-    footerHeight: 0
-  });
-  const [scrollDirection, setScrollDirection] = useState27(SCROLL_DIRECTION.UP);
-  const [scrollTopPrev, setScrollTopPrev] = useState27(0);
-  const [scrollTop, setScrollTop] = useState27(0);
-  const [scrollHeight, setScrollHeight] = useState27(1);
-  const [, setContainerScrollHeight] = useState27(1);
-  useLayoutEffect5(() => {
-    const el = modalMobileContainerRef?.current;
-    if (el) {
-      el.addEventListener("scroll", () => {
-        setScrollTop((scrollTop2) => {
-          if (scrollTop2 !== el.scrollTop) setScrollTopPrev(scrollTop2);
-          return el.scrollTop;
-        });
-      });
-    }
-  }, [modalMobileContainerRef?.current]);
-  useEffect27(() => {
-    setScrollDirection(
-      (prevScrollDirection) => scrollTop < scrollTopPrev ? SCROLL_DIRECTION.UP : scrollTop > scrollTopPrev ? SCROLL_DIRECTION.DOWN : prevScrollDirection
-    );
-  }, [scrollTop, scrollTopPrev]);
-  useLayoutEffect5(() => {
-    if (isOpen) {
-      const modalStyle = modalRef?.current ? modalRef?.current.style || window.getComputedStyle(modalRef?.current) : {};
-      const computedModalHeight = modalRef?.current ? modalHeight + Number.parseFloat(modalStyle?.marginTop || "0") : 0;
-      const windowHeight = document.documentElement.clientHeight || window.screen.availHeight || window.screen.height;
-      if (modalMobileContainerRef?.current) {
-        if (computedModalHeight <= windowHeight) {
-          modalMobileContainerRef.current.style.display = "flex";
-          modalMobileContainerRef.current.style.alignItems = "flex-end";
-        } else {
-          modalMobileContainerRef.current?.style?.removeProperty("display");
-          modalMobileContainerRef.current?.style?.removeProperty("align-items");
+var ALL_TIME_KEY = "allTime";
+var CUSTOM_INTERVAL_KEY = "customDate";
+var CUSTOM_INTERVAL_KEY_TEXT = "Custom Date";
+var MAIN_FORMAT = "YYYY-MM-DDTHH:mm";
+var MAIN_DATE_FORMAT = "YYYY-MM-DD";
+var MAIN_TIME_FORMAT = "HH:mm";
+function getActualDateRange(inputDateRange) {
+  const getActualIntervalKey = () => {
+    if (inputDateRange?.intervalKey && Object.keys(INTERVALS).includes(inputDateRange.intervalKey)) {
+      return inputDateRange.intervalKey;
+    } else if (inputDateRange?.start && inputDateRange?.end) {
+      for (const [key, interval2] of Object.entries(INTERVALS)) {
+        if (moment8(inputDateRange.start).isSame(interval2.start()) && moment8(inputDateRange.end).isSame(interval2.end())) {
+          return key;
         }
       }
+      return CUSTOM_INTERVAL_KEY;
     }
-  }, [modalsLogicProps, isOpen, isMobile, modalHeight]);
-  useLayoutEffect5(() => {
-    if (isMobile && isOpen) {
-      const newModalHeight = modalRef?.current?.getBoundingClientRect()?.height;
-      if (newModalHeight && modalHeight !== newModalHeight) {
-        setModalHeight(newModalHeight);
-      }
-    }
-  });
-  useEffect27(() => {
-    if (isMobile && withMobileLogic) {
-      const { footerHeight, headerHeight } = modalsLogicProps;
-      setModalsLogic((prevStickyLogic) => ({
-        IS_HEADER_HIDDEN: scrollDirection === SCROLL_DIRECTION.DOWN || scrollTop === 0,
-        IS_HEADER_STICKY: scrollDirection === SCROLL_DIRECTION.UP && scrollTop !== 0 && (scrollTop >= headerHeight || prevStickyLogic.IS_HEADER_STICKY),
-        IS_FOOTER_HIDDEN: !withFixedFooter && (scrollDirection === SCROLL_DIRECTION.UP || scrollHeight === Math.round(scrollTop)),
-        IS_FOOTER_STICKY: withFixedFooter && scrollHeight > 1 || scrollDirection === SCROLL_DIRECTION.DOWN && (scrollHeight - Math.round(scrollTop) >= footerHeight || prevStickyLogic.IS_FOOTER_STICKY)
-      }));
-    }
-  }, [
-    scrollTop,
-    scrollHeight,
-    isMobile,
-    withMobileLogic,
-    scrollDirection,
-    modalsLogicProps,
-    modalHeight,
-    window.innerHeight
-  ]);
-  useLayoutEffect5(() => {
-    if (modalMobileHeaderRef?.current?.getBoundingClientRect()?.height !== void 0) {
-      setModalsLogicProps((state) => ({
-        ...state,
-        headerHeight: modalMobileHeaderRef?.current?.getBoundingClientRect()?.height ?? 0
-      }));
-    }
-  }, [modalMobileHeaderRef?.current?.getBoundingClientRect()?.height]);
-  useLayoutEffect5(() => {
-    if (modalMobileFooterRef?.current?.getBoundingClientRect()?.height !== void 0) {
-      setModalsLogicProps((state) => ({
-        ...state,
-        footerHeight: modalMobileFooterRef?.current?.getBoundingClientRect()?.height ?? 0
-      }));
+    return ALL_TIME_KEY;
+  };
+  const getIntervalDate = (intervalKey) => {
+    if (intervalKey === ALL_TIME_KEY || intervalKey === CUSTOM_INTERVAL_KEY) {
+      return {
+        start: null,
+        end: null,
+        compare: inputDateRange?.compare,
+        startPrevDate: null,
+        endPrevDate: null
+      };
     }
-  }, [modalMobileFooterRef?.current?.getBoundingClientRect()?.height]);
-  useEffect27(() => {
-    if (modalMobileContainerRef?.current) {
-      setContainerScrollHeight(modalMobileContainerRef?.current?.scrollHeight);
-      setScrollHeight(
-        modalMobileContainerRef?.current?.scrollHeight - window.innerHeight
+    const actualValues = {
+      start: INTERVALS[intervalKey]?.start()?.format(MAIN_FORMAT),
+      end: INTERVALS[intervalKey]?.end()?.format(MAIN_FORMAT),
+      compare: inputDateRange?.compare
+    };
+    if (actualValues.compare) {
+      const intervalHoursCount = moment8(actualValues.end).diff(
+        actualValues.start,
+        "hours"
       );
+      actualValues.startPrevDate = moment8(actualValues.start).subtract(intervalHoursCount, "hours").toDate();
+      actualValues.endPrevDate = actualValues.start;
     }
-  }, [scrollTop, modalMobileContainerRef?.current, window.innerHeight]);
-  useEffect27(() => {
-    window.addEventListener("resize", () => {
-      setContainerScrollHeight((containerScrollHeight) => {
-        setScrollHeight(containerScrollHeight - window.innerHeight);
-        return containerScrollHeight;
-      });
-    });
-  }, []);
-  const renderModal = useCallback6(
-    (modal) => {
-      if (!isMobile || !withMobileLogic) return modal;
-      return /* @__PURE__ */ jsx40("div", { className: "modal-mobile-container", ref: modalMobileContainerRef, children: modal });
-    },
-    [isMobile, withMobileLogic]
-  );
-  return {
-    modalMobileContainerRef,
-    modalMobileHeaderRef,
-    modalMobileBodyRef,
-    modalMobileFooterRef,
-    MODALS_LOGIC: modalsLogic,
-    SCROLL_DIRECTION,
-    scrollTop,
-    scrollHeight,
-    renderModal,
-    isMobile
+    return actualValues;
   };
+  const interval = getActualIntervalKey();
+  return interval !== CUSTOM_INTERVAL_KEY && interval !== ALL_TIME_KEY ? { intervalKey: interval, ...getIntervalDate(interval) } : { ...inputDateRange, intervalKey: interval };
 }
 
-// src/Atomic/UI/Modal/Modal.tsx
+// src/Atomic/FormElements/InputDateRange/components/Datepicker.tsx
 import cn33 from "classnames";
-import { useEffect as useEffect28, useLayoutEffect as useLayoutEffect6, useMemo as useMemo13, useRef as useRef16 } from "react";
-var attrsForModalBodyDefault = {};
-var KEY_CODE = Object.freeze({
-  ENTER: 13,
-  ESC: 27
-});
-function renderModalTitle({
-  mode,
-  title,
-  onlyTitle
-}) {
-  if (mode && mode !== "default" && !onlyTitle) {
-    return `${mode[0].toUpperCase()}${mode.slice(1)} ${title}`;
-  }
-  return title;
-}
-function Modal({
-  ref,
-  id,
-  testId = "modal",
-  zIndex = 100,
-  isOpen,
-  onConfirm,
-  onDecline,
-  closeModal,
-  className,
-  variant = "primary",
-  size,
-  mode,
-  title,
-  onlyTitle,
-  atributesForModalBody = attrsForModalBodyDefault,
-  confirmBtnClassName,
-  confirmBtnLabel,
-  confirmBtnVariant = "primary",
-  confirmBtnDisable,
-  confirmBtnIcon,
-  isConfirmBtnIconPositionRight,
-  noConfirmBtn,
-  forced,
-  closeBtnClassName,
-  closeBtnText,
-  closeBtnVariant,
-  closeBtnDisable,
-  closeBtnIcon,
-  btnClassNames,
-  isCloseBtnIconPositionRight,
-  noCloseBtn,
-  noHeader,
-  noHeaderCloseBtn,
-  customHeader,
-  declineBtnDisable,
-  noFooter,
-  customFooter,
-  withFixedFooter,
-  leftContentOfFooter,
-  isSubmittingByEnter: isSubmittingByEnterOuter = true,
-  isClosingByEsc: isClosingByEscOuter = true,
-  withEventManagement = false,
-  submitOnEnter,
-  closeOnEsc,
-  withMobileLogic,
-  children
-}) {
-  const internalRef = useRef16(null);
-  const modalRef = ref || internalRef;
-  const onConfirmRef = useRef16(onConfirm);
-  const closeModalRef = useRef16(closeModal);
-  const onDeclineRef = useRef16(onDecline);
-  const isSubmittingByEnter = submitOnEnter === false ? false : isSubmittingByEnterOuter;
-  const isClosingByEsc = closeOnEsc === false ? false : isClosingByEscOuter;
-  const withEventManagementStructure = getWithEventManagementStructure(id, withEventManagement);
-  const isUseAutoBlockingForHandlers = withEventManagementStructure.isWithSubmitAndCloseManagement;
-  const isOnConfirmBlocked = typeof onConfirm === "function" && isUseAutoBlockingForHandlers && confirmBtnDisable;
-  const isCloseModalBlocked = typeof closeModal === "function" && isUseAutoBlockingForHandlers && closeBtnDisable;
-  const isOnDeclineBlocked = typeof onDecline === "function" && isUseAutoBlockingForHandlers && declineBtnDisable;
-  const {
-    modalMobileHeaderRef,
-    modalMobileBodyRef,
-    modalMobileFooterRef,
-    MODALS_LOGIC,
-    renderModal,
-    isMobile,
-    scrollTop,
-    scrollHeight
-  } = useMobileModal({
-    withMobileLogic,
-    withFixedFooter,
-    isOpen
-  });
-  const handle = useMemo13(() => ({
-    confirm: () => onConfirmRef.current?.(),
-    close: () => closeModalRef.current?.(),
-    decline: () => {
-      if (typeof onDeclineRef.current === "function") onDeclineRef.current();
-      else closeModalRef.current?.();
-    }
-  }), []);
-  const suspendProcessing = {
-    // FIN-12482
-    // ? Чтобы НЕ замыкать рефку на модалку в логике, чтобы потом поискать в контенте все текстэриа,
-    // ? чтобы оценить есть ли среди них сфокусированная - делаем элеГАнтно:
-    // ? оцениваем ev.target, и если target это текстэриа, то вот сейчас то она и сфокусирована,
-    // ? т.е нужно приостановить процессы связанные с нажатием enter.
-    Enter: (ev) => ev?.target?.nodeName === "TEXTAREA"
-    // ? Колбеки опциональны, можно передавать только нужные
-    // Escape: (ev: globalThis.KeyboardEvent) => false,
-  };
-  useHandleKeyPress_default({
-    enterCallback: isSubmittingByEnter && typeof onConfirm === "function" && !confirmBtnDisable ? handle.confirm : void 0,
-    escCallback: isClosingByEsc && typeof closeModal === "function" ? handle.close : void 0,
-    withClamping: false,
-    withEventManagementStructure: {
-      isWithSubmitAndCloseManagement: confirmBtnDisable || withEventManagementStructure.isWithSubmitAndCloseManagement
-    },
-    suspendProcessing
-  });
-  useLayoutEffect6(() => {
-    onConfirmRef.current = isOnConfirmBlocked ? void 0 : onConfirm;
-  }, [onConfirm, isOnConfirmBlocked]);
-  useLayoutEffect6(() => {
-    closeModalRef.current = isCloseModalBlocked ? void 0 : closeModal;
-  }, [closeModal, isCloseModalBlocked]);
-  useLayoutEffect6(() => {
-    onDeclineRef.current = isOnDeclineBlocked ? () => {
-    } : onDecline;
-  }, [onDecline, isOnDeclineBlocked]);
-  useEffect28(() => {
-    const outerTarget = getIsOnlyAnObject(withEventManagement) ? withEventManagement.listenersTarget : void 0;
-    const target = outerTarget ?? document;
-    const onKeyPress = getOnKeyPress({ id, onSubmit: handle.confirm, onClose: handle.close, suspendProcessing });
-    if (withEventManagementStructure.isWithSubmitAndCloseManagement && !!onKeyPress) {
-      if (isSubmittingByEnter) target.addEventListener(EVENTS.iGotAnEnterKeyPress.name, onKeyPress);
-      if (isClosingByEsc) target.addEventListener(EVENTS.iGotAnEscKeyPress.name, onKeyPress);
-    }
-    return () => {
-      if (withEventManagementStructure.isWithSubmitAndCloseManagement && !!onKeyPress) {
-        if (isSubmittingByEnter) target.removeEventListener(EVENTS.iGotAnEnterKeyPress.name, onKeyPress);
-        if (isClosingByEsc) target.removeEventListener(EVENTS.iGotAnEscKeyPress.name, onKeyPress);
-      }
-    };
-  }, []);
-  if (!isOpen) return null;
-  return /* @__PURE__ */ jsx41(
-    "div",
-    {
-      id: `${id}`,
-      style: { zIndex },
-      "data-testid": testId,
-      className: "modal-box j5",
-      role: "dialog",
-      "aria-modal": "true",
-      "aria-labelledby": `${testId}-title`,
-      children: renderModal(
-        /* @__PURE__ */ jsxs35(Fragment8, { children: [
-          /* @__PURE__ */ jsx41(
-            "div",
-            {
-              "data-testid": `${testId}-overlay`,
-              className: isOpen ? "modal-overlay" : "hidden",
-              onClick: handle.close,
-              role: "presentation"
-            }
-          ),
-          /* @__PURE__ */ jsxs35(
-            "div",
-            {
-              ref: modalRef,
-              style: { width: typeof size === "number" ? `${size}px` : `${size?.replace("px", "")}px` },
-              className: cn33(className, {
-                "modal": isOpen,
-                "modal--no-header": isOpen && noHeader && !customHeader,
-                "modal-mobile": isOpen && isMobile,
-                "hidden": !isOpen
-              }),
-              children: [
-                customHeader || !noHeader && /* @__PURE__ */ jsx41(
-                  ModalTitle_default,
-                  {
-                    wrapperRef: modalMobileHeaderRef,
-                    className: cn33({
-                      "modal__header--hidden": MODALS_LOGIC.IS_HEADER_HIDDEN,
-                      "modal__header--sticky": !MODALS_LOGIC.IS_HEADER_HIDDEN && MODALS_LOGIC.IS_HEADER_STICKY
-                    }),
-                    variant,
-                    isForced: forced,
-                    onClose: handle.close,
-                    noHeaderCloseBtn,
-                    children: /* @__PURE__ */ jsx41("span", { id: `${testId}-title`, children: renderModalTitle({ mode, title, onlyTitle }) })
-                  }
-                ),
-                /* @__PURE__ */ jsx41(
-                  "div",
-                  {
-                    ...atributesForModalBody,
-                    ref: modalMobileBodyRef,
-                    className: cn33("modal__body", {
-                      "modal__body--no-footer": noFooter
-                    }),
-                    role: "document",
-                    children
-                  }
-                ),
-                (!noFooter || customFooter) && /* @__PURE__ */ jsx41(
-                  ModalFooter_default,
-                  {
-                    wrapperRef: modalMobileFooterRef,
-                    className: cn33({
-                      "modal__footer--hidden": MODALS_LOGIC.IS_FOOTER_HIDDEN,
-                      "modal__footer--sticky": !MODALS_LOGIC.IS_FOOTER_HIDDEN && MODALS_LOGIC.IS_FOOTER_STICKY && scrollTop !== scrollHeight,
-                      "modal__footer_with-left-content": leftContentOfFooter
-                    }),
-                    children: customFooter || /* @__PURE__ */ jsxs35(Fragment8, { children: [
-                      leftContentOfFooter,
-                      (!noCloseBtn || !noConfirmBtn) && /* @__PURE__ */ jsxs35("div", { className: "modal__buttons-block", children: [
-                        !noCloseBtn && /* @__PURE__ */ jsx41(
-                          Button_default,
-                          {
-                            testId: "modal",
-                            className: cn33(closeBtnClassName, btnClassNames),
-                            variant: closeBtnVariant || "dark-outline",
-                            onClick: handle.decline,
-                            label: closeBtnText || "Cancel",
-                            disabled: typeof onDecline === "function" ? declineBtnDisable : closeBtnDisable,
-                            icon: closeBtnIcon,
-                            isIconRight: isCloseBtnIconPositionRight,
-                            tabIndex: 1,
-                            "aria-label": "Close modal"
-                          }
-                        ),
-                        !noConfirmBtn && /* @__PURE__ */ jsx41(
-                          Button_default,
-                          {
-                            testId: "modal",
-                            onClick: handle.confirm,
-                            label: confirmBtnLabel || mode && mode?.[0].toUpperCase() + mode?.slice(1) || "Apply",
-                            className: cn33("ml5", confirmBtnClassName, btnClassNames),
-                            variant: confirmBtnVariant,
-                            disabled: confirmBtnDisable,
-                            icon: confirmBtnIcon,
-                            isIconRight: isConfirmBtnIconPositionRight,
-                            "aria-label": "Confirm modal"
-                          }
-                        )
-                      ] })
-                    ] })
-                  }
-                )
-              ]
-            }
-          )
-        ] })
-      )
-    }
-  );
+import moment9 from "moment-timezone";
+import { useEffect as useEffect25, useMemo as useMemo13, useRef as useRef14, useState as useState26 } from "react";
+var DATE_INPUT_FORMAT = "MM/DD/YYYY";
+function padTime2(time) {
+  return `${time.toString().padStart(2, "0")}:00`;
 }
-Modal.displayName = "Modal";
-var Modal_default = Modal;
-
-// src/Atomic/FormElements/InputDateRange/components/Datepicker.tsx
-import { Fragment as Fragment9, jsx as jsx44, jsxs as jsxs37 } from "react/jsx-runtime";
-
-// src/Atomic/FormElements/RangeCalendar/RangeCalendar.js
-import { jsx as jsx42, jsxs as jsxs36 } from "react/jsx-runtime";
-import React35, { useEffect as useEffect29, useMemo as useMemo14, useState as useState28 } from "react";
-import cn34 from "classnames";
-import moment7 from "moment-timezone";
-var RangeCalendar = (props) => {
+var Datepicker2 = (props) => {
   const {
+    txt,
     className,
-    date,
-    setDate,
-    startDate,
-    endDate,
-    allowPrev = true,
-    allowNext = true,
-    onClick = () => {
-    },
-    onHover = () => {
-    },
-    startPrevDate,
-    endPrevDate,
+    buttonsTypes = {},
+    values = {},
+    onChange,
+    onChangeMobile,
+    onChangeCompare,
+    onCancel,
+    getSelectedMode,
+    onChangeInterval,
+    isCompareHidden,
     limitRange,
+    setActiveInterval,
     isShortWeekNames,
     minDate,
     maxDate,
     momentMinDate,
     momentMaxDate,
     isDontLimitFuture,
-    testId = "range-calendar"
+    testId,
+    mainId,
+    withMobileLogic,
+    isDoNotPullOutListOfMainContainer
   } = props;
-  const [days, setDays] = useState28({});
-  const title = useMemo14(
-    () => `${moment7(date).format("MMM")} ${moment7(date).format("YYYY")}`,
-    [date]
+  const { start = null, end = null, compare: compare2 = false } = values;
+  const startDateInputRef = useRef14(null);
+  const endDateInputRef = useRef14(null);
+  const [startDate, setStartDate] = useState26(
+    getIsDateValid(start) ? moment9(start) : ""
   );
-  useEffect29(() => {
-    const result = {};
-    const day = moment7(date).startOf("month");
-    const daysInMonth = day.daysInMonth();
-    for (let d = 0; d < daysInMonth; d += 1) {
-      let week = day.week();
-      if (day.month() === 11 && week === 1) week = 53;
-      if (day.month() === 0 && week === 53) week = 0;
-      if (!Object.prototype.hasOwnProperty.call(result, week)) {
-        result[week] = {};
+  const [endDate, setEndDate] = useState26(
+    getIsDateValid(end) ? moment9(end) : ""
+  );
+  const dateInterval = getSelectedMode({ start: startDate, end: endDate });
+  const [startDateInput, setStartDateInput] = useState26(null);
+  const [endDateInput, setEndDateInput] = useState26(null);
+  const [isStartFocused, setIsStartFocused] = useState26(false);
+  const [isEndFocused, setIsEndFocused] = useState26(false);
+  const [startHour, setStartHour] = useState26(start ? moment9(start).hour() : 0);
+  const [endHour, setEndHour] = useState26(end ? moment9(end).hour() : 0);
+  const [isCompare, setIsCompare] = useState26(compare2);
+  const [date1, setDate1] = useState26(
+    start ? moment9(start) : moment9().subtract(1, "month")
+  );
+  const [date2, setDate2] = useState26(end ? moment9(end) : moment9());
+  const isNearby = useMemo13(
+    () => moment9(date2).subtract(1, "month").isSame(moment9(date1), "month"),
+    [date1, date2]
+  );
+  const isPreviousPeriodShowed = useMemo13(
+    () => isCompare && !isCompareHidden && startDate && endDate,
+    [startDate, endDate, isCompare]
+  );
+  const prevEndHour = useRef14(endHour);
+  const startPrevDate = useMemo13(() => {
+    if (isPreviousPeriodShowed) {
+      const intervalHoursCount = moment9(endDate).diff(startDate, "hours");
+      return moment9(startDate).subtract(intervalHoursCount, "hours").toDate();
+    } else {
+      return null;
+    }
+  }, [startDate, endDate, isCompare]);
+  const endPrevDate = useMemo13(() => {
+    if (isPreviousPeriodShowed) {
+      return startDate;
+    } else {
+      return null;
+    }
+  }, [startDate, endDate, isCompare]);
+  const title = useMemo13(() => {
+    if (isCompare && !isCompareHidden && startDate && endDate) {
+      return `${moment9(startPrevDate).format("ll")} (${moment9(startPrevDate).format(MAIN_TIME_FORMAT)}) - ${moment9(
+        endPrevDate
+      ).format("ll")} (${moment9(endPrevDate).format(MAIN_TIME_FORMAT)})`;
+    } else {
+      return "";
+    }
+  }, [startDate, endDate, isCompare]);
+  const subtractDay = (date) => endHour === 0 ? moment9(date).subtract(1, "days") : moment9(date);
+  const addDay = (date) => endHour === 0 ? moment9(date).add(1, "days") : moment9(date);
+  const getCorrectedDateForDateInput = (key, date) => {
+    if (key === "startDateInput") return moment9(date);
+    return subtractDay(moment9(date));
+  };
+  const setInterval2 = () => {
+    setActiveInterval?.(
+      getActualDateRange({ start: startDate, end: endDate }).intervalKey
+    );
+  };
+  const handleClick = (date) => {
+    prevEndHour.current = 0;
+    if (!startDate || startDate && endDate && !(moment9(startDate).add(1, "d").isSame(endDate, "day") && endHour === 0)) {
+      setStartDate(moment9(date).startOf("day"));
+      setEndDate(moment9(date).add(1, "d").startOf("day"));
+      setStartHour(0);
+      setEndHour(0);
+    } else if (moment9(date).isBefore(moment9(startDate), "day")) {
+      setEndDate(moment9(startDate).add(1, "d").startOf("day"));
+      setStartDate(moment9(date).set("hour", Number.parseInt(startHour.toString(), 10)));
+    } else if (moment9(date).isAfter(moment9(startDate), "day")) {
+      setEndDate(moment9(date).add(1, "d").startOf("day"));
+    }
+  };
+  const handleChangeStartHour = (val) => {
+    setStartHour(Number(val));
+    setStartDate(moment9(startDate || moment9()).set("hour", Number(val)));
+  };
+  const handleChangeEndHour = (val) => {
+    const newHour = Number(val);
+    setEndHour(newHour);
+    let newEndDate = moment9();
+    if (endDate) {
+      if (prevEndHour.current === 0 && newHour !== 0) {
+        newEndDate = moment9(endDate).subtract(1, "days");
+      } else if (prevEndHour.current !== 0 && newHour === 0) {
+        newEndDate = moment9(endDate).add(1, "days");
       }
-      result[week][day.weekday()] = { date: day.toDate() };
-      day.add(1, "d");
     }
-    setDays(result);
-  }, [date]);
-  const renderDay = (week, dayOfWeek) => {
-    const day = days[week][dayOfWeek];
-    const isFutureDay = day && moment7(day.date).isAfter(moment7(), "day");
-    const isPastDay = limitRange ? day && moment7(day.date).isBefore(moment7().subtract(limitRange, "days"), "day") : null;
-    const isRangeStart = day && moment7(day.date).isSame(startDate, "day");
-    const isRangeEnd = day && moment7(day.date).isSame(moment7(endDate).subtract(1, "hour"), "day");
-    const isRangeInside = day && startDate && endDate && moment7(day.date).isAfter(startDate, "day") && moment7(day.date).isBefore(moment7(endDate).subtract(1, "hour"), "day");
-    const isPrevRangeEnd = day && (moment7(day.date).isSame(startPrevDate, "day") || moment7(day.date).isSame(moment7(endPrevDate).subtract(1, "day"), "day"));
-    const isPrevRangeInside = day && startPrevDate && endPrevDate && moment7(day.date).isAfter(startPrevDate, "day") && moment7(day.date).isBefore(moment7(endPrevDate).subtract(1, "day"), "day");
-    const classNames2 = cn34(
-      "range-calendar__day",
-      { "range-calendar__day--clickable": day },
-      {
-        "range-calendar__day--disabled": isPastDay || minDate && moment7(day?.date).isBefore(momentMinDate, "day") || !isDontLimitFuture && (maxDate ? moment7(day?.date).isAfter(momentMaxDate) : isFutureDay)
-      },
-      { "range-calendar__day--range-start": isRangeStart },
-      { "range-calendar__day--range-end": isRangeEnd },
-      { "range-calendar__day--range-inside": isRangeInside },
-      { "range-calendar__day--prev-range-end": isPrevRangeEnd },
-      { "range-calendar__day--prev-range-inside": isPrevRangeInside }
+    prevEndHour.current = newHour;
+    setEndDate(moment9(newEndDate).set("hour", newHour));
+  };
+  const handleDateInputFocus = (key, e) => {
+    const changeFlag = key === "startDateInput" ? setIsStartFocused : setIsEndFocused;
+    const set = key === "startDateInput" ? setStartDateInput : setEndDateInput;
+    const date = key === "startDateInput" ? startDate : endDate;
+    changeFlag(true);
+    set(date ? getCorrectedDateForDateInput(key, date).format("L") : "");
+    setTimeout(() => {
+      const defaultTarget = key === "startDateInput" ? startDateInputRef.current : endDateInputRef.current;
+      const target = e?.target ?? defaultTarget;
+      target.select?.();
+    }, 0);
+  };
+  const doBlur = (type, e) => {
+    const executor = type === "startDateInput" ? setIsStartFocused : setIsEndFocused;
+    e.target.blur();
+    executor(false);
+  };
+  const processOverflow = (newDateAsString, valueForRollback, key) => {
+    const newDateAsMomentObj = moment9(newDateAsString, DATE_INPUT_FORMAT);
+    if (!newDateAsMomentObj.isValid()) {
+      return valueForRollback;
+    } else {
+      const beforeOfFuture = moment9().endOf("day");
+      const hour = key === "startDateInput" ? startHour : endHour;
+      let output;
+      if (minDate && newDateAsMomentObj.isBefore(momentMinDate)) {
+        output = momentMinDate;
+      } else if (maxDate && newDateAsMomentObj.isAfter(momentMaxDate)) {
+        output = momentMaxDate;
+      } else if (!isDontLimitFuture && newDateAsMomentObj.isAfter(beforeOfFuture)) {
+        output = beforeOfFuture.startOf("day");
+      } else {
+        output = newDateAsMomentObj;
+      }
+      if (key === "endDateInput") {
+        output = addDay(output);
+      }
+      return output.set("hour", Number.parseInt(hour.toString(), 10));
+    }
+  };
+  const handleDateInputBlur = (key, e) => {
+    const reserveValue = key === "startDateInput" ? startDateInput : endDateInput;
+    const valueForRollback = key === "startDateInput" ? startDate : endDate;
+    const execute = key === "startDateInput" ? setStartDate : setEndDate;
+    const executeForCalendar = key === "startDateInput" ? setDate1 : setDate2;
+    const prepareValueForCalendar = (newDate) => {
+      if (key === "endDateInput") return newDate;
+      return moment9(newDate).isSameOrAfter(moment9(date2), "month") ? moment9(date2).subtract(1, "month") : moment9(newDate);
+    };
+    const newDateValue = e?.target?.value ?? reserveValue;
+    const processedNewDate = processOverflow(
+      newDateValue,
+      valueForRollback,
+      key
     );
-    return /* @__PURE__ */ jsx42(
-      "div",
+    execute(processedNewDate);
+    executeForCalendar(prepareValueForCalendar(processedNewDate));
+    doBlur(key, e);
+  };
+  const handleKeyPressed = (code, e, type) => {
+    if (code === 13) {
+      const syntheticEvent = {
+        target: e.target,
+        relatedTarget: null
+      };
+      handleDateInputBlur(type, syntheticEvent);
+    }
+    if (code === 27) doBlur(type, e);
+  };
+  const getStartHourItems = () => [...Array.from({ length: 24 }).keys()].map((hour) => ({
+    label: padTime2(hour),
+    value: hour,
+    disabled: moment9(startDate).isSame(endDate, "day") && endHour <= hour
+  }));
+  const getEndHourItems = () => [...Array.from({ length: 24 }).keys()].map((hour) => ({
+    label: padTime2(hour + 1),
+    value: hour === 23 ? 0 : hour + 1,
+    disabled: (moment9(startDate).isSame(endDate, "day") || moment9(startDate).isSame(
+      moment9(endDate).subtract(1, "days"),
+      "day"
+    ) && endHour === 0) && hour < startHour
+  }));
+  const renderButtons = () => /* @__PURE__ */ jsxs35(Fragment8, { children: [
+    /* @__PURE__ */ jsx40(
+      Button_default,
       {
-        className: classNames2,
-        onClick: day ? (e) => onClick(day.date, e) : null,
-        onMouseOver: day ? () => onHover(day.date) : null,
-        onMouseLeave: () => onHover(null),
-        children: /* @__PURE__ */ jsx42("span", { className: "calendar__day-num", children: day && day.date.getDate() })
-      },
-      `${week}_${dayOfWeek}`
-    );
-  };
-  const handlePrev = () => {
-    setDate(moment7(date).subtract(1, "month").toDate());
-  };
-  const handleNext = () => {
-    setDate(moment7(date).add(1, "month").toDate());
+        className: "date-picker__button",
+        onClick: () => onCancel?.(),
+        variant: buttonsTypes?.cancel,
+        children: txt?.buttons?.cancel || "Cancel"
+      }
+    ),
+    /* @__PURE__ */ jsx40(
+      Button_default,
+      {
+        className: "date-picker__button",
+        variant: buttonsTypes?.apply,
+        disabled: !startDate || !endDate,
+        onClick: () => onChange?.({
+          start: moment9(startDate).format(MAIN_FORMAT),
+          end: moment9(endDate).format(MAIN_FORMAT),
+          startPrevDate: moment9(startPrevDate).format(MAIN_FORMAT),
+          endPrevDate: moment9(endPrevDate).format(MAIN_FORMAT),
+          compare: isCompare
+        }),
+        children: txt?.buttons?.apply || "apply"
+      }
+    )
+  ] });
+  const renderPreviousPeriod = () => /* @__PURE__ */ jsxs35(Fragment8, { children: [
+    txt?.labels?.previousPeriod || "",
+    ":",
+    " ",
+    /* @__PURE__ */ jsx40("span", { className: "date-picker__previous-period-interval", children: title })
+  ] });
+  useEffect25(() => {
+    if (moment9(startDate).isSameOrAfter(endDate)) {
+      setStartDate(moment9(endDate).subtract(1, "d"));
+      setDate1(moment9(endDate).subtract(1, "d"));
+    }
+  }, [startDate]);
+  useEffect25(() => {
+    if (moment9(endDate).isSameOrBefore(startDate)) {
+      setEndDate(moment9(startDate).add(1, "d"));
+      setDate2(moment9(startDate).add(1, "d"));
+    }
+  }, [endDate]);
+  useEffect25(() => {
+    if (moment9(startDate).isBefore(moment9(endDate), "month")) {
+      setDate1(moment9(startDate));
+      setDate2(moment9(endDate));
+    }
+    setInterval2();
+  }, [startDate, endDate]);
+  useEffect25(() => {
+    if (moment9(date1).isSameOrAfter(moment9(date2), "month") && !withMobileLogic) {
+      setDate1(moment9(date2).subtract(1, "month"));
+    }
+  }, [date1, date2]);
+  useEffect25(() => {
+    onChangeInterval(dateInterval);
+  }, [dateInterval]);
+  useEffect25(() => {
+    if (typeof onChangeMobile === "function") {
+      onChangeMobile({
+        start: moment9(startDate).format(MAIN_FORMAT),
+        end: moment9(endDate).format(MAIN_FORMAT),
+        startPrevDate: moment9(startPrevDate).format(MAIN_FORMAT),
+        endPrevDate: moment9(endPrevDate).format(MAIN_FORMAT),
+        compare: isCompare
+      });
+    }
+  }, [startDate, endDate, startPrevDate, endPrevDate, isCompare]);
+  const renderRowStart = () => {
+    return /* @__PURE__ */ jsxs35("div", { className: "date-picker__date-row", children: [
+      /* @__PURE__ */ jsx40(
+        DateInput_default,
+        {
+          ref: startDateInputRef,
+          testId: `datepicker-${testId}_start-date-input`,
+          RC: "date-picker__date-input",
+          className: cn33("date-picker__date-input"),
+          isFocused: isStartFocused,
+          value: startDateInput,
+          date: getCorrectedDateForDateInput("startDateInput", startDate),
+          disabled: !startDate,
+          onChange: setStartDateInput,
+          onFocus: (e) => handleDateInputFocus("startDateInput", e),
+          onBlur: (e) => handleDateInputBlur("startDateInput", e),
+          onKeyUp: (code, e) => handleKeyPressed(+code, e, "startDateInput")
+        }
+      ),
+      /* @__PURE__ */ jsx40(
+        Dropdown_default,
+        {
+          testId,
+          id: `datepicker-id-${mainId}_start-hour-select-input`,
+          className: cn33("date-picker__hour-select-input"),
+          onChange: (value) => handleChangeStartHour(value),
+          value: startHour,
+          options: getStartHourItems(),
+          disabled: !startDate,
+          isDoNotPullOutListOfMainContainer,
+          withMobileLogic
+        }
+      )
+    ] });
   };
-  const getFormatedWeekName = (input) => isShortWeekNames ? input.charAt(0) : input;
-  return /* @__PURE__ */ jsxs36("div", { className: cn34("range-calendar", className), "data-testid": testId, children: [
-    /* @__PURE__ */ jsxs36("div", { className: "range-calendar-header", children: [
-      /* @__PURE__ */ jsx42(
-        Arrow_default,
+  const renderRowEnd = () => {
+    return /* @__PURE__ */ jsxs35("div", { className: "date-picker__date-row", children: [
+      /* @__PURE__ */ jsx40(
+        DateInput_default,
         {
-          type: "left",
-          disabled: !allowPrev || minDate && moment7(date).startOf("month").isSameOrBefore(momentMinDate, "months"),
-          onClick: handlePrev,
-          className: "range-calendar-header__prev"
+          ref: endDateInputRef,
+          testId: `datepicker-${testId}_start-date-input`,
+          RC: "date-picker__date-input",
+          className: cn33("date-picker__date-input"),
+          isFocused: isEndFocused,
+          value: endDateInput,
+          date: getCorrectedDateForDateInput("endDateInput", endDate),
+          disabled: !endDate,
+          onChange: setEndDateInput,
+          onFocus: (e) => handleDateInputFocus("endDateInput", e),
+          onBlur: (e) => handleDateInputBlur("endDateInput", e),
+          onKeyUp: (code, e) => handleKeyPressed(+code, e, "endDateInput")
         }
       ),
-      /* @__PURE__ */ jsx42("div", { className: "range-calendar-header__title", children: title }),
-      /* @__PURE__ */ jsx42(
-        Arrow_default,
+      /* @__PURE__ */ jsx40(
+        Dropdown_default,
         {
-          type: "right",
-          disabled: !allowNext || !isDontLimitFuture && moment7(date).startOf("month").isSameOrAfter(
-            maxDate ? momentMaxDate : moment7().add(1, "day").startOf("day"),
-            "months"
-          ),
-          onClick: handleNext,
-          className: "range-calendar-header__next"
+          testId,
+          id: `datepicker-id-${mainId}_end-hour-select-input`,
+          className: cn33("date-picker__hour-select-input"),
+          onChange: (value) => handleChangeEndHour(value),
+          value: endHour,
+          options: getEndHourItems(),
+          disabled: !endDate,
+          isDoNotPullOutListOfMainContainer,
+          withMobileLogic
         }
       )
-    ] }),
-    /* @__PURE__ */ jsx42("div", { className: "range-calendar__week range-calendar__week-title", children: [...Array(7).keys()].map((dayOfWeek) => {
-      return /* @__PURE__ */ jsx42(
+    ] });
+  };
+  const renderCalendarStart = () => {
+    return /* @__PURE__ */ jsx40(
+      RangeCalendar_default,
+      {
+        testId,
+        className: "date-picker__calendar",
+        date: date1,
+        setDate: setDate1,
+        allowNext: withMobileLogic ? !moment9(date1).startOf("month").isSameOrAfter(moment9().startOf("day"), "months") : !isNearby,
+        startDate,
+        endDate,
+        startPrevDate,
+        endPrevDate,
+        onClick: handleClick,
+        limitRange,
+        isShortWeekNames,
+        minDate,
+        maxDate,
+        momentMinDate,
+        momentMaxDate
+      }
+    );
+  };
+  const renderCalendarEnd = () => {
+    return /* @__PURE__ */ jsx40(
+      RangeCalendar_default,
+      {
+        className: "date-picker__calendar",
+        date: date2,
+        setDate: setDate2,
+        allowPrev: !isNearby,
+        startDate,
+        endDate,
+        startPrevDate,
+        endPrevDate,
+        onClick: handleClick,
+        isShortWeekNames,
+        minDate,
+        maxDate,
+        momentMinDate,
+        momentMaxDate,
+        isDontLimitFuture
+      }
+    );
+  };
+  const render = () => {
+    return /* @__PURE__ */ jsxs35("div", { className: cn33("date-picker", className), children: [
+      /* @__PURE__ */ jsxs35("div", { className: "date-picker__header", children: [
+        /* @__PURE__ */ jsxs35("div", { className: "date-picker__inputs-block", children: [
+          renderRowStart(),
+          /* @__PURE__ */ jsx40("div", { className: "date-picker__inputs-separator date-picker__header--gray", children: "\u2014" }),
+          renderRowEnd()
+        ] }),
+        isCompare && !isCompareHidden && startDate && endDate && /* @__PURE__ */ jsx40("div", { className: "date-picker__previous-period", children: renderPreviousPeriod() })
+      ] }),
+      /* @__PURE__ */ jsx40("div", { className: "date-picker__calendars", children: /* @__PURE__ */ jsxs35("div", { className: "date-picker__calendars-wrapper", children: [
+        renderCalendarStart(),
+        renderCalendarEnd()
+      ] }) }),
+      /* @__PURE__ */ jsxs35(
         "div",
         {
-          className: "range-calendar__day range-calendar__day--title",
-          children: getFormatedWeekName(moment7().weekday(dayOfWeek).format("dd"))
-        },
-        `day-of-week_${dayOfWeek}`
-      );
-    }) }),
-    Object.keys(days).map((week, index) => /* @__PURE__ */ jsx42("div", { className: "range-calendar__week", children: [...Array(7).keys()].map((dayOfWeek) => renderDay(week, dayOfWeek)) }, `week_${index}`))
-  ] });
+          className: cn33("date-picker__footer", {
+            "date-picker__footer_once-element": isCompareHidden
+          }),
+          children: [
+            !isCompareHidden ? /* @__PURE__ */ jsx40("div", { className: "date-picker__compare-block", children: /* @__PURE__ */ jsx40("div", { className: "mr5", children: /* @__PURE__ */ jsx40(
+              Switcher_default,
+              {
+                label: txt?.labels?.compare || "Compare",
+                isActive: isCompare,
+                onChange: () => {
+                  onChangeCompare?.(!isCompare);
+                  setIsCompare((state) => !state);
+                }
+              }
+            ) }) }) : /* @__PURE__ */ jsx40("div", {}),
+            /* @__PURE__ */ jsx40("div", { className: "date-picker__buttons-block", children: renderButtons() })
+          ]
+        }
+      )
+    ] });
+  };
+  const renderMobile = () => {
+    return /* @__PURE__ */ jsxs35("div", { className: cn33("date-picker", className), children: [
+      /* @__PURE__ */ jsxs35("div", { className: "date-picker__header", children: [
+        /* @__PURE__ */ jsxs35("div", { className: "date-picker__inputs-block", children: [
+          renderRowStart(),
+          /* @__PURE__ */ jsx40("div", { className: "date-picker__inputs-separator date-picker__header--gray", children: "\u2014" }),
+          renderRowEnd()
+        ] }),
+        isCompare && !isCompareHidden && startDate && endDate && /* @__PURE__ */ jsx40("div", { className: "date-picker__previous-period", children: renderPreviousPeriod() })
+      ] }),
+      /* @__PURE__ */ jsx40("div", { className: "date-picker__calendars", children: /* @__PURE__ */ jsx40("div", { className: "date-picker__calendars-wrapper", children: renderCalendarStart() }) })
+    ] });
+  };
+  return withMobileLogic ? renderMobile() : render();
 };
-var RangeCalendar_default = RangeCalendar;
+var Datepicker_default2 = Datepicker2;
 
-// src/Atomic/FormElements/InputDateRange/components/DateInput.tsx
-import { jsx as jsx43 } from "react/jsx-runtime";
+// src/Atomic/FormElements/InputDateRange/components/OpenedPart.tsx
+import { Fragment as Fragment10, jsx as jsx46, jsxs as jsxs39 } from "react/jsx-runtime";
 
-// src/Functions/presets/mobileKeyboardTypesPresets.js
-var ALL_KEYBOARD_TYPES = {
-  numeric: { inputMode: "decimal" },
-  email: { inputMode: "email" }
-};
-var NUMERIC_KEYBOARD = {
-  attributesOfNativeInput: ALL_KEYBOARD_TYPES.numeric
-};
-var EMAIL_KEYBOARD = {
-  attributesOfNativeInput: ALL_KEYBOARD_TYPES.email
+// src/Functions/useResize.js
+import { useEffect as useEffect26, useLayoutEffect as useLayoutEffect3, useState as useState27 } from "react";
+var useResize = (element) => {
+  const [elemPosition, setElemPosition] = useState27("");
+  const onResize = (elemRightPosition) => {
+    if (elemRightPosition > document.documentElement.clientWidth) {
+      return setElemPosition("left");
+    } else setElemPosition("");
+  };
+  useEffect26(() => {
+    const elemRightPosition = element?.current?.getBoundingClientRect().right + 20;
+    window.addEventListener("resize", () => onResize(elemRightPosition));
+    return () => {
+      window.removeEventListener("resize", () => setElemPosition(""));
+    };
+  }, []);
+  useLayoutEffect3(() => {
+    const elemRightPosition = element?.current?.getBoundingClientRect().right + 20;
+    if (elemRightPosition > document.documentElement.clientWidth) {
+      return setElemPosition("left");
+    }
+  }, []);
+  return { elemPosition };
 };
 
-// src/Atomic/FormElements/InputDateRange/components/DateInput.tsx
-import cn35 from "classnames";
-import moment8 from "moment-timezone";
-function handleDateInputOnChange(value) {
-  const replace = (val) => val?.replace(/[^0-9/]/g, "");
-  const input = replace(value);
-  const lastSymbol = input ? input.slice(-1) : "";
-  const previousValue = input ? input.slice(0, input.length - 1) : "";
-  if (value.length > 10 || lastSymbol === "/") return previousValue;
-  return previousValue.length === 2 || previousValue.length === 5 ? `${previousValue}/${lastSymbol}` : input;
-}
-function DateInput({ ref, ...props }) {
-  const {
-    RC: RC36,
-    className,
-    testId,
-    isFocused,
-    disabled,
-    value,
-    date,
-    prepareDate,
-    onChange,
-    onFocus,
-    onBlur,
-    onKeyUp
-  } = props;
-  const preparedDate = (() => {
-    const prepareDateDefault = (date2) => moment8(date2).format("MM/DD/YYYY");
-    const output = prepareDate?.(date) ?? prepareDateDefault(date);
-    return (output?.toString?.().toLowerCase() || "") !== "invalid date" ? output : "";
-  })();
-  return isFocused ? /* @__PURE__ */ jsx43(
-    Input_default,
-    {
-      ref,
-      testId,
-      className: cn35(className, `${RC36}-interactive`),
-      value,
-      disabled,
-      onChange: (value2) => onChange(handleDateInputOnChange(value2)),
-      onBlur,
-      onKeyUp,
-      ...NUMERIC_KEYBOARD
-    }
-  ) : /* @__PURE__ */ jsx43(
-    "div",
-    {
-      className: cn35(className, `${RC36}-emulation`, {
-        [`${RC36}-emulation_disabled`]: disabled
-      }),
-      onClick: disabled ? void 0 : onFocus,
-      children: /* @__PURE__ */ jsx43("span", { className: cn35(""), children: preparedDate })
-    }
-  );
-}
-var DateInput_default = DateInput;
+// src/Atomic/UI/Modal/Modal.tsx
+import { Fragment as Fragment9, jsx as jsx44, jsxs as jsxs37 } from "react/jsx-runtime";
 
-// src/Atomic/FormElements/InputDateRange/components/Datepicker.tsx
-import cn36 from "classnames";
-import moment9 from "moment-timezone";
-import { useEffect as useEffect30, useMemo as useMemo15, useRef as useRef17, useState as useState29 } from "react";
-var DATE_INPUT_FORMAT = "MM/DD/YYYY";
-function padTime2(time) {
-  return `${time.toString().padStart(2, "0")}:00`;
+// src/Functions/useKeyPress/useKeyPress.ts
+import { useCallback as useCallback5, useEffect as useEffect27, useState as useState28 } from "react";
+function isISuspendProcessing(x) {
+  return getIsOnlyAnObject(x) && Object.values(x).every((v) => typeof v === "function");
 }
-var Datepicker2 = (props) => {
-  const {
-    txt,
-    className,
-    buttonsTypes = {},
-    values = {},
-    onChange,
-    onChangeMobile,
-    onChangeCompare,
-    onCancel,
-    getSelectedMode,
-    onChangeInterval,
-    isCompareHidden,
-    limitRange,
-    setActiveInterval,
-    isShortWeekNames,
-    minDate,
-    maxDate,
-    momentMinDate,
-    momentMaxDate,
-    isDontLimitFuture,
-    testId,
-    mainId,
-    withMobileLogic,
-    isDoNotPullOutListOfMainContainer
-  } = props;
-  const { start = null, end = null, compare: compare2 = false } = values;
-  const startDateInputRef = useRef17(null);
-  const endDateInputRef = useRef17(null);
-  const [startDate, setStartDate] = useState29(
-    getIsDateValid(start) ? moment9(start) : ""
-  );
-  const [endDate, setEndDate] = useState29(
-    getIsDateValid(end) ? moment9(end) : ""
-  );
-  const dateInterval = getSelectedMode({ start: startDate, end: endDate });
-  const [startDateInput, setStartDateInput] = useState29(null);
-  const [endDateInput, setEndDateInput] = useState29(null);
-  const [isStartFocused, setIsStartFocused] = useState29(false);
-  const [isEndFocused, setIsEndFocused] = useState29(false);
-  const [startHour, setStartHour] = useState29(start ? moment9(start).hour() : 0);
-  const [endHour, setEndHour] = useState29(end ? moment9(end).hour() : 0);
-  const [isCompare, setIsCompare] = useState29(compare2);
-  const [date1, setDate1] = useState29(
-    start ? moment9(start) : moment9().subtract(1, "month")
+function useKeyPress(targetKey, clamping = true, isForbidden, suspendProcessing) {
+  const [keyPressed, setKeyPressed] = useState28(false);
+  const safelySuspendProcessing = isISuspendProcessing(suspendProcessing) ? suspendProcessing : {};
+  const downHandler = useCallback5(
+    (event) => {
+      const { key, repeat, altKey, ctrlKey, shiftKey, metaKey } = event;
+      const isPressingWithoutAuxiliaryKeys = !altKey && !ctrlKey && !shiftKey && !metaKey;
+      if (key === targetKey && isPressingWithoutAuxiliaryKeys && !safelySuspendProcessing[key]?.(event)) {
+        if (!clamping && repeat) return;
+        setKeyPressed(true);
+      }
+    },
+    // ? Намерянно в зависимостях используем именно входной suspendProcessing,
+    // ? хоть в коде используем "безопасный"
+    [clamping, targetKey, suspendProcessing]
   );
-  const [date2, setDate2] = useState29(end ? moment9(end) : moment9());
-  const isNearby = useMemo15(
-    () => moment9(date2).subtract(1, "month").isSame(moment9(date1), "month"),
-    [date1, date2]
+  const upHandler = useCallback5(
+    (event) => {
+      const { key, repeat, altKey, ctrlKey, shiftKey, metaKey } = event;
+      const isPressingWithoutAuxiliaryKeys = !altKey && !ctrlKey && !shiftKey && !metaKey;
+      if (key === targetKey && isPressingWithoutAuxiliaryKeys && !safelySuspendProcessing[key]?.(event)) {
+        if (!clamping && repeat) return;
+        setKeyPressed(false);
+      }
+    },
+    // ? Намерянно в зависимостях используем именно входной suspendProcessing,
+    // ? хоть в коде используем "безопасный"
+    [clamping, targetKey, suspendProcessing]
   );
-  const isPreviousPeriodShowed = useMemo15(
-    () => isCompare && !isCompareHidden && startDate && endDate,
-    [startDate, endDate, isCompare]
+  useEffect27(
+    () => {
+      const handleDown = (event) => downHandler(event);
+      const handleUp = (event) => upHandler(event);
+      if (!isForbidden) {
+        window.addEventListener("keydown", handleDown);
+        window.addEventListener("keyup", handleUp);
+      }
+      return () => {
+        window.removeEventListener("keydown", handleDown);
+        window.removeEventListener("keyup", handleUp);
+      };
+    },
+    // ? Намерянно в зависимостях используем именно входной suspendProcessing,
+    // ? хоть в коде используем "безопасный"
+    [downHandler, upHandler, isForbidden, suspendProcessing]
   );
-  const prevEndHour = useRef17(endHour);
-  const startPrevDate = useMemo15(() => {
-    if (isPreviousPeriodShowed) {
-      const intervalHoursCount = moment9(endDate).diff(startDate, "hours");
-      return moment9(startDate).subtract(intervalHoursCount, "hours").toDate();
-    } else {
-      return null;
-    }
-  }, [startDate, endDate, isCompare]);
-  const endPrevDate = useMemo15(() => {
-    if (isPreviousPeriodShowed) {
-      return startDate;
-    } else {
-      return null;
-    }
-  }, [startDate, endDate, isCompare]);
-  const title = useMemo15(() => {
-    if (isCompare && !isCompareHidden && startDate && endDate) {
-      return `${moment9(startPrevDate).format("ll")} (${moment9(startPrevDate).format(MAIN_TIME_FORMAT)}) - ${moment9(
-        endPrevDate
-      ).format("ll")} (${moment9(endPrevDate).format(MAIN_TIME_FORMAT)})`;
-    } else {
-      return "";
-    }
-  }, [startDate, endDate, isCompare]);
-  const subtractDay = (date) => endHour === 0 ? moment9(date).subtract(1, "days") : moment9(date);
-  const addDay = (date) => endHour === 0 ? moment9(date).add(1, "days") : moment9(date);
-  const getCorrectedDateForDateInput = (key, date) => {
-    if (key === "startDateInput") return moment9(date);
-    return subtractDay(moment9(date));
-  };
-  const setInterval2 = () => {
-    setActiveInterval?.(
-      getActualDateRange({ start: startDate, end: endDate }).intervalKey
-    );
-  };
-  const handleClick = (date) => {
-    prevEndHour.current = 0;
-    if (!startDate || startDate && endDate && !(moment9(startDate).add(1, "d").isSame(endDate, "day") && endHour === 0)) {
-      setStartDate(moment9(date).startOf("day"));
-      setEndDate(moment9(date).add(1, "d").startOf("day"));
-      setStartHour(0);
-      setEndHour(0);
-    } else if (moment9(date).isBefore(moment9(startDate), "day")) {
-      setEndDate(moment9(startDate).add(1, "d").startOf("day"));
-      setStartDate(moment9(date).set("hour", Number.parseInt(startHour.toString(), 10)));
-    } else if (moment9(date).isAfter(moment9(startDate), "day")) {
-      setEndDate(moment9(date).add(1, "d").startOf("day"));
+  return keyPressed;
+}
+var useKeyPress_default = useKeyPress;
+
+// src/Functions/useKeyPress/useHandleKeyPress.ts
+import { useEffect as useEffect28 } from "react";
+function useHandleKeyPress({
+  escCallback,
+  enterCallback,
+  withClamping = true,
+  withEventManagementStructure,
+  suspendProcessing = null
+}) {
+  const { isWithSubmitAndCloseManagement } = withEventManagementStructure || {};
+  const isPressEnter = useKeyPress_default("Enter", withClamping, isWithSubmitAndCloseManagement, suspendProcessing);
+  const isPressEscape = useKeyPress_default("Escape", withClamping, isWithSubmitAndCloseManagement, suspendProcessing);
+  useEffect28(() => {
+    if (!isWithSubmitAndCloseManagement && isPressEscape && typeof escCallback === "function") {
+      escCallback();
     }
-  };
-  const handleChangeStartHour = (val) => {
-    setStartHour(Number(val));
-    setStartDate(moment9(startDate || moment9()).set("hour", Number(val)));
-  };
-  const handleChangeEndHour = (val) => {
-    const newHour = Number(val);
-    setEndHour(newHour);
-    let newEndDate = moment9();
-    if (endDate) {
-      if (prevEndHour.current === 0 && newHour !== 0) {
-        newEndDate = moment9(endDate).subtract(1, "days");
-      } else if (prevEndHour.current !== 0 && newHour === 0) {
-        newEndDate = moment9(endDate).add(1, "days");
-      }
+  }, [isPressEscape, escCallback]);
+  useEffect28(() => {
+    if (!isWithSubmitAndCloseManagement && isPressEnter && typeof enterCallback === "function") {
+      enterCallback();
     }
-    prevEndHour.current = newHour;
-    setEndDate(moment9(newEndDate).set("hour", newHour));
-  };
-  const handleDateInputFocus = (key, e) => {
-    const changeFlag = key === "startDateInput" ? setIsStartFocused : setIsEndFocused;
-    const set = key === "startDateInput" ? setStartDateInput : setEndDateInput;
-    const date = key === "startDateInput" ? startDate : endDate;
-    changeFlag(true);
-    set(date ? getCorrectedDateForDateInput(key, date).format("L") : "");
-    setTimeout(() => {
-      const defaultTarget = key === "startDateInput" ? startDateInputRef.current : endDateInputRef.current;
-      const target = e?.target ?? defaultTarget;
-      target.select?.();
-    }, 0);
-  };
-  const doBlur = (type, e) => {
-    const executor = type === "startDateInput" ? setIsStartFocused : setIsEndFocused;
-    e.target.blur();
-    executor(false);
+  }, [isPressEnter, enterCallback]);
+}
+var useHandleKeyPress_default = useHandleKeyPress;
+
+// src/Atomic/UI/Modal/partials/_constants.ts
+var DEFAULT_EVENT_OPTIONS = Object.freeze({
+  bubbles: true,
+  cancelable: true,
+  composed: false
+});
+var ModalEventsInnerKeys = /* @__PURE__ */ ((ModalEventsInnerKeys2) => {
+  ModalEventsInnerKeys2["iGotAnEnterKeyPress"] = "iGotAnEnterKeyPress";
+  ModalEventsInnerKeys2["iGotAnEscKeyPress"] = "iGotAnEscKeyPress";
+  return ModalEventsInnerKeys2;
+})(ModalEventsInnerKeys || {});
+var EVENTS = Object.freeze({
+  ["iGotAnEnterKeyPress" /* iGotAnEnterKeyPress */]: {
+    innerKey: "iGotAnEnterKeyPress" /* iGotAnEnterKeyPress */,
+    name: "modal:i-got-an-enter-key-press",
+    shortName: "enterIsPressed",
+    middlewareKey: "Enter",
+    options: DEFAULT_EVENT_OPTIONS
+  },
+  ["iGotAnEscKeyPress" /* iGotAnEscKeyPress */]: {
+    innerKey: "iGotAnEscKeyPress" /* iGotAnEscKeyPress */,
+    name: "modal:i-got-an-esc-key-press",
+    shortName: "escIsPressed",
+    middlewareKey: "Escape",
+    options: DEFAULT_EVENT_OPTIONS
+  }
+});
+
+// src/Atomic/UI/Modal/partials/_utils.ts
+function getWithEventManagementStructure(modalId, withEventManagement) {
+  const output = {
+    isWithSubmitAndCloseManagement: false
   };
-  const processOverflow = (newDateAsString, valueForRollback, key) => {
-    const newDateAsMomentObj = moment9(newDateAsString, DATE_INPUT_FORMAT);
-    if (!newDateAsMomentObj.isValid()) {
-      return valueForRollback;
+  for (const key in output) {
+    if (!modalId) {
+      output[key] = false;
     } else {
-      const beforeOfFuture = moment9().endOf("day");
-      const hour = key === "startDateInput" ? startHour : endHour;
-      let output;
-      if (minDate && newDateAsMomentObj.isBefore(momentMinDate)) {
-        output = momentMinDate;
-      } else if (maxDate && newDateAsMomentObj.isAfter(momentMaxDate)) {
-        output = momentMaxDate;
-      } else if (!isDontLimitFuture && newDateAsMomentObj.isAfter(beforeOfFuture)) {
-        output = beforeOfFuture.startOf("day");
-      } else {
-        output = newDateAsMomentObj;
-      }
-      if (key === "endDateInput") {
-        output = addDay(output);
+      output[key] = getIsOnlyAnObject(withEventManagement) ? withEventManagement[key] ?? false : !!withEventManagement;
+    }
+  }
+  return output;
+}
+function getOnKeyPress({
+  id: modalId,
+  onSubmit,
+  onClose,
+  suspendProcessing
+}) {
+  if (!modalId) return null;
+  return function onKeyPress(ev) {
+    const customEvent = ev;
+    const { id: eventId, realEvent } = customEvent.detail || {};
+    const constantInfoAboutCustomEvent = Object.values(EVENTS).find((ev2) => ev2.name === customEvent.type || ev2.shortName === customEvent.type) || {};
+    const middlewareKey = constantInfoAboutCustomEvent.middlewareKey || "incorrectKey";
+    const safelySuspendProcessing = isISuspendProcessing(suspendProcessing) ? suspendProcessing : {};
+    if (modalId && eventId && eventId === modalId && !safelySuspendProcessing[middlewareKey]?.(realEvent)) {
+      switch (customEvent.type) {
+        case EVENTS.iGotAnEnterKeyPress.name: {
+          onSubmit?.();
+          break;
+        }
+        case EVENTS.iGotAnEscKeyPress.name: {
+          onClose?.();
+          break;
+        }
+        default: {
+          break;
+        }
       }
-      return output.set("hour", Number.parseInt(hour.toString(), 10));
     }
   };
-  const handleDateInputBlur = (key, e) => {
-    const reserveValue = key === "startDateInput" ? startDateInput : endDateInput;
-    const valueForRollback = key === "startDateInput" ? startDate : endDate;
-    const execute = key === "startDateInput" ? setStartDate : setEndDate;
-    const executeForCalendar = key === "startDateInput" ? setDate1 : setDate2;
-    const prepareValueForCalendar = (newDate) => {
-      if (key === "endDateInput") return newDate;
-      return moment9(newDate).isSameOrAfter(moment9(date2), "month") ? moment9(date2).subtract(1, "month") : moment9(newDate);
-    };
-    const newDateValue = e?.target?.value ?? reserveValue;
-    const processedNewDate = processOverflow(
-      newDateValue,
-      valueForRollback,
-      key
-    );
-    execute(processedNewDate);
-    executeForCalendar(prepareValueForCalendar(processedNewDate));
-    doBlur(key, e);
-  };
-  const handleKeyPressed = (code, e, type) => {
-    if (code === 13) {
-      const syntheticEvent = {
-        target: e.target,
-        relatedTarget: null
-      };
-      handleDateInputBlur(type, syntheticEvent);
+}
+function dispatchEventForModalManagement(realEvent, nameOfCustomEvent, uniqueIdOfRecipient, target) {
+  const { repeat, altKey, ctrlKey, shiftKey, metaKey } = realEvent;
+  const isPressingWithoutAuxiliaryKeys = !altKey && !ctrlKey && !shiftKey && !metaKey;
+  if (!repeat && isPressingWithoutAuxiliaryKeys) {
+    const event = Object.values(EVENTS).find((ev) => ev.name === nameOfCustomEvent || ev.shortName === nameOfCustomEvent);
+    if (event && uniqueIdOfRecipient) {
+      (target ?? document).dispatchEvent(new CustomEvent(event.name, { ...event.options, detail: { id: uniqueIdOfRecipient, realEvent } }));
     }
-    if (code === 27) doBlur(type, e);
-  };
-  const getStartHourItems = () => [...Array.from({ length: 24 }).keys()].map((hour) => ({
-    label: padTime2(hour),
-    value: hour,
-    disabled: moment9(startDate).isSame(endDate, "day") && endHour <= hour
-  }));
-  const getEndHourItems = () => [...Array.from({ length: 24 }).keys()].map((hour) => ({
-    label: padTime2(hour + 1),
-    value: hour === 23 ? 0 : hour + 1,
-    disabled: (moment9(startDate).isSame(endDate, "day") || moment9(startDate).isSame(
-      moment9(endDate).subtract(1, "days"),
-      "day"
-    ) && endHour === 0) && hour < startHour
-  }));
-  const renderButtons = () => /* @__PURE__ */ jsxs37(Fragment9, { children: [
-    /* @__PURE__ */ jsx44(
-      Button_default,
+  }
+}
+
+// src/Atomic/UI/Modal/partials/ModalFooter.tsx
+import { jsx as jsx41 } from "react/jsx-runtime";
+import cn34 from "classnames";
+import { memo } from "react";
+var ModalFooter = memo(
+  ({ className = "", children, wrapperRef, testId = "modal-footer" }) => {
+    return /* @__PURE__ */ jsx41(
+      "footer",
       {
-        className: "date-picker__button",
-        onClick: () => onCancel?.(),
-        variant: buttonsTypes?.cancel,
-        children: txt?.buttons?.cancel || "Cancel"
+        "data-testid": testId,
+        ref: wrapperRef,
+        className: cn34("modal__footer", className),
+        role: "contentinfo",
+        "aria-label": "Modal footer",
+        children
+      }
+    );
+  }
+);
+ModalFooter.displayName = "ModalFooter";
+var ModalFooter_default = ModalFooter;
+
+// src/Atomic/UI/Modal/partials/ModalTitle.tsx
+import { jsx as jsx42, jsxs as jsxs36 } from "react/jsx-runtime";
+import cn35 from "classnames";
+import { memo as memo2, useLayoutEffect as useLayoutEffect4, useMemo as useMemo14, useRef as useRef15 } from "react";
+import { X as X5 } from "react-feather";
+var ModalTitle = memo2(
+  ({
+    variant = "primary",
+    children,
+    isForced = false,
+    onClose,
+    closeBtnDisable,
+    noHeaderCloseBtn = false,
+    className,
+    wrapperRef,
+    testId = "modal-title"
+  }) => {
+    const closeModalRef = useRef15(onClose);
+    const handleClick = useMemo14(() => () => closeModalRef.current?.(), []);
+    useLayoutEffect4(() => {
+      closeModalRef.current = closeBtnDisable ? void 0 : onClose;
+    }, [onClose, closeBtnDisable]);
+    return /* @__PURE__ */ jsxs36(
+      "header",
+      {
+        "data-testid": testId,
+        ref: wrapperRef,
+        className: cn35("modal__header", className, {
+          [`modal__header-${variant}`]: variant
+        }),
+        role: "banner",
+        "aria-label": "Modal header",
+        children: [
+          /* @__PURE__ */ jsx42(
+            "span",
+            {
+              className: cn35("modal__header-title", {
+                [`modal__header-${variant}-title`]: variant
+              }),
+              id: `${testId}-heading`,
+              children
+            }
+          ),
+          !isForced && /* @__PURE__ */ jsx42(
+            "button",
+            {
+              type: "button",
+              onClick: handleClick,
+              className: cn35("modal-close-icon-box", {
+                "modal-close-icon-box-primary": variant === "primary",
+                "modal-close-icon-box--hidden": noHeaderCloseBtn
+              }),
+              "aria-label": "Close modal",
+              title: "Close modal",
+              children: !noHeaderCloseBtn && /* @__PURE__ */ jsx42(X5, { className: "modal-close-icon", role: "img", "aria-hidden": "true" })
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+ModalTitle.displayName = "ModalTitle";
+var ModalTitle_default = ModalTitle;
+
+// src/Atomic/UI/Modal/partials/useMobileModal.tsx
+import { jsx as jsx43 } from "react/jsx-runtime";
+import { useCallback as useCallback6, useEffect as useEffect29, useLayoutEffect as useLayoutEffect5, useRef as useRef16, useState as useState29 } from "react";
+var SCROLL_DIRECTION = {
+  UP: "up",
+  DOWN: "down"
+};
+function useMobileModal({
+  modalRef,
+  withMobileLogic = false,
+  withFixedFooter = false,
+  isOpen = false
+}) {
+  const modalMobileContainerRef = useRef16(null);
+  const modalMobileHeaderRef = useRef16(null);
+  const modalMobileFooterRef = useRef16(null);
+  const modalMobileBodyRef = useRef16(null);
+  const { isMobile } = useIsMobile_default();
+  const [modalHeight, setModalHeight] = useState29(0);
+  const [modalsLogic, setModalsLogic] = useState29({
+    IS_HEADER_HIDDEN: false,
+    IS_HEADER_STICKY: false,
+    IS_FOOTER_HIDDEN: false,
+    IS_FOOTER_STICKY: withFixedFooter
+  });
+  const [modalsLogicProps, setModalsLogicProps] = useState29({
+    headerHeight: 0,
+    footerHeight: 0
+  });
+  const [scrollDirection, setScrollDirection] = useState29(SCROLL_DIRECTION.UP);
+  const [scrollTopPrev, setScrollTopPrev] = useState29(0);
+  const [scrollTop, setScrollTop] = useState29(0);
+  const [scrollHeight, setScrollHeight] = useState29(1);
+  const [, setContainerScrollHeight] = useState29(1);
+  useLayoutEffect5(() => {
+    const el = modalMobileContainerRef?.current;
+    if (el) {
+      el.addEventListener("scroll", () => {
+        setScrollTop((scrollTop2) => {
+          if (scrollTop2 !== el.scrollTop) setScrollTopPrev(scrollTop2);
+          return el.scrollTop;
+        });
+      });
+    }
+  }, [modalMobileContainerRef?.current]);
+  useEffect29(() => {
+    setScrollDirection(
+      (prevScrollDirection) => scrollTop < scrollTopPrev ? SCROLL_DIRECTION.UP : scrollTop > scrollTopPrev ? SCROLL_DIRECTION.DOWN : prevScrollDirection
+    );
+  }, [scrollTop, scrollTopPrev]);
+  useLayoutEffect5(() => {
+    if (isOpen) {
+      const modalStyle = modalRef?.current ? modalRef?.current.style || window.getComputedStyle(modalRef?.current) : {};
+      const computedModalHeight = modalRef?.current ? modalHeight + Number.parseFloat(modalStyle?.marginTop || "0") : 0;
+      const windowHeight = document.documentElement.clientHeight || window.screen.availHeight || window.screen.height;
+      if (modalMobileContainerRef?.current) {
+        if (computedModalHeight <= windowHeight) {
+          modalMobileContainerRef.current.style.display = "flex";
+          modalMobileContainerRef.current.style.alignItems = "flex-end";
+        } else {
+          modalMobileContainerRef.current?.style?.removeProperty("display");
+          modalMobileContainerRef.current?.style?.removeProperty("align-items");
+        }
       }
-    ),
-    /* @__PURE__ */ jsx44(
-      Button_default,
-      {
-        className: "date-picker__button",
-        variant: buttonsTypes?.apply,
-        disabled: !startDate || !endDate,
-        onClick: () => onChange?.({
-          start: moment9(startDate).format(MAIN_FORMAT),
-          end: moment9(endDate).format(MAIN_FORMAT),
-          startPrevDate: moment9(startPrevDate).format(MAIN_FORMAT),
-          endPrevDate: moment9(endPrevDate).format(MAIN_FORMAT),
-          compare: isCompare
-        }),
-        children: txt?.buttons?.apply || "apply"
+    }
+  }, [modalsLogicProps, isOpen, isMobile, modalHeight]);
+  useLayoutEffect5(() => {
+    if (isMobile && isOpen) {
+      const newModalHeight = modalRef?.current?.getBoundingClientRect()?.height;
+      if (newModalHeight && modalHeight !== newModalHeight) {
+        setModalHeight(newModalHeight);
       }
-    )
-  ] });
-  const renderPreviousPeriod = () => /* @__PURE__ */ jsxs37(Fragment9, { children: [
-    txt?.labels?.previousPeriod || "",
-    ":",
-    " ",
-    /* @__PURE__ */ jsx44("span", { className: "date-picker__previous-period-interval", children: title })
-  ] });
-  useEffect30(() => {
-    if (moment9(startDate).isSameOrAfter(endDate)) {
-      setStartDate(moment9(endDate).subtract(1, "d"));
-      setDate1(moment9(endDate).subtract(1, "d"));
     }
-  }, [startDate]);
-  useEffect30(() => {
-    if (moment9(endDate).isSameOrBefore(startDate)) {
-      setEndDate(moment9(startDate).add(1, "d"));
-      setDate2(moment9(startDate).add(1, "d"));
+  });
+  useEffect29(() => {
+    if (isMobile && withMobileLogic) {
+      const { footerHeight, headerHeight } = modalsLogicProps;
+      setModalsLogic((prevStickyLogic) => ({
+        IS_HEADER_HIDDEN: scrollDirection === SCROLL_DIRECTION.DOWN || scrollTop === 0,
+        IS_HEADER_STICKY: scrollDirection === SCROLL_DIRECTION.UP && scrollTop !== 0 && (scrollTop >= headerHeight || prevStickyLogic.IS_HEADER_STICKY),
+        IS_FOOTER_HIDDEN: !withFixedFooter && (scrollDirection === SCROLL_DIRECTION.UP || scrollHeight === Math.round(scrollTop)),
+        IS_FOOTER_STICKY: withFixedFooter && scrollHeight > 1 || scrollDirection === SCROLL_DIRECTION.DOWN && (scrollHeight - Math.round(scrollTop) >= footerHeight || prevStickyLogic.IS_FOOTER_STICKY)
+      }));
     }
-  }, [endDate]);
-  useEffect30(() => {
-    if (moment9(startDate).isBefore(moment9(endDate), "month")) {
-      setDate1(moment9(startDate));
-      setDate2(moment9(endDate));
+  }, [
+    scrollTop,
+    scrollHeight,
+    isMobile,
+    withMobileLogic,
+    scrollDirection,
+    modalsLogicProps,
+    modalHeight,
+    window.innerHeight
+  ]);
+  useLayoutEffect5(() => {
+    if (modalMobileHeaderRef?.current?.getBoundingClientRect()?.height !== void 0) {
+      setModalsLogicProps((state) => ({
+        ...state,
+        headerHeight: modalMobileHeaderRef?.current?.getBoundingClientRect()?.height ?? 0
+      }));
     }
-    setInterval2();
-  }, [startDate, endDate]);
-  useEffect30(() => {
-    if (moment9(date1).isSameOrAfter(moment9(date2), "month") && !withMobileLogic) {
-      setDate1(moment9(date2).subtract(1, "month"));
+  }, [modalMobileHeaderRef?.current?.getBoundingClientRect()?.height]);
+  useLayoutEffect5(() => {
+    if (modalMobileFooterRef?.current?.getBoundingClientRect()?.height !== void 0) {
+      setModalsLogicProps((state) => ({
+        ...state,
+        footerHeight: modalMobileFooterRef?.current?.getBoundingClientRect()?.height ?? 0
+      }));
     }
-  }, [date1, date2]);
-  useEffect30(() => {
-    onChangeInterval(dateInterval);
-  }, [dateInterval]);
-  useEffect30(() => {
-    if (typeof onChangeMobile === "function") {
-      onChangeMobile({
-        start: moment9(startDate).format(MAIN_FORMAT),
-        end: moment9(endDate).format(MAIN_FORMAT),
-        startPrevDate: moment9(startPrevDate).format(MAIN_FORMAT),
-        endPrevDate: moment9(endPrevDate).format(MAIN_FORMAT),
-        compare: isCompare
-      });
+  }, [modalMobileFooterRef?.current?.getBoundingClientRect()?.height]);
+  useEffect29(() => {
+    if (modalMobileContainerRef?.current) {
+      setContainerScrollHeight(modalMobileContainerRef?.current?.scrollHeight);
+      setScrollHeight(
+        modalMobileContainerRef?.current?.scrollHeight - window.innerHeight
+      );
     }
-  }, [startDate, endDate, startPrevDate, endPrevDate, isCompare]);
-  const renderRowStart = () => {
-    return /* @__PURE__ */ jsxs37("div", { className: "date-picker__date-row", children: [
-      /* @__PURE__ */ jsx44(
-        DateInput_default,
-        {
-          ref: startDateInputRef,
-          testId: `datepicker-${testId}_start-date-input`,
-          RC: "date-picker__date-input",
-          className: cn36("date-picker__date-input"),
-          isFocused: isStartFocused,
-          value: startDateInput,
-          date: getCorrectedDateForDateInput("startDateInput", startDate),
-          disabled: !startDate,
-          onChange: setStartDateInput,
-          onFocus: (e) => handleDateInputFocus("startDateInput", e),
-          onBlur: (e) => handleDateInputBlur("startDateInput", e),
-          onKeyUp: (code, e) => handleKeyPressed(+code, e, "startDateInput")
-        }
-      ),
-      /* @__PURE__ */ jsx44(
-        Dropdown_default,
-        {
-          testId,
-          id: `datepicker-id-${mainId}_start-hour-select-input`,
-          className: cn36("date-picker__hour-select-input"),
-          onChange: (value) => handleChangeStartHour(value),
-          value: startHour,
-          options: getStartHourItems(),
-          disabled: !startDate,
-          isDoNotPullOutListOfMainContainer,
-          withMobileLogic
-        }
-      )
-    ] });
-  };
-  const renderRowEnd = () => {
-    return /* @__PURE__ */ jsxs37("div", { className: "date-picker__date-row", children: [
-      /* @__PURE__ */ jsx44(
-        DateInput_default,
-        {
-          ref: endDateInputRef,
-          testId: `datepicker-${testId}_start-date-input`,
-          RC: "date-picker__date-input",
-          className: cn36("date-picker__date-input"),
-          isFocused: isEndFocused,
-          value: endDateInput,
-          date: getCorrectedDateForDateInput("endDateInput", endDate),
-          disabled: !endDate,
-          onChange: setEndDateInput,
-          onFocus: (e) => handleDateInputFocus("endDateInput", e),
-          onBlur: (e) => handleDateInputBlur("endDateInput", e),
-          onKeyUp: (code, e) => handleKeyPressed(+code, e, "endDateInput")
-        }
-      ),
-      /* @__PURE__ */ jsx44(
-        Dropdown_default,
-        {
-          testId,
-          id: `datepicker-id-${mainId}_end-hour-select-input`,
-          className: cn36("date-picker__hour-select-input"),
-          onChange: (value) => handleChangeEndHour(value),
-          value: endHour,
-          options: getEndHourItems(),
-          disabled: !endDate,
-          isDoNotPullOutListOfMainContainer,
-          withMobileLogic
-        }
-      )
-    ] });
+  }, [scrollTop, modalMobileContainerRef?.current, window.innerHeight]);
+  useEffect29(() => {
+    window.addEventListener("resize", () => {
+      setContainerScrollHeight((containerScrollHeight) => {
+        setScrollHeight(containerScrollHeight - window.innerHeight);
+        return containerScrollHeight;
+      });
+    });
+  }, []);
+  const renderModal = useCallback6(
+    (modal) => {
+      if (!isMobile || !withMobileLogic) return modal;
+      return /* @__PURE__ */ jsx43("div", { className: "modal-mobile-container", ref: modalMobileContainerRef, children: modal });
+    },
+    [isMobile, withMobileLogic]
+  );
+  return {
+    modalMobileContainerRef,
+    modalMobileHeaderRef,
+    modalMobileBodyRef,
+    modalMobileFooterRef,
+    MODALS_LOGIC: modalsLogic,
+    SCROLL_DIRECTION,
+    scrollTop,
+    scrollHeight,
+    renderModal,
+    isMobile
   };
-  const renderCalendarStart = () => {
-    return /* @__PURE__ */ jsx44(
-      RangeCalendar_default,
-      {
-        testId,
-        className: "date-picker__calendar",
-        date: date1,
-        setDate: setDate1,
-        allowNext: withMobileLogic ? !moment9(date1).startOf("month").isSameOrAfter(moment9().startOf("day"), "months") : !isNearby,
-        startDate,
-        endDate,
-        startPrevDate,
-        endPrevDate,
-        onClick: handleClick,
-        limitRange,
-        isShortWeekNames,
-        minDate,
-        maxDate,
-        momentMinDate,
-        momentMaxDate
-      }
-    );
+}
+
+// src/Atomic/UI/Modal/Modal.tsx
+import cn36 from "classnames";
+import { useEffect as useEffect30, useLayoutEffect as useLayoutEffect6, useMemo as useMemo15, useRef as useRef17 } from "react";
+var attrsForModalBodyDefault = {};
+var KEY_CODE = Object.freeze({
+  ENTER: 13,
+  ESC: 27
+});
+function renderModalTitle({
+  mode,
+  title,
+  onlyTitle
+}) {
+  if (mode && mode !== "default" && !onlyTitle) {
+    return `${mode[0].toUpperCase()}${mode.slice(1)} ${title}`;
+  }
+  return title;
+}
+function Modal({
+  ref,
+  id,
+  testId = "modal",
+  zIndex = 100,
+  isOpen,
+  onConfirm,
+  onDecline,
+  closeModal,
+  className,
+  variant = "primary",
+  size,
+  mode,
+  title,
+  onlyTitle,
+  atributesForModalBody = attrsForModalBodyDefault,
+  confirmBtnClassName,
+  confirmBtnLabel,
+  confirmBtnVariant = "primary",
+  confirmBtnDisable,
+  confirmBtnIcon,
+  isConfirmBtnIconPositionRight,
+  noConfirmBtn,
+  forced,
+  closeBtnClassName,
+  closeBtnText,
+  closeBtnVariant,
+  closeBtnDisable,
+  closeBtnIcon,
+  btnClassNames,
+  isCloseBtnIconPositionRight,
+  noCloseBtn,
+  noHeader,
+  noHeaderCloseBtn,
+  customHeader,
+  declineBtnDisable,
+  noFooter,
+  customFooter,
+  withFixedFooter,
+  leftContentOfFooter,
+  isSubmittingByEnter: isSubmittingByEnterOuter = true,
+  isClosingByEsc: isClosingByEscOuter = true,
+  withEventManagement = false,
+  submitOnEnter,
+  closeOnEsc,
+  withMobileLogic,
+  children
+}) {
+  const internalRef = useRef17(null);
+  const modalRef = ref || internalRef;
+  const onConfirmRef = useRef17(onConfirm);
+  const closeModalRef = useRef17(closeModal);
+  const onDeclineRef = useRef17(onDecline);
+  const isSubmittingByEnter = submitOnEnter === false ? false : isSubmittingByEnterOuter;
+  const isClosingByEsc = closeOnEsc === false ? false : isClosingByEscOuter;
+  const withEventManagementStructure = getWithEventManagementStructure(id, withEventManagement);
+  const isUseAutoBlockingForHandlers = withEventManagementStructure.isWithSubmitAndCloseManagement;
+  const isOnConfirmBlocked = typeof onConfirm === "function" && isUseAutoBlockingForHandlers && confirmBtnDisable;
+  const isCloseModalBlocked = typeof closeModal === "function" && isUseAutoBlockingForHandlers && closeBtnDisable;
+  const isOnDeclineBlocked = typeof onDecline === "function" && isUseAutoBlockingForHandlers && declineBtnDisable;
+  const {
+    modalMobileHeaderRef,
+    modalMobileBodyRef,
+    modalMobileFooterRef,
+    MODALS_LOGIC,
+    renderModal,
+    isMobile,
+    scrollTop,
+    scrollHeight
+  } = useMobileModal({
+    withMobileLogic,
+    withFixedFooter,
+    isOpen
+  });
+  const handle = useMemo15(() => ({
+    confirm: () => onConfirmRef.current?.(),
+    close: () => closeModalRef.current?.(),
+    decline: () => {
+      if (typeof onDeclineRef.current === "function") onDeclineRef.current();
+      else closeModalRef.current?.();
+    }
+  }), []);
+  const suspendProcessing = {
+    // FIN-12482
+    // ? Чтобы НЕ замыкать рефку на модалку в логике, чтобы потом поискать в контенте все текстэриа,
+    // ? чтобы оценить есть ли среди них сфокусированная - делаем элеГАнтно:
+    // ? оцениваем ev.target, и если target это текстэриа, то вот сейчас то она и сфокусирована,
+    // ? т.е нужно приостановить процессы связанные с нажатием enter.
+    Enter: (ev) => ev?.target?.nodeName === "TEXTAREA"
+    // ? Колбеки опциональны, можно передавать только нужные
+    // Escape: (ev: globalThis.KeyboardEvent) => false,
   };
-  const renderCalendarEnd = () => {
-    return /* @__PURE__ */ jsx44(
-      RangeCalendar_default,
-      {
-        className: "date-picker__calendar",
-        date: date2,
-        setDate: setDate2,
-        allowPrev: !isNearby,
-        startDate,
-        endDate,
-        startPrevDate,
-        endPrevDate,
-        onClick: handleClick,
-        isShortWeekNames,
-        minDate,
-        maxDate,
-        momentMinDate,
-        momentMaxDate,
-        isDontLimitFuture
+  useHandleKeyPress_default({
+    enterCallback: isSubmittingByEnter && typeof onConfirm === "function" && !confirmBtnDisable ? handle.confirm : void 0,
+    escCallback: isClosingByEsc && typeof closeModal === "function" ? handle.close : void 0,
+    withClamping: false,
+    withEventManagementStructure: {
+      isWithSubmitAndCloseManagement: confirmBtnDisable || withEventManagementStructure.isWithSubmitAndCloseManagement
+    },
+    suspendProcessing
+  });
+  useLayoutEffect6(() => {
+    onConfirmRef.current = isOnConfirmBlocked ? void 0 : onConfirm;
+  }, [onConfirm, isOnConfirmBlocked]);
+  useLayoutEffect6(() => {
+    closeModalRef.current = isCloseModalBlocked ? void 0 : closeModal;
+  }, [closeModal, isCloseModalBlocked]);
+  useLayoutEffect6(() => {
+    onDeclineRef.current = isOnDeclineBlocked ? () => {
+    } : onDecline;
+  }, [onDecline, isOnDeclineBlocked]);
+  useEffect30(() => {
+    const outerTarget = getIsOnlyAnObject(withEventManagement) ? withEventManagement.listenersTarget : void 0;
+    const target = outerTarget ?? document;
+    const onKeyPress = getOnKeyPress({ id, onSubmit: handle.confirm, onClose: handle.close, suspendProcessing });
+    if (withEventManagementStructure.isWithSubmitAndCloseManagement && !!onKeyPress) {
+      if (isSubmittingByEnter) target.addEventListener(EVENTS.iGotAnEnterKeyPress.name, onKeyPress);
+      if (isClosingByEsc) target.addEventListener(EVENTS.iGotAnEscKeyPress.name, onKeyPress);
+    }
+    return () => {
+      if (withEventManagementStructure.isWithSubmitAndCloseManagement && !!onKeyPress) {
+        if (isSubmittingByEnter) target.removeEventListener(EVENTS.iGotAnEnterKeyPress.name, onKeyPress);
+        if (isClosingByEsc) target.removeEventListener(EVENTS.iGotAnEscKeyPress.name, onKeyPress);
       }
-    );
-  };
-  const render = () => {
-    return /* @__PURE__ */ jsxs37("div", { className: cn36("date-picker", className), children: [
-      /* @__PURE__ */ jsxs37("div", { className: "date-picker__header", children: [
-        /* @__PURE__ */ jsxs37("div", { className: "date-picker__inputs-block", children: [
-          renderRowStart(),
-          /* @__PURE__ */ jsx44("div", { className: "date-picker__inputs-separator date-picker__header--gray", children: "\u2014" }),
-          renderRowEnd()
-        ] }),
-        isCompare && !isCompareHidden && startDate && endDate && /* @__PURE__ */ jsx44("div", { className: "date-picker__previous-period", children: renderPreviousPeriod() })
-      ] }),
-      /* @__PURE__ */ jsx44("div", { className: "date-picker__calendars", children: /* @__PURE__ */ jsxs37("div", { className: "date-picker__calendars-wrapper", children: [
-        renderCalendarStart(),
-        renderCalendarEnd()
-      ] }) }),
-      /* @__PURE__ */ jsxs37(
-        "div",
-        {
-          className: cn36("date-picker__footer", {
-            "date-picker__footer_once-element": isCompareHidden
-          }),
-          children: [
-            !isCompareHidden ? /* @__PURE__ */ jsx44("div", { className: "date-picker__compare-block", children: /* @__PURE__ */ jsx44("div", { className: "mr5", children: /* @__PURE__ */ jsx44(
-              Switcher_default,
-              {
-                label: txt?.labels?.compare || "Compare",
-                isActive: isCompare,
-                onChange: () => {
-                  onChangeCompare?.(!isCompare);
-                  setIsCompare((state) => !state);
-                }
-              }
-            ) }) }) : /* @__PURE__ */ jsx44("div", {}),
-            /* @__PURE__ */ jsx44("div", { className: "date-picker__buttons-block", children: renderButtons() })
-          ]
-        }
+    };
+  }, []);
+  if (!isOpen) return null;
+  return /* @__PURE__ */ jsx44(
+    "div",
+    {
+      id: `${id}`,
+      style: { zIndex },
+      "data-testid": testId,
+      className: "modal-box j5",
+      role: "dialog",
+      "aria-modal": "true",
+      "aria-labelledby": `${testId}-title`,
+      children: renderModal(
+        /* @__PURE__ */ jsxs37(Fragment9, { children: [
+          /* @__PURE__ */ jsx44(
+            "div",
+            {
+              "data-testid": `${testId}-overlay`,
+              className: isOpen ? "modal-overlay" : "hidden",
+              onClick: handle.close,
+              role: "presentation"
+            }
+          ),
+          /* @__PURE__ */ jsxs37(
+            "div",
+            {
+              ref: modalRef,
+              style: { width: typeof size === "number" ? `${size}px` : `${size?.replace("px", "")}px` },
+              className: cn36(className, {
+                "modal": isOpen,
+                "modal--no-header": isOpen && noHeader && !customHeader,
+                "modal-mobile": isOpen && isMobile,
+                "hidden": !isOpen
+              }),
+              children: [
+                customHeader || !noHeader && /* @__PURE__ */ jsx44(
+                  ModalTitle_default,
+                  {
+                    wrapperRef: modalMobileHeaderRef,
+                    className: cn36({
+                      "modal__header--hidden": MODALS_LOGIC.IS_HEADER_HIDDEN,
+                      "modal__header--sticky": !MODALS_LOGIC.IS_HEADER_HIDDEN && MODALS_LOGIC.IS_HEADER_STICKY
+                    }),
+                    variant,
+                    isForced: forced,
+                    onClose: handle.close,
+                    noHeaderCloseBtn,
+                    children: /* @__PURE__ */ jsx44("span", { id: `${testId}-title`, children: renderModalTitle({ mode, title, onlyTitle }) })
+                  }
+                ),
+                /* @__PURE__ */ jsx44(
+                  "div",
+                  {
+                    ...atributesForModalBody,
+                    ref: modalMobileBodyRef,
+                    className: cn36("modal__body", {
+                      "modal__body--no-footer": noFooter
+                    }),
+                    role: "document",
+                    children
+                  }
+                ),
+                (!noFooter || customFooter) && /* @__PURE__ */ jsx44(
+                  ModalFooter_default,
+                  {
+                    wrapperRef: modalMobileFooterRef,
+                    className: cn36({
+                      "modal__footer--hidden": MODALS_LOGIC.IS_FOOTER_HIDDEN,
+                      "modal__footer--sticky": !MODALS_LOGIC.IS_FOOTER_HIDDEN && MODALS_LOGIC.IS_FOOTER_STICKY && scrollTop !== scrollHeight,
+                      "modal__footer_with-left-content": leftContentOfFooter
+                    }),
+                    children: customFooter || /* @__PURE__ */ jsxs37(Fragment9, { children: [
+                      leftContentOfFooter,
+                      (!noCloseBtn || !noConfirmBtn) && /* @__PURE__ */ jsxs37("div", { className: "modal__buttons-block", children: [
+                        !noCloseBtn && /* @__PURE__ */ jsx44(
+                          Button_default,
+                          {
+                            testId: "modal",
+                            className: cn36(closeBtnClassName, btnClassNames),
+                            variant: closeBtnVariant || "dark-outline",
+                            onClick: handle.decline,
+                            label: closeBtnText || "Cancel",
+                            disabled: typeof onDecline === "function" ? declineBtnDisable : closeBtnDisable,
+                            icon: closeBtnIcon,
+                            isIconRight: isCloseBtnIconPositionRight,
+                            tabIndex: 1,
+                            "aria-label": "Close modal"
+                          }
+                        ),
+                        !noConfirmBtn && /* @__PURE__ */ jsx44(
+                          Button_default,
+                          {
+                            testId: "modal",
+                            onClick: handle.confirm,
+                            label: confirmBtnLabel || mode && mode?.[0].toUpperCase() + mode?.slice(1) || "Apply",
+                            className: cn36("ml5", confirmBtnClassName, btnClassNames),
+                            variant: confirmBtnVariant,
+                            disabled: confirmBtnDisable,
+                            icon: confirmBtnIcon,
+                            isIconRight: isConfirmBtnIconPositionRight,
+                            "aria-label": "Confirm modal"
+                          }
+                        )
+                      ] })
+                    ] })
+                  }
+                )
+              ]
+            }
+          )
+        ] })
       )
-    ] });
-  };
-  const renderMobile = () => {
-    return /* @__PURE__ */ jsxs37("div", { className: cn36("date-picker", className), children: [
-      /* @__PURE__ */ jsxs37("div", { className: "date-picker__header", children: [
-        /* @__PURE__ */ jsxs37("div", { className: "date-picker__inputs-block", children: [
-          renderRowStart(),
-          /* @__PURE__ */ jsx44("div", { className: "date-picker__inputs-separator date-picker__header--gray", children: "\u2014" }),
-          renderRowEnd()
-        ] }),
-        isCompare && !isCompareHidden && startDate && endDate && /* @__PURE__ */ jsx44("div", { className: "date-picker__previous-period", children: renderPreviousPeriod() })
-      ] }),
-      /* @__PURE__ */ jsx44("div", { className: "date-picker__calendars", children: /* @__PURE__ */ jsx44("div", { className: "date-picker__calendars-wrapper", children: renderCalendarStart() }) })
-    ] });
-  };
-  return withMobileLogic ? renderMobile() : render();
-};
-var Datepicker_default2 = Datepicker2;
+    }
+  );
+}
+Modal.displayName = "Modal";
+var Modal_default = Modal;
 
 // src/Atomic/FormElements/InputDateRange/components/SelectItem.tsx
 import { jsx as jsx45, jsxs as jsxs38 } from "react/jsx-runtime";
@@ -8007,6 +8018,7 @@ var OpenedPart = (props) => {
 var OpenedPart_default = OpenedPart;
 
 // src/Atomic/FormElements/InputDateRange/InputDateRange.tsx
+import { Fragment as Fragment11, jsx as jsx47, jsxs as jsxs40 } from "react/jsx-runtime";
 import cn39 from "classnames";
 import moment11 from "moment-timezone";
 import React40, { useLayoutEffect as useLayoutEffect7, useRef as useRef19, useState as useState31 } from "react";
@@ -8365,6 +8377,9 @@ var InputLink = ({
 };
 var InputLink_default = InputLink;
 
+// src/Atomic/FormElements/InputLink/index.ts
+var InputLink_default2 = InputLink_default;
+
 // src/Atomic/FormElements/InputMask/InputMask.tsx
 var InputMask_default = InputMask3_default;
 
@@ -8539,6 +8554,9 @@ var InputsRow = ({
 };
 var InputsRow_default = InputsRow;
 
+// src/Atomic/FormElements/InputsRow/index.ts
+var InputsRow_default2 = InputsRow_default;
+
 // src/Atomic/FormElements/InputWithAction/InputWithAction.tsx
 import { jsx as jsx50, jsxs as jsxs43 } from "react/jsx-runtime";
 import cn41 from "classnames";
@@ -8641,6 +8659,9 @@ var InputWithAction = (props, ref) => {
 };
 var InputWithAction_default = React43.forwardRef(InputWithAction);
 
+// src/Atomic/FormElements/InputWithAction/index.ts
+var InputWithAction_default2 = InputWithAction_default;
+
 // src/Atomic/FormElements/Label/Label.tsx
 import { Fragment as Fragment12, jsx as jsx51, jsxs as jsxs44 } from "react/jsx-runtime";
 import cn42 from "classnames";
@@ -9648,6 +9669,9 @@ function RadioGroupWithInput({
 }
 var RadioGroupWithInput_default = RadioGroupWithInput;
 
+// src/Atomic/FormElements/RadioInput/index.ts
+var RadioInput_default2 = RadioInput_default;
+
 // src/Atomic/FormElements/RadioRowSwitcher/RadioRowSwitcher.tsx
 import { jsx as jsx58, jsxs as jsxs50 } from "react/jsx-runtime";
 import classNames from "classnames";
@@ -9825,6 +9849,9 @@ var RangeInputs = ({
 };
 var RangeInputs_default = RangeInputs;
 
+// src/Atomic/FormElements/RangeInputs/index.ts
+var RangeInputs_default2 = RangeInputs_default;
+
 // src/Atomic/FormElements/RangeList/RangeList.tsx
 import { jsx as jsx61, jsxs as jsxs53 } from "react/jsx-runtime";
 
@@ -10113,6 +10140,9 @@ var RangeList = (props) => {
 };
 var RangeList_default = RangeList;
 
+// src/Atomic/FormElements/RangeList/index.ts
+var RangeList_default2 = RangeList_default;
+
 // src/Atomic/FormElements/RangeSlider2/RangeSlider2.tsx
 import { jsx as jsx62, jsxs as jsxs54 } from "react/jsx-runtime";
 import cn50 from "classnames";
@@ -11237,6 +11267,9 @@ var SwitchableRow = (props) => {
 };
 var SwitchableRow_default = SwitchableRow;
 
+// src/Atomic/FormElements/Switcher/index.ts
+var Switcher_default2 = Switcher_default;
+
 // src/Atomic/FormElements/SwitcherCheckbox/SwitcherCheckbox.tsx
 import { jsx as jsx65, jsxs as jsxs57 } from "react/jsx-runtime";
 import cn53 from "classnames";
@@ -11332,6 +11365,9 @@ var SwitcherHide = ({
 };
 var SwitcherHide_default = SwitcherHide;
 
+// src/Atomic/FormElements/SwitcherHide/index.ts
+var SwitcherHide_default2 = SwitcherHide_default;
+
 // src/Atomic/FormElements/SwitcherRadio/SwitcherRadio.tsx
 import { jsx as jsx67 } from "react/jsx-runtime";
 import { createElement as createElement2 } from "react";
@@ -11403,6 +11439,9 @@ var SwitcherRadio = ({
 };
 var SwitcherRadio_default = SwitcherRadio;
 
+// src/Atomic/FormElements/SwitcherRadio/index.ts
+var SwitcherRadio_default2 = SwitcherRadio_default;
+
 // src/Atomic/FormElements/SwitcherRange/SwitcherRange.tsx
 import { jsx as jsx68 } from "react/jsx-runtime";
 var RC20 = "switcher-range";
@@ -11452,6 +11491,9 @@ var SwitcherRange = ({
 };
 var SwitcherRange_default = SwitcherRange;
 
+// src/Atomic/FormElements/SwitcherRange/index.ts
+var SwitcherRange_default2 = SwitcherRange_default;
+
 // src/Atomic/FormElements/SwitcherRangeList/SwitcherRangeList.tsx
 import { jsx as jsx69 } from "react/jsx-runtime";
 import cn56 from "classnames";
@@ -13406,6 +13448,9 @@ var Text = ({
 };
 var Text_default = Text;
 
+// src/Atomic/FormElements/Text/index.ts
+var Text_default2 = Text_default;
+
 // src/Atomic/FormElements/TieredCheckboxes/TieredCheckboxes.tsx
 import { jsx as jsx80 } from "react/jsx-runtime";
 import { createElement as createElement3 } from "react";
@@ -13681,6 +13726,9 @@ var TieredCheckboxes = ({
 };
 var TieredCheckboxes_default = TieredCheckboxes;
 
+// src/Atomic/FormElements/TieredCheckboxes/index.ts
+var TieredCheckboxes_default2 = TieredCheckboxes_default;
+
 // src/Atomic/FormElements/TimeRange/TimeRange.tsx
 import { jsx as jsx81, jsxs as jsxs68 } from "react/jsx-runtime";
 
@@ -15460,6 +15508,8 @@ function InputPassword({ field = { value: "" }, onChange = () => {
 var InputPassword_default = InputPassword;
 export {
   ALL_TIME_KEY,
+  ANDROID_CHROME_TEXT_CODE,
+  AccordionWithCheckbox_default as AccordionWithCheckbox,
   ActionAlert_default2 as ActionAlert,
   AdvancedStatus_default2 as AdvancedStatus,
   CUSTOM_INTERVAL_KEY,
@@ -15467,69 +15517,93 @@ export {
   Calendar_default as Calendar,
   CheckboxInput_default2 as CheckboxInput,
   CheckboxesLine_default2 as CheckboxesLine,
+  DEFAULT_ERRORS,
+  DIGIT_MASK_CHAR,
+  DateInput_default as DateInput,
   Datepicker_default as Datepicker,
-  Dropdown_default as Dropdown,
+  DatepickerCalendar_default as DatepickerCalendar,
+  Dropdown_default2 as Dropdown,
   DropdownLiveSearch_default as DropdownLiveSearch,
+  EXCLUDED_KEYS,
   FileLoader_default as FileLoader,
   FileLoaderDescription_default as FileLoaderDescription,
   FileLoaderLocal_default as FileLoaderLocal,
   FileLoaderLocalGroup_default as FileLoaderLocalGroup,
   FormElement_default as FormElement,
   FormWithDependOn_default as FormWithDependOn,
-  FormattedRawSSN_default as FormattedRawSSN,
+  FormattedRawSSN_default2 as FormattedRawSSN,
   INTERVALS,
-  Input_default as Input,
+  Input_default2 as Input,
   InputAddress_default as InputAddress,
   InputCalendar_default as InputCalendar,
-  InputColor_default as InputColor,
+  InputColor_default2 as InputColor,
   InputCurrency_default as InputCurrency,
   InputCustomFetch_default as InputCustomFetch,
   InputDateRange_default as InputDateRange,
-  InputLink_default as InputLink,
+  Datepicker_default2 as InputDateRangeDatepicker,
+  InputLink_default2 as InputLink,
   InputMask_default as InputMask,
   InputMask3_default as InputMask3,
   InputPassword_default as InputPassword,
-  InputWithAction_default as InputWithAction,
-  InputsRow_default as InputsRow,
+  InputWithAction_default2 as InputWithAction,
+  InputsRow_default2 as InputsRow,
+  LOWERCASE_LETTER_MASK_CHAR,
   Label_default2 as Label,
+  LoadZone_default as LoadZone,
+  LoadedContent_default as LoadedContent,
   MAIN_DATE_FORMAT,
   MAIN_FORMAT,
   MAIN_TIME_FORMAT,
-  MIN_ITEMS_FOR_SHOW_MOBILE_SEARCH,
   MobileCalendar_default as MobileCalendar,
   MultiSelect_default as MultiSelect,
   NumericInput_default as NumericInput,
+  OpenedPart_default as OpenedPart,
   RadioGroup_default as RadioGroup,
   RadioGroupWithInput_default as RadioGroupWithInput,
-  RadioInput_default as RadioInput,
+  RadioInput_default2 as RadioInput,
   RadioRowSwitcher_default as RadioRowSwitcher,
   RangeCalendar_default as RangeCalendar,
-  RangeInputs_default as RangeInputs,
-  RangeList_default as RangeList,
+  RangeInputs_default2 as RangeInputs,
+  RangeList_default2 as RangeList,
+  RangeListRow_default as RangeListRow,
   RangeSlider,
   RangeSlider2_default as RangeSlider2,
+  SPACE_CHAR,
+  SelectItem_default as SelectItem,
   SwitchableRow_default as SwitchableRow,
-  Switcher_default as Switcher,
+  Switcher_default2 as Switcher,
   SwitcherCheckbox_default as SwitcherCheckbox,
-  SwitcherHide_default as SwitcherHide,
-  SwitcherRadio_default as SwitcherRadio,
-  SwitcherRange_default as SwitcherRange,
+  SwitcherHide_default2 as SwitcherHide,
+  SwitcherRadio_default2 as SwitcherRadio,
+  SwitcherRange_default2 as SwitcherRange,
   SwitcherRangeList_default as SwitcherRangeList,
   SwitcherTagsDropdown_default as SwitcherTagsDropdown,
   SwitcherTextarea_default as SwitcherTextarea,
   TagListToDropdown_default as TagListToDropdown,
   TagsDropdown_default as TagsDropdown,
-  Text_default as Text,
+  Text_default2 as Text,
   TextSwitcher_default as TextSwitcher,
   Textarea_default as Textarea,
-  TieredCheckboxes_default as TieredCheckboxes,
+  TieredCheckboxes_default2 as TieredCheckboxes,
   TimeRange_default2 as TimeRange,
+  UPPERCASE_LETTER_MASK_CHAR,
   UserContacts_default2 as UserContacts,
   VariantsListRadio_default as VariantsListRadio,
   WidgetPseudoTable_default as WidgetPseudoTable,
   WidgetWithSwitchableRows_default as WidgetWithSwitchableRows,
+  copyToClipboard,
   getActualDateRange,
-  getIsDateValid
+  getIsDateValid,
+  getSelectionText,
+  isDigit,
+  isDigitMaskChar,
+  isLetter,
+  isLetterMaskChar,
+  isLowerCaseLetter,
+  isUpperCaseLetter,
+  resetSelectionText,
+  selectElementContents,
+  voidFn
 };
 //! Важно! Если придет велью с количеством дробных разрядов БОЛЬШИМ
 //! чем указано в quantity - округлит по правилам округления