willba-component-library 0.2.58 → 0.2.60

package/lib/index.umd.js

@@ -11000,6 +11000,8 @@
             ? endOfDay(rangeContext.from)
             : null;
         var rangeContextTo = (rangeContext === null || rangeContext === void 0 ? void 0 : rangeContext.to) ? endOfDay(rangeContext.to) : null;
+        // When some dates are not available for selection, the earliest date will be available only for "end"
+        // and the latest date will only be available for "start"
         var overlappingDateFrom = (overlappingDate === null || overlappingDate === void 0 ? void 0 : overlappingDate.length)
             ? overlappingDate.find(function (date) {
                 return !!(date.from && rangeFrom)
@@ -11007,6 +11009,12 @@
                     : false;
             })
             : null;
+        var overlappingDateTo = (overlappingDate === null || overlappingDate === void 0 ? void 0 : overlappingDate.length)
+            ? overlappingDate.find(function (date) {
+                return !!(date.from && rangeTo) ? isEqual(endOfDay(date.from), rangeTo) : false;
+            })
+            : null;
+        //----------
         var checkOutRange = ((_b = newDisableCalendarDates === null || newDisableCalendarDates === void 0 ? void 0 : newDisableCalendarDates.availableDates) === null || _b === void 0 ? void 0 : _b.length)
             ? newDisableCalendarDates.availableDates.find(function (checkInDate) {
                 return !!(checkInDate.checkIn && rangeFrom)
@@ -11024,7 +11032,8 @@
         // Calendar selection rules: The cases are handled sequentially, starting from simple selections to more complex contextual selections.
         // The rules are processed in a specific order, so one case is handled before another.
         // Changing the order will cause the rules to break or not work properly.
-        if (!!overlappingDateFrom) {
+        if (!!overlappingDateFrom ||
+            (calendarRangeFrom && calendarRangeTo && overlappingDateTo)) {
             // 1. If dates overlap, clear the selection.
             return setCalendarRange(undefined);
         }
@@ -11145,24 +11154,26 @@
             disabledAfterCheckIn: (calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.from)
                 ? [{ after: calendarRange.from }]
                 : [],
-            overlappingDate: __spreadArray$1([], __read((!(calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.from) && !!(overlappingDate === null || overlappingDate === void 0 ? void 0 : overlappingDate.length) && !rangeContext
+            overlappingDate: __spreadArray$1([], __read((!(calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.from) && !!(overlappingDate === null || overlappingDate === void 0 ? void 0 : overlappingDate.length)
                 ? overlappingDate.map(function (date) { return ({ from: date.from }); })
                 : [])), false),
             noActiveSelectionStart: (rangeContext === null || rangeContext === void 0 ? void 0 : rangeContext.from) &&
-                !((calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.from) &&
-                    (rangeContext === null || rangeContext === void 0 ? void 0 : rangeContext.from) &&
-                    isEqual(endOfDay(rangeContext.from), endOfDay(calendarRange.from)))
+                !(((calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.from) &&
+                    isEqual(endOfDay(rangeContext.from), endOfDay(calendarRange.from))) ||
+                    ((calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.to) &&
+                        isEqual(endOfDay(rangeContext.from), endOfDay(calendarRange.to))))
                 ? rangeContext.from
                 : [],
-            noActiveSelectionMid: __spreadArray$1([], __read((rangeContextMiddleSelection.length
-                ? rangeContextMiddleSelection
-                : [])), false),
             noActiveSelectionEnd: (rangeContext === null || rangeContext === void 0 ? void 0 : rangeContext.to) &&
-                !((calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.from) &&
-                    (rangeContext === null || rangeContext === void 0 ? void 0 : rangeContext.to) &&
-                    isEqual(endOfDay(rangeContext.to), endOfDay(calendarRange.from)))
+                !(((calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.from) &&
+                    isEqual(endOfDay(rangeContext.to), endOfDay(calendarRange.from))) ||
+                    ((calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.to) &&
+                        isEqual(endOfDay(rangeContext.to), endOfDay(calendarRange.to))))
                 ? rangeContext.to
                 : [],
+            noActiveSelectionMid: __spreadArray$1([], __read((rangeContextMiddleSelection.length
+                ? rangeContextMiddleSelection
+                : [])), false),
             checkoutOptionsMid: __spreadArray$1([], __read(((calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.from) &&
                 !(calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.to) &&
                 (currentSelectionLastCheckoutDate === null || currentSelectionLastCheckoutDate === void 0 ? void 0 : currentSelectionLastCheckoutDate.lastCheckOut)
@@ -11265,7 +11276,7 @@
     };
 
     var useCalendarTooltips = function (_a) {
-        var calendarRange = _a.calendarRange, updateCalendarMonthNavigation = _a.updateCalendarMonthNavigation, overlappingDate = _a.overlappingDate, updateCalendarDefaultMoth = _a.updateCalendarDefaultMoth, showFeedback = _a.showFeedback;
+        var showFeedback = _a.showFeedback;
         return React__default.useEffect(function () {
             if (typeof document === 'undefined' || !showFeedback)
                 return;
@@ -11332,16 +11343,11 @@
                 tooltipClonesSpinner.forEach(function (clone) { return clone.remove(); });
                 tooltipClonesOverlappingDates.forEach(function (clone) { return clone.remove(); });
             };
-        }, [
-            calendarRange,
-            updateCalendarMonthNavigation,
-            overlappingDate,
-            updateCalendarDefaultMoth,
-        ]);
+        });
     };
 
     var useCalendarLoadingSpinner = function (_a) {
-        var loadingData = _a.loadingData, updateCalendarMonthNavigation = _a.updateCalendarMonthNavigation, updateCalendarDefaultMoth = _a.updateCalendarDefaultMoth;
+        var loadingData = _a.loadingData;
         return React__default.useEffect(function () {
             if (typeof document === 'undefined')
                 return;
@@ -11354,11 +11360,11 @@
                 if (loadingSpinner)
                     loadingSpinner.style.display = 'none';
             }
-        }, [loadingData, updateCalendarMonthNavigation, updateCalendarDefaultMoth]);
+        });
     };
 
     var useUpdateDisabledDates = function (_a) {
-        var disableCalendarDates = _a.disableCalendarDates, calendarRange = _a.calendarRange, updateCalendarMonthNavigation = _a.updateCalendarMonthNavigation, updateCalendarDefaultMoth = _a.updateCalendarDefaultMoth;
+        var disableCalendarDates = _a.disableCalendarDates, calendarRange = _a.calendarRange, updateCalendarMonthNavigation = _a.updateCalendarMonthNavigation, updateCalendarDefaultMonth = _a.updateCalendarDefaultMonth;
         var _b = __read(React__default.useState(undefined), 2), overlappingDate = _b[0], setOverlappingDate = _b[1];
         var newDisableCalendarDates = React__default.useMemo(function () {
             if (disableCalendarDates === null || disableCalendarDates === void 0 ? void 0 : disableCalendarDates.availableDates) {
@@ -11402,7 +11408,7 @@
             disableCalendarDates,
             calendarRange,
             updateCalendarMonthNavigation,
-            updateCalendarDefaultMoth,
+            updateCalendarDefaultMonth,
         ]);
         return { newDisableCalendarDates: newDisableCalendarDates, overlappingDate: overlappingDate };
     };
@@ -11415,7 +11421,7 @@
 
     var Calendar = React__default.forwardRef(function (_a, ref) {
         var _b, _c;
-        var selectedPath = _a.selectedPath, calendarRange = _a.calendarRange, setCalendarRange = _a.setCalendarRange, language = _a.language, disableCalendarDates = _a.disableCalendarDates, requestDates = _a.requestDates, disabledDates = _a.disabledDates, setDisabledDates = _a.setDisabledDates, updateCalendarMonthNavigation = _a.updateCalendarMonthNavigation, setUpdateCalendarMonthNavigation = _a.setUpdateCalendarMonthNavigation, updateCalendarDefaultMoth = _a.updateCalendarDefaultMoth, loadingData = _a.loadingData, showFeedback = _a.showFeedback, palette = _a.palette, setCalendarHasError = _a.setCalendarHasError, setUpdatedForSubmit = _a.setUpdatedForSubmit, rangeContext = _a.rangeContext, calendarHasError = _a.calendarHasError;
+        var selectedPath = _a.selectedPath, calendarRange = _a.calendarRange, setCalendarRange = _a.setCalendarRange, language = _a.language, disableCalendarDates = _a.disableCalendarDates, requestDates = _a.requestDates, disabledDates = _a.disabledDates, setDisabledDates = _a.setDisabledDates, updateCalendarMonthNavigation = _a.updateCalendarMonthNavigation, setUpdateCalendarMonthNavigation = _a.setUpdateCalendarMonthNavigation, updateCalendarDefaultMonth = _a.updateCalendarDefaultMonth, loadingData = _a.loadingData, showFeedback = _a.showFeedback, palette = _a.palette, setCalendarHasError = _a.setCalendarHasError, setUpdatedForSubmit = _a.setUpdatedForSubmit, rangeContext = _a.rangeContext, calendarHasError = _a.calendarHasError;
         // Translations
         var t = useTranslation('common').t;
         var isTablet = reactResponsiveExports.useMediaQuery({ maxWidth: 960 });
@@ -11427,7 +11433,7 @@
             disableCalendarDates: disableCalendarDates,
             calendarRange: calendarRange,
             updateCalendarMonthNavigation: updateCalendarMonthNavigation,
-            updateCalendarDefaultMoth: updateCalendarDefaultMoth,
+            updateCalendarDefaultMonth: updateCalendarDefaultMonth,
         }), newDisableCalendarDates = _d.newDisableCalendarDates, overlappingDate = _d.overlappingDate;
         // Handle disable dates by page
         var disabledDatesByPage$1 = disabledDatesByPage({
@@ -11437,17 +11443,11 @@
         });
         // Handle tooltip
         useCalendarTooltips({
-            calendarRange: calendarRange,
-            updateCalendarMonthNavigation: updateCalendarMonthNavigation,
-            overlappingDate: overlappingDate,
-            updateCalendarDefaultMoth: updateCalendarDefaultMoth,
             showFeedback: showFeedback,
         });
         // Handle loading spinner
         useCalendarLoadingSpinner({
             loadingData: loadingData,
-            updateCalendarMonthNavigation: updateCalendarMonthNavigation,
-            updateCalendarDefaultMoth: updateCalendarDefaultMoth,
         });
         // Handle the date selection and availability for selection logic.
         var handleOnSelect = function (range) {
@@ -11479,7 +11479,7 @@
         });
         return (React__default.createElement("div", { className: "will-filter-bar-calendar", ref: ref },
             React__default.createElement("div", { className: "will-calendar-filter-container" },
-                React__default.createElement(DayPicker, { key: updateCalendarDefaultMoth, id: "will-calendar", mode: "range", locale: language === 'en' ? enUS : fi, numberOfMonths: !isTablet ? 2 : 1, weekStartsOn: 1, selected: calendarRange, onSelect: function (range) { return handleOnSelect(range); }, captionLayout: "dropdown-buttons", defaultMonth: (calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.from) ||
+                React__default.createElement(DayPicker, { key: updateCalendarDefaultMonth, id: "will-calendar", mode: "range", locale: language === 'en' ? enUS : fi, numberOfMonths: !isTablet ? 2 : 1, weekStartsOn: 1, selected: calendarRange, onSelect: function (range) { return handleOnSelect(range); }, captionLayout: "dropdown-buttons", defaultMonth: (calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.from) ||
                         selectedStartDate ||
                         rangeContextStartDate ||
                         (((_b = newDisableCalendarDates === null || newDisableCalendarDates === void 0 ? void 0 : newDisableCalendarDates.disabledDates) === null || _b === void 0 ? void 0 : _b.length)
@@ -11905,15 +11905,16 @@
     var REDIRECT_URL_FALLBACK = 'http://localhost:3000/';
 
     var useFilterCalendar = function (_a) {
-        var onSubmit = _a.onSubmit, setToggleCalendar = _a.setToggleCalendar, noActiveSelection = _a.noActiveSelection, toggleCalendar = _a.toggleCalendar;
+        var onSubmit = _a.onSubmit, setToggleCalendar = _a.setToggleCalendar, noActiveSelection = _a.noActiveSelection, toggleCalendar = _a.toggleCalendar, outerRangeContext = _a.outerRangeContext;
         // State
         var _b = __read(React__default.useState(), 2), calendarRange = _b[0], setCalendarRange = _b[1];
-        var _c = __read(React__default.useState(), 2), initialCalendarRange = _c[0], setInitialCalendarRange = _c[1];
-        var _d = __read(React__default.useState([]), 2), disabledDates = _d[0], setDisabledDates = _d[1];
-        var _e = __read(React__default.useState(false), 2), updateCalendarMonthNavigation = _e[0], setUpdateCalendarMonthNavigation = _e[1];
-        var _f = __read(React__default.useState(0), 2), updateCalendarDefaultMoth = _f[0], setUpdateCalendarDefaultMoth = _f[1];
-        var _g = __read(React__default.useState(false), 2), calendarHasError = _g[0], setCalendarHasError = _g[1];
-        var _h = __read(React__default.useState(false), 2), updatedForSubmit = _h[0], setUpdatedForSubmit = _h[1];
+        var _c = __read(React__default.useState(outerRangeContext), 2), rangeContext = _c[0], setRangeContext = _c[1];
+        var _d = __read(React__default.useState(), 2), initialCalendarRange = _d[0], setInitialCalendarRange = _d[1];
+        var _e = __read(React__default.useState([]), 2), disabledDates = _e[0], setDisabledDates = _e[1];
+        var _f = __read(React__default.useState(false), 2), updateCalendarMonthNavigation = _f[0], setUpdateCalendarMonthNavigation = _f[1];
+        var _g = __read(React__default.useState(0), 2), updateCalendarDefaultMonth = _g[0], setUpdateCalendarDefaultMonth = _g[1];
+        var _h = __read(React__default.useState(false), 2), calendarHasError = _h[0], setCalendarHasError = _h[1];
+        var _j = __read(React__default.useState(false), 2), updatedForSubmit = _j[0], setUpdatedForSubmit = _j[1];
         // Lifecycle
         React__default.useEffect(function () {
             if (typeof window === 'undefined')
@@ -11924,8 +11925,9 @@
             if (startDateParam && endDateParam) {
                 if (noActiveSelection) {
                     handleClearDates();
-                    setUpdateCalendarDefaultMoth(function (prev) { return prev + 1; });
+                    setUpdateCalendarDefaultMonth(function (prev) { return prev + 1; });
                     setUpdatedForSubmit(false);
+                    setRangeContext(outerRangeContext);
                     setInitialCalendarRange({
                         from: new Date(startDateParam),
                         to: new Date(endDateParam),
@@ -11987,10 +11989,11 @@
             calendarRange: calendarRange,
             disabledDates: disabledDates,
             updateCalendarMonthNavigation: updateCalendarMonthNavigation,
-            updateCalendarDefaultMoth: updateCalendarDefaultMoth,
+            updateCalendarDefaultMonth: updateCalendarDefaultMonth,
             calendarHasError: calendarHasError,
             setCalendarHasError: setCalendarHasError,
             setUpdatedForSubmit: setUpdatedForSubmit,
+            rangeContext: rangeContext,
         };
     };
 
@@ -11998,7 +12001,7 @@
     styleInject(css_248z);
 
     function FilterCalendar(_a) {
-        var calendarOffset = _a.calendarOffset, language = _a.language, palette = _a.palette, onSubmit = _a.onSubmit, disableCalendarDates = _a.disableCalendarDates, toggleCalendar = _a.toggleCalendar, loadingData = _a.loadingData, setToggleCalendar = _a.setToggleCalendar, requestDates = _a.requestDates, showFeedback = _a.showFeedback, noActiveSelection = _a.noActiveSelection, rangeContext = _a.rangeContext;
+        var calendarOffset = _a.calendarOffset, language = _a.language, palette = _a.palette, onSubmit = _a.onSubmit, disableCalendarDates = _a.disableCalendarDates, toggleCalendar = _a.toggleCalendar, loadingData = _a.loadingData, setToggleCalendar = _a.setToggleCalendar, requestDates = _a.requestDates, showFeedback = _a.showFeedback, noActiveSelection = _a.noActiveSelection, outerRangeContext = _a.rangeContext;
         var themePalette = useTheme({ palette: palette });
         // Translations
         useUpdateTranslations({ language: language });
@@ -12008,7 +12011,8 @@
             setToggleCalendar: setToggleCalendar,
             noActiveSelection: noActiveSelection,
             toggleCalendar: toggleCalendar,
-        }), setCalendarRange = _b.setCalendarRange, handleClearDates = _b.handleClearDates, calendarRange = _b.calendarRange, disabledDates = _b.disabledDates, setDisabledDates = _b.setDisabledDates, updateCalendarMonthNavigation = _b.updateCalendarMonthNavigation, updateCalendarDefaultMoth = _b.updateCalendarDefaultMoth, setUpdateCalendarMonthNavigation = _b.setUpdateCalendarMonthNavigation, calendarHasError = _b.calendarHasError, setCalendarHasError = _b.setCalendarHasError, setUpdatedForSubmit = _b.setUpdatedForSubmit;
+            outerRangeContext: outerRangeContext,
+        }), setCalendarRange = _b.setCalendarRange, handleClearDates = _b.handleClearDates, calendarRange = _b.calendarRange, disabledDates = _b.disabledDates, setDisabledDates = _b.setDisabledDates, updateCalendarMonthNavigation = _b.updateCalendarMonthNavigation, updateCalendarDefaultMonth = _b.updateCalendarDefaultMonth, setUpdateCalendarMonthNavigation = _b.setUpdateCalendarMonthNavigation, calendarHasError = _b.calendarHasError, setCalendarHasError = _b.setCalendarHasError, setUpdatedForSubmit = _b.setUpdatedForSubmit, rangeContext = _b.rangeContext;
         // Display component after fully loaded
         useAwaitRender();
         // Handle close filter section
@@ -12023,7 +12027,7 @@
                 React__default.createElement("h2", null, t('filterBar:calendar.title')),
                 React__default.createElement(CloseButton, { handleClose: function () { return setToggleCalendar(false); } })),
             React__default.createElement("div", { className: "will-calendar-main" },
-                React__default.createElement(Calendar, { calendarRange: calendarRange, setCalendarRange: setCalendarRange, calendarOffset: calendarOffset, selectedPath: '/rooms', language: language, disableCalendarDates: disableCalendarDates, requestDates: requestDates, disabledDates: disabledDates, setDisabledDates: setDisabledDates, updateCalendarMonthNavigation: updateCalendarMonthNavigation, setUpdateCalendarMonthNavigation: setUpdateCalendarMonthNavigation, updateCalendarDefaultMoth: updateCalendarDefaultMoth, loadingData: loadingData, showFeedback: showFeedback, noActiveSelection: noActiveSelection, palette: palette, setCalendarHasError: setCalendarHasError, setUpdatedForSubmit: setUpdatedForSubmit, rangeContext: rangeContext, calendarHasError: calendarHasError })),
+                React__default.createElement(Calendar, { calendarRange: calendarRange, setCalendarRange: setCalendarRange, calendarOffset: calendarOffset, selectedPath: '/rooms', language: language, disableCalendarDates: disableCalendarDates, requestDates: requestDates, disabledDates: disabledDates, setDisabledDates: setDisabledDates, updateCalendarMonthNavigation: updateCalendarMonthNavigation, setUpdateCalendarMonthNavigation: setUpdateCalendarMonthNavigation, updateCalendarDefaultMonth: updateCalendarDefaultMonth, loadingData: loadingData, showFeedback: showFeedback, noActiveSelection: noActiveSelection, palette: palette, setCalendarHasError: setCalendarHasError, setUpdatedForSubmit: setUpdatedForSubmit, rangeContext: rangeContext, calendarHasError: calendarHasError })),
             React__default.createElement("div", { className: "will-calendar-footer" },
                 React__default.createElement("div", { className: "will-calendar-footer-actions-wrapper" },
                     React__default.createElement("div", { className: "will-calendar-footer-dates" },