intelicoreact 1.5.38 → 1.5.41

package/dist/Atomic/FormElements/MobileCalendar/MobileCalendar.js

@@ -1,201 +1,194 @@
 "use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
-    value: true
+  value: true
 });
-Object.defineProperty(exports, "default", {
-    enumerable: true,
-    get: function() {
-        return _default;
-    }
-});
-const _jsxruntime = require("react/jsx-runtime");
-const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
-const _moment = /*#__PURE__*/ _interop_require_default(require("moment"));
-const _reactfeather = require("react-feather");
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _moment = _interopRequireDefault(require("moment"));
+var _reactFeather = require("react-feather");
 require("./MobileCalendar.scss");
-function _interop_require_default(obj) {
-    return obj && obj.__esModule ? obj : {
-        default: obj
-    };
-}
-function _getRequireWildcardCache(nodeInterop) {
-    if (typeof WeakMap !== "function") return null;
-    var cacheBabelInterop = new WeakMap();
-    var cacheNodeInterop = new WeakMap();
-    return (_getRequireWildcardCache = function(nodeInterop) {
-        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
-    })(nodeInterop);
-}
-function _interop_require_wildcard(obj, nodeInterop) {
-    if (!nodeInterop && obj && obj.__esModule) {
-        return obj;
-    }
-    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
-        return {
-            default: obj
-        };
-    }
-    var cache = _getRequireWildcardCache(nodeInterop);
-    if (cache && cache.has(obj)) {
-        return cache.get(obj);
-    }
-    var newObj = {
-        __proto__: null
-    };
-    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
-    for(var key in obj){
-        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
-            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
-            if (desc && (desc.get || desc.set)) {
-                Object.defineProperty(newObj, key, desc);
-            } else {
-                newObj[key] = obj[key];
-            }
-        }
-    }
-    newObj.default = obj;
-    if (cache) {
-        cache.set(obj, newObj);
-    }
-    return newObj;
-}
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 require("../../../Functions/customEventListener");
-const MobileCalendar = ({ min = (0, _moment.default)().subtract("10", "years"), max = (0, _moment.default)().add("10", "years"), value = (0, _moment.default)(), rows = 5, label = "", timeout = 75, isMobile = true, showSelectedDate = false, listItemHeight = 32, classes = {
-    wrapper: "",
-    label: "",
-    body: "",
-    yearsBlock: "",
-    yearsList: "",
-    yearsListItem: "",
-    monthsBlock: "",
-    monthsList: "",
-    monthsListItem: "",
-    daysBlock: "",
-    daysList: "",
-    daysListItem: "",
-    prevItem: "",
-    nextItem: "",
-    activeItem: ""
-}, onChange = ()=>{}, onMinDateReached = ()=>{}, onMaxDateReached = ()=>{} })=>{
-    const Body = document.querySelector("body");
-    const listItem = document.querySelector(".mobile-calendar_wrapper_body_months-list--item");
-    const [date, setDate] = (0, _react.useState)(value ? (0, _moment.default)(value) : (0, _moment.default)());
-    const [minDate, setMinDate] = (0, _react.useState)((0, _moment.default)(min));
-    const [maxDate, setMaxDate] = (0, _react.useState)((0, _moment.default)(max));
-    const [isMouseDown, setIsMouseDown] = (0, _react.useState)(false);
-    const [mouseDownOn, setMouseDownOn] = (0, _react.useState)(null);
-    const [changeInterval, setChangeInterval] = (0, _react.useState)(null);
-    const [touchY, setTouchY] = (0, _react.useState)(null);
-    const [touchType, setTouchType] = (0, _react.useState)(null);
-    const [touchTimestamp, setTouchTimestamp] = (0, _react.useState)(null);
-    const [scrollDirection, setScrollDirection] = (0, _react.useState)(0);
-    const monthsListRef = (0, _react.useRef)(null);
-    const daysListRef = (0, _react.useRef)(null);
-    const yearsListRef = (0, _react.useRef)(null);
-    const dateRef = (0, _react.useRef)(null);
-    const intervalRef = (0, _react.useRef)(null);
-    //--HANDLERS--//
-    const changeItem = (type, value)=>{
-        setScrollDirection(value);
-        setDate((date)=>{
-            const newDate = (0, _moment.default)(date).add(value, type);
-            if ((0, _moment.default)(newDate).isBefore(minDate)) return minDate;
-            if ((0, _moment.default)(newDate).isAfter(maxDate)) return maxDate;
-            return newDate;
-        });
-        setTimeout(()=>{
-            setScrollDirection(0);
-        }, 50);
-    };
-    const checkAvailability = (type, value)=>{
-        if (!(dateRef === null || dateRef === void 0 ? void 0 : dateRef.current)) return false;
-        const newDate = (0, _moment.default)(dateRef === null || dateRef === void 0 ? void 0 : dateRef.current).add(value, type);
-        if ((0, _moment.default)(newDate).isBefore(minDate)) return false;
-        if ((0, _moment.default)(newDate).isAfter(maxDate)) return false;
-        return true;
-    };
-    const onArrowMouseDown = (type, value)=>{
-        setIsMouseDown(true);
-        setMouseDownOn({
-            type,
-            value
-        });
-    };
-    const onArrowMouseUp = ()=>{
-        setIsMouseDown(false);
-        setMouseDownOn(null);
-    };
-    const onWheel = (e, type)=>{
-        e.preventDefault();
-        const { deltaY } = e;
-        const top = window.scrollX;
-        const left = window.scrollY;
-        window.scrollTo({
-            top,
-            left
-        });
-        changeItem(type, deltaY < 0 ? -1 : 1);
-    };
-    const onTouchStart = (e, type)=>{
-        e.preventDefault();
-        if (intervalRef === null || intervalRef === void 0 ? void 0 : intervalRef.current) {
-            clearInterval(intervalRef === null || intervalRef === void 0 ? void 0 : intervalRef.current);
-            intervalRef.current = null;
-        }
-        const { timeStamp, changedTouches } = e;
-        const { pageY } = changedTouches[0];
-        setTouchY(pageY);
-        setTouchTimestamp(timeStamp);
-        setTouchType(type);
-        window.addEventListener("touchend", (e)=>onTouchEnd(e, pageY, timeStamp, type), {
-            once: true
-        });
-    };
-    const onTouchMove = (e)=>{
-        if (!touchY || !touchType) return;
-        const { timeStamp, changedTouches } = e;
-        const { pageY } = changedTouches[0];
-        const deltaY = touchY - pageY;
-        if (Math.abs(deltaY) < listItemHeight) return;
-        const direction = deltaY < 0 ? -1 : 1;
-        setScrollDirection(direction);
-        changeItem(touchType, direction);
-        setTouchY(pageY);
-        setTouchTimestamp(timeStamp);
-    };
-    const onTouchEnd = (e, startY, startTime, touchType)=>{
-        const { timeStamp, changedTouches } = e;
-        const { pageY } = changedTouches[0];
-        const path = Math.abs(startY - pageY); //in px
-        const time = timeStamp - startTime; //ms
-        const pxPerMs = path / time;
-        if (pxPerMs > 0.65) innertionScroll({
-            startY,
-            pageY,
-            timeStamp,
-            startTime,
-            touchType
-        });
-        else setTouchType(null);
-        setTouchY(null);
-    };
-    const innertionScroll = ({ startY, pageY, timeStamp, startTime, touchType })=>{
-        const path = Math.abs(startY - pageY); //in px
-        const time = timeStamp - startTime; //ms
-        const pxPerMs = Math.ceil(path / time); //speed
-        const S = pxPerMs / 2 * time;
-        const blocks = Math.ceil(S / listItemHeight * pxPerMs);
-        let i = 1;
-        intervalRef.current = setInterval(()=>{
-            if (checkAvailability(touchType, startY - pageY < 0 ? -1 : 1, date) && i <= blocks) {
-                changeItem(touchType, startY - pageY < 0 ? -1 : 1);
-            } else {
-                setTouchType(null);
-                clearInterval(intervalRef === null || intervalRef === void 0 ? void 0 : intervalRef.current);
-                intervalRef.current = null;
-            }
-            ++i;
-        }, timeout);
+const MobileCalendar = _ref => {
+  let {
+    min = (0, _moment.default)().subtract("10", "years"),
+    max = (0, _moment.default)().add("10", "years"),
+    value = (0, _moment.default)(),
+    rows = 5,
+    label = "",
+    timeout = 75,
+    isMobile = true,
+    showSelectedDate = false,
+    listItemHeight = 32,
+    classes = {
+      wrapper: "",
+      label: "",
+      body: "",
+      yearsBlock: "",
+      yearsList: "",
+      yearsListItem: "",
+      monthsBlock: "",
+      monthsList: "",
+      monthsListItem: "",
+      daysBlock: "",
+      daysList: "",
+      daysListItem: "",
+      prevItem: "",
+      nextItem: "",
+      activeItem: ""
+    },
+    onChange = () => {},
+    onMinDateReached = () => {},
+    onMaxDateReached = () => {}
+  } = _ref;
+  const Body = document.querySelector("body");
+  const listItem = document.querySelector(".mobile-calendar_wrapper_body_months-list--item");
+  const [date, setDate] = (0, _react.useState)(value ? (0, _moment.default)(value) : (0, _moment.default)());
+  const [minDate, setMinDate] = (0, _react.useState)((0, _moment.default)(min));
+  const [maxDate, setMaxDate] = (0, _react.useState)((0, _moment.default)(max));
+  const [isMouseDown, setIsMouseDown] = (0, _react.useState)(false);
+  const [mouseDownOn, setMouseDownOn] = (0, _react.useState)(null);
+  const [changeInterval, setChangeInterval] = (0, _react.useState)(null);
+  const [touchY, setTouchY] = (0, _react.useState)(null);
+  const [touchType, setTouchType] = (0, _react.useState)(null);
+  const [touchTimestamp, setTouchTimestamp] = (0, _react.useState)(null);
+  const [scrollDirection, setScrollDirection] = (0, _react.useState)(0);
+  const monthsListRef = (0, _react.useRef)(null);
+  const daysListRef = (0, _react.useRef)(null);
+  const yearsListRef = (0, _react.useRef)(null);
+  const dateRef = (0, _react.useRef)(null);
+  const intervalRef = (0, _react.useRef)(null);
+
+  //--HANDLERS--//
+  const changeItem = (type, value) => {
+    setScrollDirection(value);
+    setDate(date => {
+      const newDate = (0, _moment.default)(date).add(value, type);
+      if ((0, _moment.default)(newDate).isBefore(minDate)) return minDate;
+      if ((0, _moment.default)(newDate).isAfter(maxDate)) return maxDate;
+      return newDate;
+    });
+    setTimeout(() => {
+      setScrollDirection(0);
+    }, 50);
+  };
+  const checkAvailability = (type, value) => {
+    if (!dateRef?.current) return false;
+    const newDate = (0, _moment.default)(dateRef?.current).add(value, type);
+    if ((0, _moment.default)(newDate).isBefore(minDate)) return false;
+    if ((0, _moment.default)(newDate).isAfter(maxDate)) return false;
+    return true;
+  };
+  const onArrowMouseDown = (type, value) => {
+    setIsMouseDown(true);
+    setMouseDownOn({
+      type,
+      value
+    });
+  };
+  const onArrowMouseUp = () => {
+    setIsMouseDown(false);
+    setMouseDownOn(null);
+  };
+  const onWheel = (e, type) => {
+    e.preventDefault();
+    const {
+      deltaY
+    } = e;
+    const top = window.scrollX;
+    const left = window.scrollY;
+    window.scrollTo({
+      top,
+      left
+    });
+    changeItem(type, deltaY < 0 ? -1 : 1);
+  };
+  const onTouchStart = (e, type) => {
+    e.preventDefault();
+    if (intervalRef?.current) {
+      clearInterval(intervalRef?.current);
+      intervalRef.current = null;
+    }
+    const {
+      timeStamp,
+      changedTouches
+    } = e;
+    const {
+      pageY
+    } = changedTouches[0];
+    setTouchY(pageY);
+    setTouchTimestamp(timeStamp);
+    setTouchType(type);
+    window.addEventListener("touchend", e => onTouchEnd(e, pageY, timeStamp, type), {
+      once: true
+    });
+  };
+  const onTouchMove = e => {
+    if (!touchY || !touchType) return;
+    const {
+      timeStamp,
+      changedTouches
+    } = e;
+    const {
+      pageY
+    } = changedTouches[0];
+    const deltaY = touchY - pageY;
+    if (Math.abs(deltaY) < listItemHeight) return;
+    const direction = deltaY < 0 ? -1 : 1;
+    setScrollDirection(direction);
+    changeItem(touchType, direction);
+    setTouchY(pageY);
+    setTouchTimestamp(timeStamp);
+  };
+  const onTouchEnd = (e, startY, startTime, touchType) => {
+    const {
+      timeStamp,
+      changedTouches
+    } = e;
+    const {
+      pageY
+    } = changedTouches[0];
+    const path = Math.abs(startY - pageY); //in px
+    const time = timeStamp - startTime; //ms
+    const pxPerMs = path / time;
+    if (pxPerMs > 0.65) innertionScroll({
+      startY,
+      pageY,
+      timeStamp,
+      startTime,
+      touchType
+    });else setTouchType(null);
+    setTouchY(null);
+  };
+  const innertionScroll = _ref2 => {
+    let {
+      startY,
+      pageY,
+      timeStamp,
+      startTime,
+      touchType
+    } = _ref2;
+    const path = Math.abs(startY - pageY); //in px
+    const time = timeStamp - startTime; //ms
+    const pxPerMs = Math.ceil(path / time); //speed
+
+    const S = pxPerMs / 2 * time;
+    const blocks = Math.ceil(S / listItemHeight * pxPerMs);
+    let i = 1;
+    intervalRef.current = setInterval(() => {
+      if (checkAvailability(touchType, startY - pageY < 0 ? -1 : 1, date) && i <= blocks) {
+        changeItem(touchType, startY - pageY < 0 ? -1 : 1);
+      } else {
+        setTouchType(null);
+        clearInterval(intervalRef?.current);
+        intervalRef.current = null;
+      }
+      ++i;
+    }, timeout);
+
     // for(let i = 1; i <= blocks; ++i){
     //   // timeout = i*pxPerMs+Math.pow(i,2)*10;
     //   timeout += 80;
@@ -205,253 +198,205 @@ const MobileCalendar = ({ min = (0, _moment.default)().subtract("10", "years"),
     //       changeItem(touchType, startY-pageY < 0 ? -1 : 1);
     //     }, timeout)
     //   }
+
     // }
+  };
+
+  //--FUNCTIONS--//
+  const intervalWorker = () => {
+    if (!mouseDownOn) return;
+    const {
+      type,
+      value
+    } = mouseDownOn;
+    changeItem(type, value);
+  };
+  const getList = (type, format) => {
+    const list = [];
+    const renderRows = rows;
+    for (let i = (renderRows - 1) / 2; i >= (renderRows - 1) / 2 * -1; --i) {
+      list.push((0, _moment.default)(date).subtract(i, type).format(format));
+    }
+    return list;
+  };
+  const getMonthList = () => getList("months", "MMMM");
+  const getDaysList = () => getList("days", "D");
+  const getYearsList = () => getList("years", "YYYY");
+
+  //--OBSERVERS--//
+  (0, _react.useEffect)(() => {
+    if ((0, _moment.default)(date.format("L")).isBefore(minDate.format("L"))) setDate(minDate);
+    if ((0, _moment.default)(date.format("L")).isAfter(maxDate.format("L"))) setDate(maxDate);
+  }, []);
+
+  //Events Observer
+  (0, _react.useEffect)(() => {
+    document.addEventListener("mouseup", onArrowMouseUp);
+    return () => {
+      document.removeEventListener("mouseup", onArrowMouseUp);
     };
-    //--FUNCTIONS--//
-    const intervalWorker = ()=>{
-        if (!mouseDownOn) return;
-        const { type, value } = mouseDownOn;
-        changeItem(type, value);
-    };
-    const getList = (type, format)=>{
-        const list = [];
-        const renderRows = rows;
-        for(let i = (renderRows - 1) / 2; i >= (renderRows - 1) / 2 * -1; --i){
-            list.push((0, _moment.default)(date).subtract(i, type).format(format));
-        }
-        return list;
-    };
-    const getMonthList = ()=>getList("months", "MMMM");
-    const getDaysList = ()=>getList("days", "D");
-    const getYearsList = ()=>getList("years", "YYYY");
-    //--OBSERVERS--//
-    (0, _react.useEffect)(()=>{
-        if ((0, _moment.default)(date.format("L")).isBefore(minDate.format("L"))) setDate(minDate);
-        if ((0, _moment.default)(date.format("L")).isAfter(maxDate.format("L"))) setDate(maxDate);
-    }, []);
-    //Events Observer
-    (0, _react.useEffect)(()=>{
-        document.addEventListener("mouseup", onArrowMouseUp);
-        return ()=>{
-            document.removeEventListener("mouseup", onArrowMouseUp);
-        };
-    }, []);
-    (0, _react.useEffect)(()=>{
-        onChange(date);
-        dateRef.current = date;
-        if ((0, _moment.default)(date.format("L")).isSame(minDate.format("L"))) onMinDateReached(minDate);
-        if ((0, _moment.default)(date.format("L")).isSame(maxDate.format("L"))) onMaxDateReached(maxDate);
-    }, [
-        date
-    ]);
-    //monthList Events
-    (0, _react.useEffect)(()=>{
-        if (monthsListRef === null || monthsListRef === void 0 ? void 0 : monthsListRef.current) {
-            var _monthsListRef_current, _monthsListRef_current1;
-            monthsListRef === null || monthsListRef === void 0 ? void 0 : (_monthsListRef_current = monthsListRef.current) === null || _monthsListRef_current === void 0 ? void 0 : _monthsListRef_current.addEventListener("mousewheel", (e)=>onWheel(e, "months"), {
-                passive: false
-            });
-            monthsListRef === null || monthsListRef === void 0 ? void 0 : (_monthsListRef_current1 = monthsListRef.current) === null || _monthsListRef_current1 === void 0 ? void 0 : _monthsListRef_current1.addEventListener("touchstart", (e)=>onTouchStart(e, "months"), {
-                passive: false
-            });
-        }
-        return ()=>{
-            var _monthsListRef_current, _monthsListRef_current1;
-            monthsListRef === null || monthsListRef === void 0 ? void 0 : (_monthsListRef_current = monthsListRef.current) === null || _monthsListRef_current === void 0 ? void 0 : _monthsListRef_current.clearEventListeners("mousewheel");
-            monthsListRef === null || monthsListRef === void 0 ? void 0 : (_monthsListRef_current1 = monthsListRef.current) === null || _monthsListRef_current1 === void 0 ? void 0 : _monthsListRef_current1.clearEventListeners("touchstart");
-        };
-    }, [
-        monthsListRef
-    ]);
-    //daysList Events
-    (0, _react.useEffect)(()=>{
-        if (daysListRef === null || daysListRef === void 0 ? void 0 : daysListRef.current) {
-            var _daysListRef_current, _daysListRef_current1;
-            daysListRef === null || daysListRef === void 0 ? void 0 : (_daysListRef_current = daysListRef.current) === null || _daysListRef_current === void 0 ? void 0 : _daysListRef_current.addEventListener("mousewheel", (e)=>onWheel(e, "days"), {
-                passive: false
-            });
-            daysListRef === null || daysListRef === void 0 ? void 0 : (_daysListRef_current1 = daysListRef.current) === null || _daysListRef_current1 === void 0 ? void 0 : _daysListRef_current1.addEventListener("touchstart", (e)=>onTouchStart(e, "days"), {
-                passive: false
-            });
-        }
-        return ()=>{
-            var _daysListRef_current, _daysListRef_current1;
-            daysListRef === null || daysListRef === void 0 ? void 0 : (_daysListRef_current = daysListRef.current) === null || _daysListRef_current === void 0 ? void 0 : _daysListRef_current.clearEventListeners("mousewheel");
-            daysListRef === null || daysListRef === void 0 ? void 0 : (_daysListRef_current1 = daysListRef.current) === null || _daysListRef_current1 === void 0 ? void 0 : _daysListRef_current1.clearEventListeners("touchstart");
-        };
-    }, [
-        daysListRef
-    ]);
-    //yearsList Events
-    (0, _react.useEffect)(()=>{
-        if (yearsListRef === null || yearsListRef === void 0 ? void 0 : yearsListRef.current) {
-            var _yearsListRef_current, _yearsListRef_current1;
-            yearsListRef === null || yearsListRef === void 0 ? void 0 : (_yearsListRef_current = yearsListRef.current) === null || _yearsListRef_current === void 0 ? void 0 : _yearsListRef_current.addEventListener("mousewheel", (e)=>onWheel(e, "years"), {
-                passive: false
-            });
-            yearsListRef === null || yearsListRef === void 0 ? void 0 : (_yearsListRef_current1 = yearsListRef.current) === null || _yearsListRef_current1 === void 0 ? void 0 : _yearsListRef_current1.addEventListener("touchstart", (e)=>onTouchStart(e, "years"), {
-                passive: false
-            });
-        }
-        return ()=>{
-            var _yearsListRef_current, _yearsListRef_current1;
-            yearsListRef === null || yearsListRef === void 0 ? void 0 : (_yearsListRef_current = yearsListRef.current) === null || _yearsListRef_current === void 0 ? void 0 : _yearsListRef_current.clearEventListeners("mousewheel");
-            yearsListRef === null || yearsListRef === void 0 ? void 0 : (_yearsListRef_current1 = yearsListRef.current) === null || _yearsListRef_current1 === void 0 ? void 0 : _yearsListRef_current1.clearEventListeners("touchstart");
-        };
-    }, [
-        yearsListRef
-    ]);
-    //--RENDER--//
-    const renderMonthsList = ()=>{
-        const half = (rows - 1) / 2;
-        return getMonthList().map((month, i)=>/*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
-                className: `mobile-calendar_wrapper_body_months-list--item ${i === half ? "active" : ""} ${i === 0 || i === rows - 1 ? "transparent" : ""} ${classes === null || classes === void 0 ? void 0 : classes.monthsListItem} ${i === half ? classes === null || classes === void 0 ? void 0 : classes.activeItem : ""}`,
-                onClick: touchY ? null : ()=>i - half === 0 ? {} : changeItem("months", i - half),
-                "attr-scroll-direction": touchType === "months" ? scrollDirection : 0,
-                "attr-is-scrolling": touchType === "months" ? 1 : 0,
-                children: month
-            }, `month-${month}`));
-    };
-    const renderDaysList = ()=>{
-        const half = (rows - 1) / 2;
-        return getDaysList().map((day, i)=>/*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
-                className: `mobile-calendar_wrapper_body_days-list--item ${i === half ? "active" : ""} ${i === 0 || i === rows - 1 ? "transparent" : ""} ${classes === null || classes === void 0 ? void 0 : classes.daysListItem} ${i === half ? classes === null || classes === void 0 ? void 0 : classes.activeItem : ""}`,
-                onClick: ()=>i - half === 0 ? {} : changeItem("days", i - half),
-                "attr-scroll-direction": touchType === "days" ? scrollDirection : 0,
-                "attr-is-scrolling": touchType === "days" ? 1 : 0,
-                children: day
-            }, `day-${day}`));
-    };
-    const renderYearsList = ()=>{
-        const half = (rows - 1) / 2;
-        return getYearsList().map((year, i)=>/*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
-                className: `mobile-calendar_wrapper_body_years-list--item ${i === half ? "active" : ""} ${i === 0 || i === rows - 1 ? "transparent" : ""} ${classes === null || classes === void 0 ? void 0 : classes.yearsListItem} ${i === half ? classes === null || classes === void 0 ? void 0 : classes.activeItem : ""}`,
-                onClick: ()=>i - half === 0 ? {} : changeItem("years", i - half),
-                "attr-scroll-direction": touchType === "years" ? scrollDirection : 0,
-                "attr-is-scrolling": touchType === "years" ? 1 : 0,
-                children: year
-            }, `year-${year}`));
-    };
-    const renderMonthsBlock = ()=>{
-        return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
-            className: `mobile-calendar_wrapper_body_months ${classes === null || classes === void 0 ? void 0 : classes.monthsBlock}`,
-            children: [
-                /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
-                    className: `mobile-calendar_wrapper_body_months--prev ${classes === null || classes === void 0 ? void 0 : classes.prevItem}`,
-                    children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactfeather.ChevronUp, {
-                        onClick: ()=>changeItem("months", -1),
-                        onMouseDown: ()=>onArrowMouseDown("months", -1),
-                        onMouseUp: onArrowMouseUp
-                    })
-                }),
-                /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
-                    className: `mobile-calendar_wrapper_body_months-list ${classes === null || classes === void 0 ? void 0 : classes.monthsList}`,
-                    ref: monthsListRef,
-                    children: [
-                        renderMonthsList(),
-                        isMobile && /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
-                            className: "mobile-calendar_wrapper_body_months-list_touch-zone"
-                        })
-                    ]
-                }),
-                /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
-                    className: `mobile-calendar_wrapper_body_months--next ${classes === null || classes === void 0 ? void 0 : classes.nextItem}`,
-                    children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactfeather.ChevronDown, {
-                        onClick: ()=>changeItem("months", 1),
-                        onMouseDown: ()=>onArrowMouseDown("months", 1),
-                        onMouseUp: onArrowMouseUp
-                    })
-                })
-            ]
-        });
+  }, []);
+  (0, _react.useEffect)(() => {
+    onChange(date);
+    dateRef.current = date;
+    if ((0, _moment.default)(date.format("L")).isSame(minDate.format("L"))) onMinDateReached(minDate);
+    if ((0, _moment.default)(date.format("L")).isSame(maxDate.format("L"))) onMaxDateReached(maxDate);
+  }, [date]);
+
+  //monthList Events
+  (0, _react.useEffect)(() => {
+    if (monthsListRef?.current) {
+      monthsListRef?.current?.addEventListener("mousewheel", e => onWheel(e, "months"), {
+        passive: false
+      });
+      monthsListRef?.current?.addEventListener("touchstart", e => onTouchStart(e, "months"), {
+        passive: false
+      });
+    }
+    return () => {
+      monthsListRef?.current?.clearEventListeners("mousewheel");
+      monthsListRef?.current?.clearEventListeners("touchstart");
     };
-    const renderDaysBlock = ()=>{
-        return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
-            className: `mobile-calendar_wrapper_body_days ${classes === null || classes === void 0 ? void 0 : classes.daysBlock}`,
-            children: [
-                /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
-                    className: `mobile-calendar_wrapper_body_days--prev ${classes === null || classes === void 0 ? void 0 : classes.prevItem}`,
-                    children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactfeather.ChevronUp, {
-                        onClick: ()=>changeItem("days", -1),
-                        onMouseDown: ()=>onArrowMouseDown("days", -1),
-                        onMouseUp: onArrowMouseUp
-                    })
-                }),
-                /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
-                    className: `mobile-calendar_wrapper_body_days-list ${classes === null || classes === void 0 ? void 0 : classes.daysList}`,
-                    ref: daysListRef,
-                    children: [
-                        renderDaysList(),
-                        isMobile && /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
-                            className: "mobile-calendar_wrapper_body_days-list_touch-zone"
-                        })
-                    ]
-                }),
-                /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
-                    className: `mobile-calendar_wrapper_body_days--next ${classes === null || classes === void 0 ? void 0 : classes.nextItem}`,
-                    children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactfeather.ChevronDown, {
-                        onClick: ()=>changeItem("days", 1),
-                        onMouseDown: ()=>onArrowMouseDown("days", 1),
-                        onMouseUp: onArrowMouseUp
-                    })
-                })
-            ]
-        });
+  }, [monthsListRef]);
+
+  //daysList Events
+  (0, _react.useEffect)(() => {
+    if (daysListRef?.current) {
+      daysListRef?.current?.addEventListener("mousewheel", e => onWheel(e, "days"), {
+        passive: false
+      });
+      daysListRef?.current?.addEventListener("touchstart", e => onTouchStart(e, "days"), {
+        passive: false
+      });
+    }
+    return () => {
+      daysListRef?.current?.clearEventListeners("mousewheel");
+      daysListRef?.current?.clearEventListeners("touchstart");
     };
-    const renderYearsBlock = ()=>{
-        return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
-            className: `mobile-calendar_wrapper_body_years ${classes === null || classes === void 0 ? void 0 : classes.yearsBlock}`,
-            children: [
-                /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
-                    className: `mobile-calendar_wrapper_body_years--prev ${classes === null || classes === void 0 ? void 0 : classes.prevItem}`,
-                    children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactfeather.ChevronUp, {
-                        onClick: ()=>changeItem("years", -1),
-                        onMouseDown: ()=>onArrowMouseDown("years", -1),
-                        onMouseUp: onArrowMouseUp
-                    })
-                }),
-                /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
-                    className: `mobile-calendar_wrapper_body_years-list ${classes === null || classes === void 0 ? void 0 : classes.yearsList}`,
-                    ref: yearsListRef,
-                    children: [
-                        renderYearsList(),
-                        isMobile && /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
-                            className: "mobile-calendar_wrapper_body_years-list_touch-zone"
-                        })
-                    ]
-                }),
-                /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
-                    className: `mobile-calendar_wrapper_body_years--next ${classes === null || classes === void 0 ? void 0 : classes.nextItem}`,
-                    children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactfeather.ChevronDown, {
-                        onClick: ()=>changeItem("years", 1),
-                        onMouseDown: ()=>onArrowMouseDown("years", 1),
-                        onMouseUp: onArrowMouseUp
-                    })
-                })
-            ]
-        });
+  }, [daysListRef]);
+
+  //yearsList Events
+  (0, _react.useEffect)(() => {
+    if (yearsListRef?.current) {
+      yearsListRef?.current?.addEventListener("mousewheel", e => onWheel(e, "years"), {
+        passive: false
+      });
+      yearsListRef?.current?.addEventListener("touchstart", e => onTouchStart(e, "years"), {
+        passive: false
+      });
+    }
+    return () => {
+      yearsListRef?.current?.clearEventListeners("mousewheel");
+      yearsListRef?.current?.clearEventListeners("touchstart");
     };
-    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
-        className: `mobile-calendar_wrapper ${classes === null || classes === void 0 ? void 0 : classes.wrapper}`,
-        onTouchMove: onTouchMove,
-        children: [
-            /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
-                className: `mobile-calendar_wrapper_label ${classes === null || classes === void 0 ? void 0 : classes.label}`,
-                children: label
-            }),
-            showSelectedDate && /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
-                className: `mobile-calendar_wrapper_label  ${classes === null || classes === void 0 ? void 0 : classes.label}`,
-                children: (0, _moment.default)(date).format("LL")
-            }),
-            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
-                className: `mobile-calendar_wrapper_body  ${classes === null || classes === void 0 ? void 0 : classes.body}`,
-                children: [
-                    renderMonthsBlock(),
-                    renderDaysBlock(),
-                    renderYearsBlock()
-                ]
-            })
-        ]
-    });
+  }, [yearsListRef]);
+
+  //--RENDER--//
+  const renderMonthsList = () => {
+    const half = (rows - 1) / 2;
+    return getMonthList().map((month, i) => /*#__PURE__*/_react.default.createElement("div", {
+      className: `mobile-calendar_wrapper_body_months-list--item ${i === half ? "active" : ""} ${i === 0 || i === rows - 1 ? "transparent" : ""} ${classes?.monthsListItem} ${i === half ? classes?.activeItem : ""}`,
+      key: `month-${month}`,
+      onClick: touchY ? null : () => i - half === 0 ? {} : changeItem("months", i - half),
+      "attr-scroll-direction": touchType === "months" ? scrollDirection : 0,
+      "attr-is-scrolling": touchType === "months" ? 1 : 0
+    }, month));
+  };
+  const renderDaysList = () => {
+    const half = (rows - 1) / 2;
+    return getDaysList().map((day, i) => /*#__PURE__*/_react.default.createElement("div", {
+      className: `mobile-calendar_wrapper_body_days-list--item ${i === half ? "active" : ""} ${i === 0 || i === rows - 1 ? "transparent" : ""} ${classes?.daysListItem} ${i === half ? classes?.activeItem : ""}`,
+      key: `day-${day}`,
+      onClick: () => i - half === 0 ? {} : changeItem("days", i - half),
+      "attr-scroll-direction": touchType === "days" ? scrollDirection : 0,
+      "attr-is-scrolling": touchType === "days" ? 1 : 0
+    }, day));
+  };
+  const renderYearsList = () => {
+    const half = (rows - 1) / 2;
+    return getYearsList().map((year, i) => /*#__PURE__*/_react.default.createElement("div", {
+      className: `mobile-calendar_wrapper_body_years-list--item ${i === half ? "active" : ""} ${i === 0 || i === rows - 1 ? "transparent" : ""} ${classes?.yearsListItem} ${i === half ? classes?.activeItem : ""}`,
+      key: `year-${year}`,
+      onClick: () => i - half === 0 ? {} : changeItem("years", i - half),
+      "attr-scroll-direction": touchType === "years" ? scrollDirection : 0,
+      "attr-is-scrolling": touchType === "years" ? 1 : 0
+    }, year));
+  };
+  const renderMonthsBlock = () => {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: `mobile-calendar_wrapper_body_months ${classes?.monthsBlock}`
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: `mobile-calendar_wrapper_body_months--prev ${classes?.prevItem}`
+    }, /*#__PURE__*/_react.default.createElement(_reactFeather.ChevronUp, {
+      onClick: () => changeItem("months", -1),
+      onMouseDown: () => onArrowMouseDown("months", -1),
+      onMouseUp: onArrowMouseUp
+    })), /*#__PURE__*/_react.default.createElement("div", {
+      className: `mobile-calendar_wrapper_body_months-list ${classes?.monthsList}`,
+      ref: monthsListRef
+    }, renderMonthsList(), isMobile && /*#__PURE__*/_react.default.createElement("div", {
+      className: "mobile-calendar_wrapper_body_months-list_touch-zone"
+    })), /*#__PURE__*/_react.default.createElement("div", {
+      className: `mobile-calendar_wrapper_body_months--next ${classes?.nextItem}`
+    }, /*#__PURE__*/_react.default.createElement(_reactFeather.ChevronDown, {
+      onClick: () => changeItem("months", 1),
+      onMouseDown: () => onArrowMouseDown("months", 1),
+      onMouseUp: onArrowMouseUp
+    })));
+  };
+  const renderDaysBlock = () => {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: `mobile-calendar_wrapper_body_days ${classes?.daysBlock}`
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: `mobile-calendar_wrapper_body_days--prev ${classes?.prevItem}`
+    }, /*#__PURE__*/_react.default.createElement(_reactFeather.ChevronUp, {
+      onClick: () => changeItem("days", -1),
+      onMouseDown: () => onArrowMouseDown("days", -1),
+      onMouseUp: onArrowMouseUp
+    })), /*#__PURE__*/_react.default.createElement("div", {
+      className: `mobile-calendar_wrapper_body_days-list ${classes?.daysList}`,
+      ref: daysListRef
+    }, renderDaysList(), isMobile && /*#__PURE__*/_react.default.createElement("div", {
+      className: "mobile-calendar_wrapper_body_days-list_touch-zone"
+    })), /*#__PURE__*/_react.default.createElement("div", {
+      className: `mobile-calendar_wrapper_body_days--next ${classes?.nextItem}`
+    }, /*#__PURE__*/_react.default.createElement(_reactFeather.ChevronDown, {
+      onClick: () => changeItem("days", 1),
+      onMouseDown: () => onArrowMouseDown("days", 1),
+      onMouseUp: onArrowMouseUp
+    })));
+  };
+  const renderYearsBlock = () => {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: `mobile-calendar_wrapper_body_years ${classes?.yearsBlock}`
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: `mobile-calendar_wrapper_body_years--prev ${classes?.prevItem}`
+    }, /*#__PURE__*/_react.default.createElement(_reactFeather.ChevronUp, {
+      onClick: () => changeItem("years", -1),
+      onMouseDown: () => onArrowMouseDown("years", -1),
+      onMouseUp: onArrowMouseUp
+    })), /*#__PURE__*/_react.default.createElement("div", {
+      className: `mobile-calendar_wrapper_body_years-list ${classes?.yearsList}`,
+      ref: yearsListRef
+    }, renderYearsList(), isMobile && /*#__PURE__*/_react.default.createElement("div", {
+      className: "mobile-calendar_wrapper_body_years-list_touch-zone"
+    })), /*#__PURE__*/_react.default.createElement("div", {
+      className: `mobile-calendar_wrapper_body_years--next ${classes?.nextItem}`
+    }, /*#__PURE__*/_react.default.createElement(_reactFeather.ChevronDown, {
+      onClick: () => changeItem("years", 1),
+      onMouseDown: () => onArrowMouseDown("years", 1),
+      onMouseUp: onArrowMouseUp
+    })));
+  };
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: `mobile-calendar_wrapper ${classes?.wrapper}`,
+    onTouchMove: onTouchMove
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: `mobile-calendar_wrapper_label ${classes?.label}`
+  }, label), showSelectedDate && /*#__PURE__*/_react.default.createElement("div", {
+    className: `mobile-calendar_wrapper_label  ${classes?.label}`
+  }, (0, _moment.default)(date).format("LL")), /*#__PURE__*/_react.default.createElement("div", {
+    className: `mobile-calendar_wrapper_body  ${classes?.body}`
+  }, renderMonthsBlock(), renderDaysBlock(), renderYearsBlock()));
 };
-const _default = MobileCalendar;
+var _default = exports.default = MobileCalendar;