intelicoreact 1.5.32 → 1.5.34

package/dist/src/Atomic/FormElements/Datepicker/Datepicker.js

@@ -0,0 +1,421 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    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 _classnames = /*#__PURE__*/ _interop_require_default(require("classnames"));
+const _moment = /*#__PURE__*/ _interop_require_default(require("moment"));
+const _Langs = /*#__PURE__*/ _interop_require_default(require("../../../../../Langs"));
+const _Button = /*#__PURE__*/ _interop_require_default(require("../../UI/Button/Button"));
+const _Dropdown = /*#__PURE__*/ _interop_require_default(require("../Dropdown/Dropdown"));
+const _Input = /*#__PURE__*/ _interop_require_default(require("../Input/Input"));
+const _Switcher = /*#__PURE__*/ _interop_require_default(require("../Switcher/Switcher"));
+const _Calendar = /*#__PURE__*/ _interop_require_default(require("./components/Calendar"));
+require("./Datepicker.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;
+}
+const padTime = (time)=>{
+    return `${time.toString().padStart(2, "0")}:00`;
+};
+const Datepicker = (props)=>{
+    const { isCompareHidden, limitRange, onChange = ()=>{}, values = {}, onChangeCompare = ()=>{}, onCancel = ()=>{}, getSelectedMode = ()=>{}, onChangeInterval = ()=>{} } = props;
+    const { start = null, end = null, compare = false } = values;
+    const txt = _Langs.default[global.lng];
+    const startDateInputRef = (0, _react.useRef)(null);
+    const endDateInputRef = (0, _react.useRef)(null);
+    const [startDate, setStartDate] = (0, _react.useState)(start);
+    const [endDate, setEndDate] = (0, _react.useState)(end);
+    const dateInterval = getSelectedMode({
+        start: startDate,
+        end: endDate
+    });
+    const [startDateInput, setStartDateInput] = (0, _react.useState)(start);
+    const [endDateInput, setEndDateInput] = (0, _react.useState)(end);
+    const [startHour, setStartHour] = (0, _react.useState)(start ? (0, _moment.default)(start).hour() : 0);
+    const [endHour, setEndHour] = (0, _react.useState)(end ? (0, _moment.default)(end).hour() : 0);
+    // eslint-disable-next-line no-unused-vars
+    const [isCompare, setIsCompare] = (0, _react.useState)(compare);
+    const [date1, setDate1] = (0, _react.useState)(start ? (0, _moment.default)(start).toDate() : (0, _moment.default)().subtract(1, "month").toDate());
+    const [date2, setDate2] = (0, _react.useState)(end ? (0, _moment.default)(end).toDate() : (0, _moment.default)().toDate());
+    const [isStartFocused, setIsStartFocused] = (0, _react.useState)(false);
+    const [isEndFocused, setIsEndFocused] = (0, _react.useState)(false);
+    const [hoverStatus, setHoverStatus] = (0, _react.useState)(null);
+    const isNearby = (0, _react.useMemo)(()=>(0, _moment.default)(date2).subtract(1, "month").isSame((0, _moment.default)(date1), "month"), [
+        date1,
+        date2
+    ]);
+    const isPreviousPeriodShowed = (0, _react.useMemo)(()=>isCompare && !isCompareHidden && startDate && endDate, [
+        startDate,
+        endDate,
+        isCompare
+    ]);
+    const prevEndHour = (0, _react.useRef)(endHour);
+    const getStartHourItems = ()=>[
+            ...Array(24).keys()
+        ].map((hour)=>({
+                label: padTime(hour),
+                value: hour,
+                disabled: (0, _moment.default)(startDate).isSame(endDate, "day") && endHour <= hour
+            }));
+    const getEndHourItems = ()=>[
+            ...Array(24).keys()
+        ].map((hour)=>({
+                label: padTime(hour + 1),
+                value: hour === 23 ? 0 : hour + 1,
+                disabled: ((0, _moment.default)(startDate).isSame(endDate, "day") || (0, _moment.default)(startDate).isSame((0, _moment.default)(endDate).subtract(1, "days"), "day") && endHour === 0) && hour < startHour
+            }));
+    const startPrevDate = (0, _react.useMemo)(()=>{
+        if (isPreviousPeriodShowed) {
+            const intervalHoursCount = (0, _moment.default)(endDate).diff(startDate, "hours");
+            return (0, _moment.default)(startDate).subtract(intervalHoursCount, "hours").toDate();
+        } else return null;
+    }, [
+        startDate,
+        endDate,
+        isCompare
+    ]);
+    const endPrevDate = (0, _react.useMemo)(()=>{
+        if (isPreviousPeriodShowed) {
+            return startDate;
+        } else return null;
+    }, [
+        startDate,
+        endDate,
+        isCompare
+    ]);
+    const title = (0, _react.useMemo)(()=>{
+        if (isCompare && !isCompareHidden && startDate && endDate) {
+            return `${(0, _moment.default)(startPrevDate).format("ll")} (${(0, _moment.default)(startPrevDate).format("HH:mm")}) - ${(0, _moment.default)(endPrevDate).format("ll")} (${(0, _moment.default)(endPrevDate).format("HH:mm")})`;
+        } else return "";
+    }, [
+        startDate,
+        endDate,
+        isCompare
+    ]);
+    const subtractDay = (date)=>endHour === 0 ? (0, _moment.default)(date).subtract(1, "days") : date;
+    const addDay = (date)=>endHour === 0 ? (0, _moment.default)(date).add(1, "days") : date;
+    (0, _react.useEffect)(()=>{
+        if ((0, _moment.default)(startDate).isSameOrAfter(endDate)) {
+            setStartDate((0, _moment.default)(endDate).subtract(1, "d").toDate());
+            setDate1((0, _moment.default)(endDate).subtract(1, "d"));
+        }
+    }, [
+        startDate
+    ]);
+    (0, _react.useEffect)(()=>{
+        if ((0, _moment.default)(endDate).isSameOrBefore(startDate)) {
+            setEndDate((0, _moment.default)(startDate).add(1, "d").toDate());
+            setDate2((0, _moment.default)(startDate).add(1, "d"));
+        }
+    }, [
+        endDate
+    ]);
+    (0, _react.useEffect)(()=>{
+        setStartDateInput(startDate);
+        setEndDateInput(endDate);
+        if ((0, _moment.default)(startDate).isBefore((0, _moment.default)(endDate), "month")) {
+            setDate1((0, _moment.default)(startDate));
+            setDate2((0, _moment.default)(endDate));
+        }
+    }, [
+        startDate,
+        endDate
+    ]);
+    (0, _react.useEffect)(()=>{
+        if ((0, _moment.default)(date1).isSameOrAfter((0, _moment.default)(date2), "month")) {
+            setDate1((0, _moment.default)(date2).subtract(1, "month"));
+        }
+    }, [
+        date1,
+        date2
+    ]);
+    (0, _react.useEffect)(()=>{
+        onChangeInterval(dateInterval);
+    }, [
+        dateInterval
+    ]);
+    const handleClick = (date)=>{
+        prevEndHour.current = 0;
+        if (!startDate || startDate && endDate && !((0, _moment.default)(startDate).add(1, "d").isSame(endDate, "day") && endHour === 0)) {
+            setStartDate((0, _moment.default)(date).startOf("day").toDate());
+            setEndDate((0, _moment.default)(date).add(1, "d").startOf("day").toDate());
+            setStartHour(0);
+            setEndHour(0);
+        } else if ((0, _moment.default)(date).isBefore((0, _moment.default)(startDate), "day")) {
+            setEndDate((0, _moment.default)(startDate).add(1, "d").startOf("day").toDate());
+            setStartDate((0, _moment.default)(date).set("hour", parseInt(startHour, 10)).toDate());
+        } else if ((0, _moment.default)(date).isAfter((0, _moment.default)(startDate), "day")) {
+            setEndDate((0, _moment.default)(date).add(1, "d").startOf("day").toDate());
+        }
+        setHoverStatus(null);
+    };
+    let timerId;
+    const handleHover = (date)=>{
+        if (!date) {
+            timerId = setTimeout(()=>{
+                setHoverStatus(null);
+            }, 400);
+            return;
+        }
+        if (timerId) clearTimeout(timerId);
+        if ((0, _moment.default)(startDate).add(1, "d").isSame(endDate, "day") && endHour === 0) {
+            if ((0, _moment.default)(date).isAfter((0, _moment.default)(startDate), "day")) setHoverStatus("end");
+            else if ((0, _moment.default)(date).isBefore((0, _moment.default)(startDate), "day")) setHoverStatus("start");
+            else setHoverStatus(null);
+        } else {
+            setHoverStatus("start");
+        }
+    };
+    const handleChangeStartHour = ({ target: { value: val } })=>{
+        setStartHour(Number(val));
+        setStartDate((0, _moment.default)(startDate).set("hour", Number(val)).toDate());
+    };
+    const handleChangeEndHour = ({ target: { value: val } })=>{
+        const newHour = Number(val);
+        setEndHour(newHour);
+        let newEndDate;
+        if (prevEndHour.current === 0 && newHour !== 0) {
+            newEndDate = (0, _moment.default)(endDate).subtract(1, "days");
+        } else if (prevEndHour.current !== 0 && newHour === 0) {
+            newEndDate = (0, _moment.default)(endDate).add(1, "days");
+        } else {
+            newEndDate = endDate;
+        }
+        prevEndHour.current = newHour;
+        setEndDate((0, _moment.default)(newEndDate).set("hour", newHour).toDate());
+    };
+    const renderButtons = ()=>/*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
+            children: [
+                /*#__PURE__*/ (0, _jsxruntime.jsx)(_Button.default, {
+                    className: "plr15 mr5",
+                    onClick: ()=>onCancel(),
+                    children: txt.buttons.cancel
+                }),
+                /*#__PURE__*/ (0, _jsxruntime.jsx)(_Button.default, {
+                    className: "plr20",
+                    type: "filled",
+                    disabled: !startDate || !endDate,
+                    onClick: ()=>onChange({
+                            start: startDate,
+                            end: endDate,
+                            startPrevDate,
+                            endPrevDate,
+                            compare: isCompare
+                        }),
+                    children: txt.buttons.apply
+                })
+            ]
+        });
+    const renderPreviousPeriod = ()=>/*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
+            children: [
+                txt.labels.previousPeriod,
+                ":",
+                " ",
+                /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
+                    className: "date-picker__previous-period-interval",
+                    children: title
+                })
+            ]
+        });
+    const handleStartDateFocus = ()=>{
+        setIsStartFocused(true);
+        setStartDateInput((0, _moment.default)(startDate).format("L"));
+    };
+    const handleStartDateBlur = ()=>{
+        let newDate;
+        if ((0, _moment.default)(startDateInput).isValid()) {
+            newDate = (0, _moment.default)(startDateInput).set("hour", parseInt(startHour, 10)).toDate();
+            setStartDate(newDate);
+        } else {
+            newDate = startDate;
+            setStartDateInput(newDate);
+        }
+        setIsStartFocused(false);
+        startDateInputRef.current.blur();
+        setDate1((0, _moment.default)(newDate).isSameOrAfter((0, _moment.default)(date2), "month") ? (0, _moment.default)(date2).subtract(1, "month") : (0, _moment.default)(newDate));
+    };
+    const handleEndDateFocus = ()=>{
+        setIsEndFocused(true);
+        setEndDateInput((0, _moment.default)(subtractDay(endDateInput)).format("L"));
+    };
+    const handleEndDateBlur = ()=>{
+        let newDate;
+        if ((0, _moment.default)(endDateInput).isValid()) {
+            newDate = (0, _moment.default)(endDateInput).set("hour", parseInt(endHour, 10)).toDate();
+            setEndDate(addDay(newDate));
+        } else {
+            newDate = endDate;
+            setEndDateInput(newDate);
+        }
+        setIsEndFocused(false);
+        endDateInputRef.current.blur();
+        setDate2(newDate);
+        setEndDateInput();
+    };
+    const handleKeyPressed = (e, handleDateBlur)=>{
+        if (e.key === "Enter") handleDateBlur();
+    };
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+        className: "date-picker",
+        children: [
+            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+                className: "date-picker__header",
+                children: [
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_Input.default, {
+                        dataTest: "datepicker_start-date-input",
+                        className: (0, _classnames.default)("mr5", {
+                            "date-picker-text-input--active": hoverStatus === "start"
+                        }),
+                        value: isStartFocused ? startDateInput : (0, _moment.default)(startDate).format("ll"),
+                        disabled: !startDate,
+                        onChange: (e)=>setStartDateInput(e.target.value),
+                        onFocus: handleStartDateFocus,
+                        onBlur: handleStartDateBlur,
+                        onKeyPress: (e)=>handleKeyPressed(e, handleStartDateBlur),
+                        ref: startDateInputRef
+                    }),
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_Dropdown.default, {
+                        dataTest: "datepicker_start-hour-select-input",
+                        onChange: handleChangeStartHour,
+                        value: startHour,
+                        items: getStartHourItems(),
+                        disabled: !startDate,
+                        short: true
+                    }),
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                        className: "pl5 pr5 date-picker__header--gray",
+                        children: "—"
+                    }),
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_Input.default, {
+                        dataTest: "datepicker_end-date-input",
+                        className: (0, _classnames.default)("mr5", {
+                            "date-picker-text-input--active": hoverStatus === "end"
+                        }),
+                        value: isEndFocused ? endDateInput : (0, _moment.default)(subtractDay(endDate)).format("ll"),
+                        disabled: !endDate,
+                        onChange: (e)=>setEndDateInput(e.target.value),
+                        onFocus: handleEndDateFocus,
+                        onBlur: handleEndDateBlur,
+                        onKeyPress: (e)=>handleKeyPressed(e, handleEndDateBlur),
+                        ref: endDateInputRef
+                    }),
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_Dropdown.default, {
+                        dataTest: "datepicker_end-hour-select-input",
+                        onChange: handleChangeEndHour,
+                        value: endHour,
+                        items: getEndHourItems(),
+                        disabled: !endDate,
+                        short: true
+                    })
+                ]
+            }),
+            /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                className: "date-picker__previous-period",
+                children: isCompare && !isCompareHidden && startDate && endDate && renderPreviousPeriod()
+            }),
+            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+                className: "date-picker__calendars",
+                children: [
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_Calendar.default, {
+                        date: date1,
+                        setDate: setDate1,
+                        allowNext: !isNearby,
+                        startDate: startDate,
+                        endDate: endDate,
+                        startPrevDate: startPrevDate,
+                        endPrevDate: endPrevDate,
+                        onClick: handleClick,
+                        onHover: handleHover,
+                        limitRange: limitRange
+                    }),
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_Calendar.default, {
+                        date: date2,
+                        setDate: setDate2,
+                        allowPrev: !isNearby,
+                        startDate: startDate,
+                        endDate: endDate,
+                        startPrevDate: startPrevDate,
+                        endPrevDate: endPrevDate,
+                        onClick: handleClick,
+                        onHover: handleHover
+                    })
+                ]
+            }),
+            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+                className: "date-picker__footer j46",
+                children: [
+                    !isCompareHidden ? /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                        className: "j4",
+                        children: /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                            className: "mr5",
+                            children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_Switcher.default, {
+                                dataTest: "datepicker_compare",
+                                label: txt.labels.compare,
+                                isSwitchOn: isCompare,
+                                onChange: ()=>{
+                                    onChangeCompare(!isCompare);
+                                    setIsCompare((state)=>!state);
+                                }
+                            })
+                        })
+                    }) : /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {}),
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                        children: renderButtons()
+                    })
+                ]
+            })
+        ]
+    });
+};
+const _default = Datepicker;

package/dist/src/Atomic/FormElements/Datepicker/Datepicker.stories.js

@@ -0,0 +1,51 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    DatepickerTemplate: function() {
+        return DatepickerTemplate;
+    },
+    default: function() {
+        return _default;
+    }
+});
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_default(require("react"));
+const _Datepicker = /*#__PURE__*/ _interop_require_default(require("./Datepicker"));
+require("../../../../../scss/main.scss");
+function _interop_require_default(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
+global.lng = 'en';
+const _default = {
+    title: 'Form Elements/Datepicker',
+    component: _Datepicker.default
+};
+const Template = (args)=>{
+    const params = {
+        minDate: args === null || args === void 0 ? void 0 : args.minDate,
+        maxDate: args === null || args === void 0 ? void 0 : args.maxDate
+    };
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_Datepicker.default, {
+        data: args.date,
+        params: params
+    });
+};
+const DatepickerTemplate = Template.bind({});
+DatepickerTemplate.args = {
+    date: '10/14/2021',
+    minDate: '10/11/2021',
+    maxDate: '10/25/2021',
+    values: {
+        compare: false
+    }
+};

