intelicoreact 1.6.23 → 1.6.25

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

@@ -1 +1,424 @@
-function e(e,t){(null==t||t>e.length)&&(t=e.length);for(var a=0,r=Array(t);a<t;a++)r[a]=e[a];return r}function t(t,a){return function(e){if(Array.isArray(e))return e}(t)||function(e,t){var a,r,n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var u=[],l=!0,o=!1;try{for(n=n.call(e);!(l=(a=n.next()).done)&&(u.push(a.value),!t||u.length!==t);l=!0);}catch(e){o=!0,r=e}finally{try{l||null==n.return||n.return()}finally{if(o)throw r}}return u}}(t,a)||function(t,a){if(t){if("string"==typeof t)return e(t,a);var r=Object.prototype.toString.call(t).slice(8,-1);if("Object"===r&&t.constructor&&(r=t.constructor.name),"Map"===r||"Set"===r)return Array.from(r);if("Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r))return e(t,a)}}(t,a)||function(){throw TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return v}});var a=require("react/jsx-runtime"),r=c(require("classnames")),n=c(require("moment")),u=function(e,t){if(e&&e.__esModule)return e;if(null===e||(void 0===e?"undefined":e&&"undefined"!=typeof Symbol&&e.constructor===Symbol?"symbol":typeof e)!="object"&&"function"!=typeof e)return{default:e};var a=m(t);if(a&&a.has(e))return a.get(e);var r={__proto__:null},n=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var u in e)if("default"!==u&&Object.prototype.hasOwnProperty.call(e,u)){var l=n?Object.getOwnPropertyDescriptor(e,u):null;l&&(l.get||l.set)?Object.defineProperty(r,u,l):r[u]=e[u]}return r.default=e,a&&a.set(e,r),r}(require("react")),l=c(require("../../../Langs")),o=c(require("../../UI/Button/Button")),d=c(require("../Dropdown/Dropdown")),i=c(require("../Input/Input")),f=c(require("../Switcher/Switcher")),s=c(require("./components/DatepickerCalendar"));function c(e){return e&&e.__esModule?e:{default:e}}function m(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,a=new WeakMap;return(m=function(e){return e?a:t})(e)}function p(e){return"".concat(e.toString().padStart(2,"0"),":00")}require("./Datepicker.scss");var v=function(e){var c,m=e.isCompareHidden,v=e.limitRange,h=e.onChange,y=void 0===h?function(){}:h,b=e.values,D=void 0===b?{}:b,g=e.onChangeCompare,j=void 0===g?function(){}:g,S=e.onCancel,x=e.getSelectedMode,_=e.onChangeInterval,k=void 0===_?function(){}:_,O=D.start,C=void 0===O?null:O,P=D.end,N=void 0===P?null:P,A=D.compare,w=l.default[globalThis.lng],M=(0,u.useRef)(null),I=(0,u.useRef)(null),q=t((0,u.useState)(C),2),B=q[0],E=q[1],H=t((0,u.useState)(N),2),R=H[0],F=H[1],T=t((0,u.useState)(C),2),L=T[0],W=T[1],K=t((0,u.useState)(N),2),U=K[0],V=K[1],$=t((0,u.useState)(C?(0,n.default)(C).hour():0),2),z=$[0],G=$[1],J=t((0,u.useState)(N?(0,n.default)(N).hour():0),2),Q=J[0],X=J[1],Y=t((0,u.useState)(void 0!==A&&A),2),Z=Y[0],ee=Y[1],et=t((0,u.useState)(C?(0,n.default)(C).toDate():(0,n.default)().subtract(1,"month").toDate()),2),ea=et[0],er=et[1],en=t((0,u.useState)(N?(0,n.default)(N).toDate():(0,n.default)().toDate()),2),eu=en[0],el=en[1],eo=t((0,u.useState)(!1),2),ed=eo[0],ei=eo[1],ef=t((0,u.useState)(!1),2),es=ef[0],ec=ef[1],em=t((0,u.useState)(null),2),ep=em[0],ev=em[1],eh=(void 0===x?function(){return""}:x)({start:B,end:R}),ey=(0,u.useMemo)(function(){return(0,n.default)(eu).subtract(1,"month").isSame((0,n.default)(ea),"month")},[ea,eu]),eb=(0,u.useMemo)(function(){return Z&&!m&&B&&R},[B,R,Z]),eD=(0,u.useRef)(Q),eg=(0,u.useMemo)(function(){if(eb&&B&&R){var e=(0,n.default)(R).diff(B,"hours");return(0,n.default)(B).subtract(e,"hours").toDate()}return null},[B,R,Z]),ej=(0,u.useMemo)(function(){return eb&&B?B:null},[B,Z]),eS=(0,u.useMemo)(function(){return Z&&!m&&eg&&ej?"".concat((0,n.default)(eg).format("ll")," (").concat((0,n.default)(eg).format("HH:mm"),") - ").concat((0,n.default)(ej).format("ll")," (").concat((0,n.default)(ej).format("HH:mm"),")"):""},[eg,ej,Z]),ex=function(e){return 0===Q?(0,n.default)(e).subtract(1,"days"):(0,n.default)(e)};(0,u.useEffect)(function(){if(B&&R&&(0,n.default)(B).isSameOrAfter(R)){var e=(0,n.default)(R).subtract(1,"d").toDate();E(e),er(e)}},[B]),(0,u.useEffect)(function(){if(B&&R&&(0,n.default)(R).isSameOrBefore(B)){var e=(0,n.default)(B).add(1,"d").toDate();F(e),el(e)}},[R]),(0,u.useEffect)(function(){W(B),V(R),B&&R&&(0,n.default)(B).isBefore((0,n.default)(R),"month")&&(er(B),el(R))},[B,R]),(0,u.useEffect)(function(){(0,n.default)(ea).isSameOrAfter((0,n.default)(eu),"month")&&er((0,n.default)(eu).subtract(1,"month").toDate())},[ea,eu]),(0,u.useEffect)(function(){k(eh)},[eh]);var e_=function(e){eD.current=0,!B||B&&R&&!((0,n.default)(B).add(1,"d").isSame(R,"day")&&0===Q)?(E((0,n.default)(e).startOf("day").toDate()),F((0,n.default)(e).add(1,"d").startOf("day").toDate()),G(0),X(0)):(0,n.default)(e).isBefore((0,n.default)(B),"day")?(F((0,n.default)(B).add(1,"d").startOf("day").toDate()),E((0,n.default)(e).set("hour",z).toDate())):(0,n.default)(e).isAfter((0,n.default)(B),"day")&&F((0,n.default)(e).add(1,"d").startOf("day").toDate()),ev(null)},ek=function(e){if(!e){c=setTimeout(function(){return ev(null)},400);return}c&&clearTimeout(c),B&&R&&(0,n.default)(B).add(1,"d").isSame(R,"day")&&0===Q?(0,n.default)(e).isAfter((0,n.default)(B),"day")?ev("end"):(0,n.default)(e).isBefore((0,n.default)(B),"day")?ev("start"):ev(null):ev("start")},eO=function(){var e;if("string"==typeof L&&(0,n.default)(L).isValid()){var t=(0,n.default)(L).set("hour",z).toDate();E(t),er((0,n.default)(t).isSameOrAfter((0,n.default)(eu),"month")?(0,n.default)(eu).subtract(1,"month").toDate():t)}else W(B);ei(!1),null==(e=M.current)||e.blur()},eC=function(){var e;if("string"==typeof U&&(0,n.default)(U).isValid()){var t,a=(t=(0,n.default)(U).set("hour",Q).toDate(),0===Q?(0,n.default)(t).add(1,"days"):(0,n.default)(t)).toDate();F(a),el(a)}else V(R);ec(!1),null==(e=I.current)||e.blur()},eP=function(e,t){"Enter"===e.key&&t()};return(0,a.jsxs)("div",{className:"date-picker",children:[(0,a.jsxs)("div",{className:"date-picker__header",children:[(0,a.jsx)(i.default,{testId:"datepicker_start-date-input",className:(0,r.default)("mr5",{"date-picker-text-input--active":"start"===ep}),value:ed?L:(0,n.default)(B).format("ll"),disabled:!B,onChange:function(e){return W(e.target.value)},onFocus:function(){ei(!0),B&&W((0,n.default)(B).format("L"))},onBlur:eO,onKeyPress:function(e){return eP(e,eO)},ref:M}),(0,a.jsx)(d.default,{testId:"datepicker_start-hour-select-input",onChange:function(e){var t=Number(e);G(t),B&&E((0,n.default)(B).set("hour",t).toDate())},value:z,options:Array.from({length:24},function(e,t){return{label:p(t),value:t,disabled:!!(B&&R&&(0,n.default)(B).isSame(R,"day")&&Q<=t)}}),disabled:!B}),(0,a.jsx)("div",{className:"pl5 pr5 date-picker__header--gray",children:"—"}),(0,a.jsx)(i.default,{testId:"datepicker_end-date-input",className:(0,r.default)("mr5",{"date-picker-text-input--active":"end"===ep}),value:es?U:R?(0,n.default)(ex(R)).format("ll"):"",disabled:!R,onChange:function(e){return V(e.target.value)},onFocus:function(){ec(!0),R&&V((0,n.default)(ex(R)).format("L"))},onBlur:eC,onKeyPress:function(e){return eP(e,eC)},ref:I}),(0,a.jsx)(d.default,{testId:"datepicker_end-hour-select-input",onChange:function(e){var t,a=Number(e);X(a),R&&(t=0===eD.current&&0!==a?(0,n.default)(R).subtract(1,"days"):0!==eD.current&&0===a?(0,n.default)(R).add(1,"days"):(0,n.default)(R),eD.current=a,F((0,n.default)(t).set("hour",a).toDate()))},value:Q,options:Array.from({length:24},function(e,t){return{label:p(t+1),value:23===t?0:t+1,disabled:!!(B&&R&&((0,n.default)(B).isSame(R,"day")||(0,n.default)(B).isSame((0,n.default)(R).subtract(1,"days"),"day")&&0===Q)&&t<z)}}),disabled:!R})]}),(0,a.jsx)("div",{className:"date-picker__previous-period",children:Z&&!m&&B&&R&&(0,a.jsxs)(a.Fragment,{children:[w.labels.previousPeriod,":"," ",(0,a.jsx)("span",{className:"date-picker__previous-period-interval",children:eS})]})}),(0,a.jsxs)("div",{className:"date-picker__calendars",children:[(0,a.jsx)(s.default,{date:ea,setDate:er,allowNext:!ey,startDate:B,endDate:R,startPrevDate:eg,endPrevDate:ej,onClick:e_,onHover:ek,limitRange:v}),(0,a.jsx)(s.default,{date:eu,setDate:el,allowPrev:!ey,startDate:B,endDate:R,startPrevDate:eg,endPrevDate:ej,onClick:e_,onHover:ek})]}),(0,a.jsxs)("div",{className:"date-picker__footer j46",children:[!m&&(0,a.jsx)("div",{className:"j4",children:(0,a.jsx)("div",{className:"mr5",children:(0,a.jsx)(f.default,{testId:"datepicker_compare",label:w.labels.compare,isActive:Z,onChange:function(){j(!Z),ee(function(e){return!e})}})})}),(0,a.jsx)("div",{children:(0,a.jsxs)(a.Fragment,{children:[(0,a.jsx)(o.default,{className:"plr15 mr5",onClick:void 0===S?function(){}:S,children:w.buttons.cancel}),(0,a.jsx)(o.default,{className:"plr20",disabled:!B||!R,onClick:function(){B&&R&&y({start:B,end:R,startPrevDate:eg,endPrevDate:ej,compare:Z})},children:w.buttons.apply})]})})]})]})};
+"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 _classnames = /*#__PURE__*/ _interop_require_default(require("classnames"));
+const _moment = /*#__PURE__*/ _interop_require_default(require("moment"));
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+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 _DatepickerCalendar = /*#__PURE__*/ _interop_require_default(require("./components/DatepickerCalendar"));
+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;
+}
+function padTime(time) {
+    return `${time.toString().padStart(2, '0')}:00`;
+}
+const Datepicker = ({ isCompareHidden, limitRange, onChange = ()=>{}, values = {}, onChangeCompare = ()=>{}, onCancel = ()=>{}, getSelectedMode = ()=>'', onChangeInterval = ()=>{} })=>{
+    const { start = null, end = null, compare = false } = values;
+    // @ts-ignore
+    const txt = _Langs.default[globalThis.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 [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);
+    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 dateInterval = getSelectedMode({
+        start: startDate,
+        end: endDate
+    });
+    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.from({
+            length: 24
+        }, (_, hour)=>({
+                label: padTime(hour),
+                value: hour,
+                disabled: !!(startDate && endDate && (0, _moment.default)(startDate).isSame(endDate, 'day') && endHour <= hour)
+            }));
+    const getEndHourItems = ()=>Array.from({
+            length: 24
+        }, (_, hour)=>({
+                label: padTime(hour + 1),
+                value: hour === 23 ? 0 : hour + 1,
+                disabled: !!(startDate && endDate && ((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 && startDate && endDate) {
+            const intervalHours = (0, _moment.default)(endDate).diff(startDate, 'hours');
+            return (0, _moment.default)(startDate).subtract(intervalHours, 'hours').toDate();
+        }
+        return null;
+    }, [
+        startDate,
+        endDate,
+        isCompare
+    ]);
+    const endPrevDate = (0, _react.useMemo)(()=>{
+        return isPreviousPeriodShowed && startDate ? startDate : null;
+    }, [
+        startDate,
+        isCompare
+    ]);
+    const title = (0, _react.useMemo)(()=>{
+        if (isCompare && !isCompareHidden && startPrevDate && endPrevDate) {
+            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')})`;
+        }
+        return '';
+    }, [
+        startPrevDate,
+        endPrevDate,
+        isCompare
+    ]);
+    const subtractDay = (date)=>endHour === 0 ? (0, _moment.default)(date).subtract(1, 'days') : (0, _moment.default)(date);
+    const addDay = (date)=>endHour === 0 ? (0, _moment.default)(date).add(1, 'days') : (0, _moment.default)(date);
+    (0, _react.useEffect)(()=>{
+        if (startDate && endDate && (0, _moment.default)(startDate).isSameOrAfter(endDate)) {
+            const newStart = (0, _moment.default)(endDate).subtract(1, 'd').toDate();
+            setStartDate(newStart);
+            setDate1(newStart);
+        }
+    }, [
+        startDate
+    ]);
+    (0, _react.useEffect)(()=>{
+        if (startDate && endDate && (0, _moment.default)(endDate).isSameOrBefore(startDate)) {
+            const newEnd = (0, _moment.default)(startDate).add(1, 'd').toDate();
+            setEndDate(newEnd);
+            setDate2(newEnd);
+        }
+    }, [
+        endDate
+    ]);
+    (0, _react.useEffect)(()=>{
+        setStartDateInput(startDate);
+        setEndDateInput(endDate);
+        if (startDate && endDate && (0, _moment.default)(startDate).isBefore((0, _moment.default)(endDate), 'month')) {
+            setDate1(startDate);
+            setDate2(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').toDate());
+        }
+    }, [
+        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', startHour).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 (startDate && endDate && (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 = (value)=>{
+        const val = Number(value);
+        setStartHour(val);
+        if (startDate) setStartDate((0, _moment.default)(startDate).set('hour', val).toDate());
+    };
+    const handleChangeEndHour = (value)=>{
+        const newHour = Number(value);
+        setEndHour(newHour);
+        if (!endDate) return;
+        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 = (0, _moment.default)(endDate);
+        }
+        prevEndHour.current = newHour;
+        setEndDate((0, _moment.default)(newEndDate).set('hour', newHour).toDate());
+    };
+    const handleStartDateFocus = ()=>{
+        setIsStartFocused(true);
+        if (startDate) setStartDateInput((0, _moment.default)(startDate).format('L'));
+    };
+    const handleEndDateFocus = ()=>{
+        setIsEndFocused(true);
+        if (endDate) setEndDateInput((0, _moment.default)(subtractDay(endDate)).format('L'));
+    };
+    const handleStartDateBlur = ()=>{
+        var _startDateInputRef_current;
+        if (typeof startDateInput === 'string' && (0, _moment.default)(startDateInput).isValid()) {
+            const newDate = (0, _moment.default)(startDateInput).set('hour', startHour).toDate();
+            setStartDate(newDate);
+            setDate1((0, _moment.default)(newDate).isSameOrAfter((0, _moment.default)(date2), 'month') ? (0, _moment.default)(date2).subtract(1, 'month').toDate() : newDate);
+        } else {
+            setStartDateInput(startDate);
+        }
+        setIsStartFocused(false);
+        (_startDateInputRef_current = startDateInputRef.current) === null || _startDateInputRef_current === void 0 ? void 0 : _startDateInputRef_current.blur();
+    };
+    const handleEndDateBlur = ()=>{
+        var _endDateInputRef_current;
+        if (typeof endDateInput === 'string' && (0, _moment.default)(endDateInput).isValid()) {
+            const newDate = (0, _moment.default)(endDateInput).set('hour', endHour).toDate();
+            const finalDate = addDay(newDate).toDate();
+            setEndDate(finalDate);
+            setDate2(finalDate);
+        } else {
+            setEndDateInput(endDate);
+        }
+        setIsEndFocused(false);
+        (_endDateInputRef_current = endDateInputRef.current) === null || _endDateInputRef_current === void 0 ? void 0 : _endDateInputRef_current.blur();
+    };
+    const handleKeyPressed = (e, callback)=>{
+        if (e.key === 'Enter') callback();
+    };
+    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",
+                    // variant="filled"
+                    disabled: !startDate || !endDate,
+                    onClick: ()=>{
+                        if (!startDate || !endDate) return;
+                        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
+                })
+            ]
+        });
+    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, {
+                        // @ts-ignore
+                        testId: "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, {
+                        // @ts-ignore
+                        testId: "datepicker_start-hour-select-input",
+                        onChange: handleChangeStartHour,
+                        value: startHour,
+                        options: getStartHourItems(),
+                        disabled: !startDate
+                    }),
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                        className: "pl5 pr5 date-picker__header--gray",
+                        children: "—"
+                    }),
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_Input.default, {
+                        // @ts-ignore
+                        testId: "datepicker_end-date-input",
+                        className: (0, _classnames.default)('mr5', {
+                            'date-picker-text-input--active': hoverStatus === 'end'
+                        }),
+                        value: isEndFocused ? endDateInput : endDate ? (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, {
+                        testId: "datepicker_end-hour-select-input",
+                        onChange: handleChangeEndHour,
+                        value: endHour,
+                        options: getEndHourItems(),
+                        disabled: !endDate
+                    })
+                ]
+            }),
+            /*#__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)(_DatepickerCalendar.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)(_DatepickerCalendar.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, {
+                                testId: "datepicker_compare",
+                                // @ts-ignore
+                                label: txt.labels.compare,
+                                isActive: isCompare,
+                                onChange: ()=>{
+                                    onChangeCompare(!isCompare);
+                                    setIsCompare((state)=>!state);
+                                }
+                            })
+                        })
+                    }),
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                        children: renderButtons()
+                    })
+                ]
+            })
+        ]
+    });
+};
+const _default = Datepicker;

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

@@ -1 +1,4 @@
-Object.defineProperty(exports,"__esModule",{value:!0});
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});

package/dist/Atomic/FormElements/Datepicker/components/DatepickerCalendar.js

@@ -1 +1,173 @@
-function e(e,t){(null==t||t>e.length)&&(t=e.length);for(var a=0,r=Array(t);a<t;a++)r[a]=e[a];return r}Object.defineProperty(exports,"__esModule",{value:!0}),Object.defineProperty(exports,"default",{enumerable:!0,get:function(){return i}});var t=require("react/jsx-runtime"),a=l(require("classnames")),r=l(require("moment")),n=u(require("react")),d=u(require("react-feather"));function l(e){return e&&e.__esModule?e:{default:e}}function o(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,a=new WeakMap;return(o=function(e){return e?a:t})(e)}function u(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||(void 0===e?"undefined":e&&"undefined"!=typeof Symbol&&e.constructor===Symbol?"symbol":typeof e)!="object"&&"function"!=typeof e)return{default:e};var a=o(t);if(a&&a.has(e))return a.get(e);var r={__proto__:null},n=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var d in e)if("default"!==d&&Object.prototype.hasOwnProperty.call(e,d)){var l=n?Object.getOwnPropertyDescriptor(e,d):null;l&&(l.get||l.set)?Object.defineProperty(r,d,l):r[d]=e[d]}return r.default=e,a&&a.set(e,r),r}var i=function(l){var o,u=l.date,i=l.setDate,c=l.startDate,f=l.endDate,s=l.allowPrev,y=l.allowNext,v=l.onClick,m=l.onHover,h=l.startPrevDate,_=l.endPrevDate,p=l.limitRange,b=(o=(0,n.useState)({}),function(e){if(Array.isArray(e))return e}(o)||function(e,t){var a,r,n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var d=[],l=!0,o=!1;try{for(n=n.call(e);!(l=(a=n.next()).done)&&(d.push(a.value),d.length!==t);l=!0);}catch(e){o=!0,r=e}finally{try{l||null==n.return||n.return()}finally{if(o)throw r}}return d}}(o,2)||function(t,a){if(t){if("string"==typeof t)return e(t,2);var r=Object.prototype.toString.call(t).slice(8,-1);if("Object"===r&&t.constructor&&(r=t.constructor.name),"Map"===r||"Set"===r)return Array.from(r);if("Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r))return e(t,a)}}(o,2)||function(){throw TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()),j=b[0],x=b[1],g=(0,n.useMemo)(function(){return"".concat((0,r.default)(u).format("MMM")," ").concat((0,r.default)(u).format("YYYY"))},[u]);(0,n.useEffect)(function(){for(var e={},t=(0,r.default)(u).startOf("month"),a=t.daysInMonth(),n=0;n<a;n++){var d=t.week();11===t.month()&&1===d&&(d=53),0===t.month()&&53===d&&(d=0),e[d]||(e[d]={}),e[d][t.weekday()]={date:t.toDate()},t.add(1,"d")}x(e)},[u]);var k=function(e,n){var d,l=null==(d=j[+e])?void 0:d[n],o=l&&(0,r.default)(l.date).isAfter((0,r.default)(),"day"),u=p?l&&(0,r.default)(l.date).isBefore((0,r.default)().subtract(p,"days"),"day"):null,i=l&&((0,r.default)(l.date).isSame(c,"day")||(0,r.default)(l.date).isSame((0,r.default)(f).subtract(1,"hour"),"day")),s=l&&c&&f&&(0,r.default)(l.date).isAfter(c,"day")&&(0,r.default)(l.date).isBefore((0,r.default)(f).subtract(1,"hour"),"day"),y=l&&((0,r.default)(l.date).isSame(h,"day")||(0,r.default)(l.date).isSame((0,r.default)(_).subtract(1,"day"),"day")),b=l&&h&&_&&(0,r.default)(l.date).isAfter(h,"day")&&(0,r.default)(l.date).isBefore((0,r.default)(_).subtract(1,"day"),"day"),x=(0,a.default)("calendar__day",{"calendar__day--clickable":l},{"calendar__day--disabled":o||u},{"calendar__day--range-end":i},{"calendar__day--range-inside":s},{"calendar__day--prev-range-end":y},{"calendar__day--prev-range-inside":b});return(0,t.jsx)("div",{className:x,onClick:l&&!o?function(){return v(l.date)}:void 0,onMouseOver:l&&!o?function(){return m(l.date)}:void 0,onMouseLeave:function(){return m(null)},children:l&&l.date.getDate()},"".concat(e,"_").concat(n))};return(0,t.jsxs)("div",{className:"calendar",children:[(0,t.jsxs)("div",{className:"calendar-header",children:[(0,t.jsx)("div",{className:"calendar-header__prev",children:(void 0===s||s)&&(0,t.jsx)("button",{"data-testid":"datepicker-calendar-prev",onClick:function(){i((0,r.default)(u).subtract(1,"month").toDate())},"aria-label":"Previous month",children:(0,t.jsx)(d.ChevronLeft,{size:16})})}),(0,t.jsx)("div",{className:"calendar-header__title",children:g}),(0,t.jsx)("div",{className:"calendar-header__next",children:(void 0===y||y)&&(0,t.jsx)("button",{"data-testid":"datepicker-calendar-next",onClick:function(){i((0,r.default)(u).add(1,"month").toDate())},"aria-label":"Next month",children:(0,t.jsx)(d.ChevronRight,{size:16})})})]}),(0,t.jsx)("div",{className:"calendar__week",children:Array.from({length:7},function(e,a){return(0,t.jsx)("div",{className:"calendar__day calendar__day--title",children:(0,r.default)().weekday(a).format("dd").charAt(0)},"day-of-week_".concat(a))})}),Object.keys(j).map(function(e,a){return(0,t.jsx)("div",{className:"calendar__week",children:Array.from({length:7},function(t,a){return k(e,a)})},"week_".concat(a))})]})};
+"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 _classnames = /*#__PURE__*/ _interop_require_default(require("classnames"));
+const _moment = /*#__PURE__*/ _interop_require_default(require("moment"));
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
+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 DatepickerCalendar = ({ date, setDate, startDate, endDate, allowPrev = true, allowNext = true, onClick, onHover, startPrevDate, endPrevDate, limitRange })=>{
+    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++){
+            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)=>{
+        var _days_;
+        const day = (_days_ = days[+week]) === null || _days_ === void 0 ? void 0 : _days_[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 || 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) : undefined,
+            onMouseOver: day && !isFutureDay ? ()=>onHover(day.date) : undefined,
+            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)("button", {
+                            "data-testid": "datepicker-calendar-prev",
+                            onClick: handlePrev,
+                            "aria-label": "Previous month",
+                            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)("button", {
+                            "data-testid": "datepicker-calendar-next",
+                            onClick: handleNext,
+                            "aria-label": "Next month",
+                            children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactfeather.ChevronRight, {
+                                size: 16
+                            })
+                        })
+                    })
+                ]
+            }),
+            /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
+                className: "calendar__week",
+                children: Array.from({
+                    length: 7
+                }, (_, dayOfWeek)=>/*#__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.from({
+                        length: 7
+                    }, (_, dayOfWeek)=>renderDay(week, dayOfWeek))
+                }, `week_${index}`))
+        ]
+    });
+};
+const _default = DatepickerCalendar;

package/dist/Atomic/FormElements/Datepicker/components/DatepickerCalendar.props.js

@@ -1 +1,4 @@
-Object.defineProperty(exports,"__esModule",{value:!0});
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});