package/dist/src/Atomic/FormElements/Datepicker/components/Calendar.js

@@ -0,0 +1,175 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    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 _classnames = /*#__PURE__*/ _interop_require_default(require("classnames"));
+const _moment = /*#__PURE__*/ _interop_require_default(require("moment"));
+const _reactfeather = /*#__PURE__*/ _interop_require_wildcard(require("react-feather"));
+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;
+}
+const Calendar = (props)=>{
+    const { date, setDate, startDate, endDate, allowPrev = true, allowNext = true, onClick, onHover, startPrevDate, endPrevDate, limitRange } = props;
+    const [days, setDays] = (0, _react.useState)({});
+    const title = (0, _react.useMemo)(()=>`${(0, _moment.default)(date).format("MMM")} ${(0, _moment.default)(date).format("YYYY")}`, [
+        date
+    ]);
+    (0, _react.useEffect)(()=>{
+        const result = {};
+        const day = (0, _moment.default)(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] = {};
+            }
+            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 && (0, _moment.default)(day.date).isAfter((0, _moment.default)(), "day");
+        const isPastDay = limitRange ? day && (0, _moment.default)(day.date).isBefore((0, _moment.default)().subtract(limitRange, "days"), "day") : null;
+        const isRangeEnd = day && ((0, _moment.default)(day.date).isSame(startDate, "day") || (0, _moment.default)(day.date).isSame((0, _moment.default)(endDate).subtract(1, "hour"), "day"));
+        const isRangeInside = day && startDate && endDate && (0, _moment.default)(day.date).isAfter(startDate, "day") && (0, _moment.default)(day.date).isBefore((0, _moment.default)(endDate).subtract(1, "hour"), "day");
+        const isPrevRangeEnd = day && ((0, _moment.default)(day.date).isSame(startPrevDate, "day") || (0, _moment.default)(day.date).isSame((0, _moment.default)(endPrevDate).subtract(1, "day"), "day"));
+        const isPrevRangeInside = day && startPrevDate && endPrevDate && (0, _moment.default)(day.date).isAfter(startPrevDate, "day") && (0, _moment.default)(day.date).isBefore((0, _moment.default)(endPrevDate).subtract(1, "day"), "day");
+        const classNames = (0, _classnames.default)("calendar__day", {
+            "calendar__day--clickable": day
+        }, {
+            "calendar__day--disabled": isFutureDay
+        }, {
+            "calendar__day--disabled": 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__*/ (0, _jsxruntime.jsx)("div", {
+            className: classNames,
+            onClick: day && !isFutureDay ? ()=>onClick(day.date) : null,
+            onMouseOver: day && !isFutureDay ? ()=>onHover(day.date) : null,
+            onMouseLeave: ()=>onHover(null),
+            children: day && day.date.getDate()
+        }, `${week}_${dayOfWeek}`);
+    };
+    const handlePrev = ()=>{
+        setDate((0, _moment.default)(date).subtract(1, "month").toDate());
+    };
+    const handleNext = ()=>{
+        setDate((0, _moment.default)(date).add(1, "month").toDate());
+    };
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+        className: "calendar",
+        children: [
+            /*#__PURE__*/ (0, _jsxruntime.jsxs)("div", {
+                className: "calendar-header",
+                children: [
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                        className: "calendar-header__prev",
+                        children: allowPrev && /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                            onClick: handlePrev,
+                            children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactfeather.ChevronLeft, {
+                                size: 16
+                            })
+                        })
+                    }),
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                        className: "calendar-header__title",
+                        children: title
+                    }),
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                        className: "calendar-header__next",
+                        children: allowNext && /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                            onClick: handleNext,
+                            children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactfeather.ChevronRight, {
+                                size: 16
+                            })
+                        })
+                    })
+                ]
+            }),
+            /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                className: "calendar__week",
+                children: [
+                    ...Array(7).keys()
+                ].map((dayOfWeek)=>{
+                    return /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                        className: "calendar__day calendar__day--title",
+                        children: (0, _moment.default)().weekday(dayOfWeek).format("dd").charAt(0)
+                    }, `day-of-week_${dayOfWeek}`);
+                })
+            }),
+            Object.keys(days).map((week, index)=>/*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                    className: "calendar__week",
+                    children: [
+                        ...Array(7).keys()
+                    ].map((dayOfWeek)=>renderDay(week, dayOfWeek))
+                }, `week_${index}`))
+        ]
+    });
+};
+const _default = Calendar;