willba-component-library 0.2.62 → 0.2.64
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/components/FilterCalendar/FilterCalendar.d.ts +1 -1
- package/lib/components/FilterCalendar/hooks/useFilterCalendar.d.ts +4 -2
- package/lib/core/components/calendar/hooks/useUpdateDisabledDates.d.ts +2 -1
- package/lib/core/components/calendar/utils/handleCalendarModifiers.d.ts +2 -1
- package/lib/index.d.ts +1 -1
- package/lib/index.esm.js +97 -22
- package/lib/index.esm.js.map +1 -1
- package/lib/index.js +97 -22
- package/lib/index.js.map +1 -1
- package/lib/index.umd.js +97 -22
- package/lib/index.umd.js.map +1 -1
- package/package.json +1 -1
- package/src/components/FilterCalendar/FilterCalendar.css +12 -1
- package/src/components/FilterCalendar/FilterCalendar.tsx +44 -17
- package/src/components/FilterCalendar/hooks/useFilterCalendar.ts +19 -1
- package/src/core/components/calendar/Calendar.tsx +13 -5
- package/src/core/components/calendar/hooks/useUpdateDisabledDates.tsx +19 -2
- package/src/core/components/calendar/utils/handleCalendarModifiers.tsx +4 -2
- package/src/locales/en/common.json +9 -1
- package/src/locales/en/filterBar.json +2 -1
- package/src/locales/fi/common.json +9 -1
- package/src/locales/fi/filterBar.json +2 -1
package/lib/index.js
CHANGED
|
@@ -2839,7 +2839,8 @@ var calendar$1 = {
|
|
|
2839
2839
|
endDate: "End date",
|
|
2840
2840
|
title: "Calendar",
|
|
2841
2841
|
checkoutOnly: "Check-out only",
|
|
2842
|
-
hasDisableDates: "Contains unavailable dates"
|
|
2842
|
+
hasDisableDates: "Contains unavailable dates",
|
|
2843
|
+
minNights: "2 nights min"
|
|
2843
2844
|
};
|
|
2844
2845
|
var guests$1 = {
|
|
2845
2846
|
label: "Number of guests",
|
|
@@ -2875,6 +2876,14 @@ var clearDates$1 = "Clear dates";
|
|
|
2875
2876
|
var noCheckIn$1 = "Room not available";
|
|
2876
2877
|
var noCheckOut$1 = "Check-out not available";
|
|
2877
2878
|
var checkOutOnly$1 = "Check-out only";
|
|
2879
|
+
var onlyCheckOut$1 = "Check-in only";
|
|
2880
|
+
var onlyCheckIn$1 = "Check-out only";
|
|
2881
|
+
var errors$1 = {
|
|
2882
|
+
calendarErrors: {
|
|
2883
|
+
checkInAvailabilityError: "Check-in available for second room only with connection dates",
|
|
2884
|
+
checkInAvailabilityGuide: "Start or end day need connection for previous reservation"
|
|
2885
|
+
}
|
|
2886
|
+
};
|
|
2878
2887
|
var enCommon = {
|
|
2879
2888
|
night: night$1,
|
|
2880
2889
|
nights: nights$1,
|
|
@@ -2885,7 +2894,10 @@ var enCommon = {
|
|
|
2885
2894
|
clearDates: clearDates$1,
|
|
2886
2895
|
noCheckIn: noCheckIn$1,
|
|
2887
2896
|
noCheckOut: noCheckOut$1,
|
|
2888
|
-
checkOutOnly: checkOutOnly$1
|
|
2897
|
+
checkOutOnly: checkOutOnly$1,
|
|
2898
|
+
onlyCheckOut: onlyCheckOut$1,
|
|
2899
|
+
onlyCheckIn: onlyCheckIn$1,
|
|
2900
|
+
errors: errors$1
|
|
2889
2901
|
};
|
|
2890
2902
|
|
|
2891
2903
|
var calendar = {
|
|
@@ -2896,7 +2908,8 @@ var calendar = {
|
|
|
2896
2908
|
endDate: "Loppu",
|
|
2897
2909
|
title: "Kalenteri",
|
|
2898
2910
|
checkoutOnly: "Check-out only",
|
|
2899
|
-
hasDisableDates: "Contains unavailable dates"
|
|
2911
|
+
hasDisableDates: "Contains unavailable dates",
|
|
2912
|
+
minNights: "2 nights min"
|
|
2900
2913
|
};
|
|
2901
2914
|
var guests = {
|
|
2902
2915
|
label: "Vierasmäärä",
|
|
@@ -2934,6 +2947,14 @@ var clearDates = "Tyhjennä";
|
|
|
2934
2947
|
var noCheckIn = "Huone ei saatavilla";
|
|
2935
2948
|
var noCheckOut = "Uloskirjaus ei saatavilla";
|
|
2936
2949
|
var checkOutOnly = "Vain uloskirjaus";
|
|
2950
|
+
var onlyCheckOut = "Check-in only";
|
|
2951
|
+
var onlyCheckIn = "Check-out only";
|
|
2952
|
+
var errors = {
|
|
2953
|
+
calendarErrors: {
|
|
2954
|
+
checkInAvailabilityError: "Check-in available for second room only with connection dates",
|
|
2955
|
+
checkInAvailabilityGuide: "Start or end day need connection for previous reservation"
|
|
2956
|
+
}
|
|
2957
|
+
};
|
|
2937
2958
|
var fiCommon = {
|
|
2938
2959
|
night: night,
|
|
2939
2960
|
nights: nights,
|
|
@@ -2944,7 +2965,10 @@ var fiCommon = {
|
|
|
2944
2965
|
clearDates: clearDates,
|
|
2945
2966
|
noCheckIn: noCheckIn,
|
|
2946
2967
|
noCheckOut: noCheckOut,
|
|
2947
|
-
checkOutOnly: checkOutOnly
|
|
2968
|
+
checkOutOnly: checkOutOnly,
|
|
2969
|
+
onlyCheckOut: onlyCheckOut,
|
|
2970
|
+
onlyCheckIn: onlyCheckIn,
|
|
2971
|
+
errors: errors
|
|
2948
2972
|
};
|
|
2949
2973
|
|
|
2950
2974
|
var urlParams = typeof window !== 'undefined'
|
|
@@ -11170,7 +11194,7 @@ var disabledDatesByPage = function (_a) {
|
|
|
11170
11194
|
|
|
11171
11195
|
var handleCalendarModifiers = function (_a) {
|
|
11172
11196
|
var _b;
|
|
11173
|
-
var newDisableCalendarDates = _a.newDisableCalendarDates, calendarRange = _a.calendarRange, disabledDatesByPage = _a.disabledDatesByPage, disabledDates = _a.disabledDates, overlappingDate = _a.overlappingDate, rangeContext = _a.rangeContext, firstPossibleRangeContextCheckIn = _a.firstPossibleRangeContextCheckIn, lastPossibleRangeContextCheckOut = _a.lastPossibleRangeContextCheckOut, findFirstPossibleRangeContextCheckIn = _a.findFirstPossibleRangeContextCheckIn, findLastPossibleRangeContextCheckOut = _a.findLastPossibleRangeContextCheckOut, currentSelectionLastCheckoutDate = _a.currentSelectionLastCheckoutDate;
|
|
11197
|
+
var newDisableCalendarDates = _a.newDisableCalendarDates, calendarRange = _a.calendarRange, disabledDatesByPage = _a.disabledDatesByPage, disabledDates = _a.disabledDates, overlappingDate = _a.overlappingDate, rangeContext = _a.rangeContext, firstPossibleRangeContextCheckIn = _a.firstPossibleRangeContextCheckIn, lastPossibleRangeContextCheckOut = _a.lastPossibleRangeContextCheckOut, findFirstPossibleRangeContextCheckIn = _a.findFirstPossibleRangeContextCheckIn, findLastPossibleRangeContextCheckOut = _a.findLastPossibleRangeContextCheckOut, currentSelectionLastCheckoutDate = _a.currentSelectionLastCheckoutDate, lastPossibleCheckout = _a.lastPossibleCheckout;
|
|
11174
11198
|
// Parse data
|
|
11175
11199
|
var calendarRangeFrom = (calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.from) && endOfDay(calendarRange.from);
|
|
11176
11200
|
var calendarRangeTo = (calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.to) && endOfDay(calendarRange.to);
|
|
@@ -11205,13 +11229,16 @@ var handleCalendarModifiers = function (_a) {
|
|
|
11205
11229
|
})));
|
|
11206
11230
|
})
|
|
11207
11231
|
: [];
|
|
11208
|
-
console.log();
|
|
11209
11232
|
return {
|
|
11210
11233
|
booked: disabledDatesByPage.length
|
|
11211
11234
|
? disabledDatesByPage
|
|
11212
11235
|
: (disabledDates === null || disabledDates === void 0 ? void 0 : disabledDates.length)
|
|
11213
|
-
? __spreadArray$1(__spreadArray$1(__spreadArray$1([
|
|
11214
|
-
|
|
11236
|
+
? __spreadArray$1(__spreadArray$1(__spreadArray$1([
|
|
11237
|
+
lastPossibleCheckout || []
|
|
11238
|
+
], __read(disabledDates), false), __read(firstPossibleRangeContextCheckIn), false), __read(lastPossibleRangeContextCheckOut), false) : ((_b = newDisableCalendarDates === null || newDisableCalendarDates === void 0 ? void 0 : newDisableCalendarDates.disabledDates) === null || _b === void 0 ? void 0 : _b.length)
|
|
11239
|
+
? __spreadArray$1(__spreadArray$1(__spreadArray$1([
|
|
11240
|
+
lastPossibleCheckout || []
|
|
11241
|
+
], __read(newDisableCalendarDates === null || newDisableCalendarDates === void 0 ? void 0 : newDisableCalendarDates.disabledDates), false), __read(firstPossibleRangeContextCheckIn), false), __read(lastPossibleRangeContextCheckOut), false) : [],
|
|
11215
11242
|
disabledAfterCheckIn: calendarRangeFrom
|
|
11216
11243
|
? [{ after: calendarRangeFrom }]
|
|
11217
11244
|
: [],
|
|
@@ -11429,6 +11456,7 @@ var useCalendarLoadingSpinner = function (_a) {
|
|
|
11429
11456
|
var useUpdateDisabledDates = function (_a) {
|
|
11430
11457
|
var disableCalendarDates = _a.disableCalendarDates, calendarRange = _a.calendarRange, updateCalendarMonthNavigation = _a.updateCalendarMonthNavigation, updateCalendarDefaultMonth = _a.updateCalendarDefaultMonth;
|
|
11431
11458
|
var _b = __read(React__default.useState(undefined), 2), overlappingDate = _b[0], setOverlappingDate = _b[1];
|
|
11459
|
+
var _c = __read(React__default.useState([]), 2), lastPossibleCheckout = _c[0], setLatsPossibleCheckout = _c[1];
|
|
11432
11460
|
var newDisableCalendarDates = React__default.useMemo(function () {
|
|
11433
11461
|
if (disableCalendarDates === null || disableCalendarDates === void 0 ? void 0 : disableCalendarDates.availableDates) {
|
|
11434
11462
|
var dateFormat_1 = 'dd-MM-yyyy';
|
|
@@ -11457,12 +11485,21 @@ var useUpdateDisabledDates = function (_a) {
|
|
|
11457
11485
|
}
|
|
11458
11486
|
return acc;
|
|
11459
11487
|
}, { updatedDisabledDates: [], newOverlappingDates: [] }), updatedDisabledDates = _a.updatedDisabledDates, newOverlappingDates_1 = _a.newOverlappingDates;
|
|
11488
|
+
// Find last possible checkout ( disable all dates after the last possible checkout )
|
|
11489
|
+
var lastPossibleCheckout_1 = disableCalendarDates.availableDates[disableCalendarDates.availableDates.length - 1].lastCheckOut;
|
|
11490
|
+
if (lastPossibleCheckout_1) {
|
|
11491
|
+
setLatsPossibleCheckout({ after: lastPossibleCheckout_1 });
|
|
11492
|
+
}
|
|
11493
|
+
// Extract overlapping dates ( dates that are only available for checkout )
|
|
11460
11494
|
if (newOverlappingDates_1.length) {
|
|
11461
11495
|
setOverlappingDate(function (prev) {
|
|
11462
11496
|
if (prev === void 0) { prev = []; }
|
|
11463
11497
|
return __spreadArray$1(__spreadArray$1([], __read(prev), false), __read(newOverlappingDates_1), false);
|
|
11464
11498
|
});
|
|
11465
11499
|
}
|
|
11500
|
+
if (newOverlappingDates_1.length) {
|
|
11501
|
+
console.log(newOverlappingDates_1);
|
|
11502
|
+
}
|
|
11466
11503
|
var newDisableCalendarDates_1 = __assign$2(__assign$2({}, disableCalendarDates), { disabledDates: updatedDisabledDates });
|
|
11467
11504
|
return newDisableCalendarDates_1;
|
|
11468
11505
|
}
|
|
@@ -11473,7 +11510,7 @@ var useUpdateDisabledDates = function (_a) {
|
|
|
11473
11510
|
updateCalendarMonthNavigation,
|
|
11474
11511
|
updateCalendarDefaultMonth,
|
|
11475
11512
|
]);
|
|
11476
|
-
return { newDisableCalendarDates: newDisableCalendarDates, overlappingDate: overlappingDate };
|
|
11513
|
+
return { newDisableCalendarDates: newDisableCalendarDates, overlappingDate: overlappingDate, lastPossibleCheckout: lastPossibleCheckout };
|
|
11477
11514
|
};
|
|
11478
11515
|
|
|
11479
11516
|
var css_248z$9 = ".rdp {\n --rdp-cell-size: 40px;\n --rdp-caption-font-size: 18px;\n --rdp-accent-color: #0000ff;\n --rdp-background-color: #e7edff;\n --rdp-accent-color-dark: #3003e1;\n --rdp-background-color-dark: #180270;\n --rdp-outline: 2px solid var(--rdp-accent-color); /* Outline border for focused elements */\n --rdp-outline-selected: 3px solid var(--rdp-accent-color); /* Outline border for focused _and_ selected elements */\n\n margin: 1em;\n}\n\n/* Hide elements for devices that are not screen readers */\n.rdp-vhidden {\n box-sizing: border-box;\n padding: 0;\n margin: 0;\n background: transparent;\n border: 0;\n -moz-appearance: none;\n -webkit-appearance: none;\n appearance: none;\n position: absolute !important;\n top: 0;\n width: 1px !important;\n height: 1px !important;\n padding: 0 !important;\n overflow: hidden !important;\n clip: rect(1px, 1px, 1px, 1px) !important;\n border: 0 !important;\n}\n\n/* Buttons */\n.rdp-button_reset {\n appearance: none;\n position: relative;\n margin: 0;\n padding: 0;\n cursor: default;\n color: inherit;\n background: none;\n font: inherit;\n\n -moz-appearance: none;\n -webkit-appearance: none;\n}\n\n.rdp-button_reset:focus-visible {\n /* Make sure to reset outline only when :focus-visible is supported */\n outline: none;\n}\n\n.rdp-button {\n border: 2px solid transparent;\n}\n\n.rdp-button[disabled]:not(.rdp-day_selected) {\n opacity: 0.25;\n}\n\n.rdp-button:not([disabled]) {\n cursor: pointer;\n}\n\n.rdp-button:focus-visible:not([disabled]) {\n color: inherit;\n background-color: var(--rdp-background-color);\n border: var(--rdp-outline);\n}\n\n.rdp-button:hover:not([disabled]):not(.rdp-day_selected) {\n background-color: var(--rdp-background-color);\n}\n\n.rdp-months {\n display: flex;\n}\n\n.rdp-month {\n margin: 0 1em;\n}\n\n.rdp-month:first-child {\n margin-left: 0;\n}\n\n.rdp-month:last-child {\n margin-right: 0;\n}\n\n.rdp-table {\n margin: 0;\n max-width: calc(var(--rdp-cell-size) * 7);\n border-collapse: collapse;\n}\n\n.rdp-with_weeknumber .rdp-table {\n max-width: calc(var(--rdp-cell-size) * 8);\n border-collapse: collapse;\n}\n\n.rdp-caption {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0;\n text-align: left;\n}\n\n.rdp-multiple_months .rdp-caption {\n position: relative;\n display: block;\n text-align: center;\n}\n\n.rdp-caption_dropdowns {\n position: relative;\n display: inline-flex;\n}\n\n.rdp-caption_label {\n position: relative;\n z-index: 1;\n display: inline-flex;\n align-items: center;\n margin: 0;\n padding: 0 0.25em;\n white-space: nowrap;\n color: currentColor;\n border: 0;\n border: 2px solid transparent;\n font-family: inherit;\n font-size: var(--rdp-caption-font-size);\n font-weight: bold;\n}\n\n.rdp-nav {\n white-space: nowrap;\n}\n\n.rdp-multiple_months .rdp-caption_start .rdp-nav {\n position: absolute;\n top: 50%;\n left: 0;\n transform: translateY(-50%);\n}\n\n.rdp-multiple_months .rdp-caption_end .rdp-nav {\n position: absolute;\n top: 50%;\n right: 0;\n transform: translateY(-50%);\n}\n\n.rdp-nav_button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: var(--rdp-cell-size);\n height: var(--rdp-cell-size);\n padding: 0.25em;\n border-radius: 100%;\n}\n\n/* ---------- */\n/* Dropdowns */\n/* ---------- */\n\n.rdp-dropdown_year,\n.rdp-dropdown_month {\n position: relative;\n display: inline-flex;\n align-items: center;\n}\n\n.rdp-dropdown {\n appearance: none;\n position: absolute;\n z-index: 2;\n top: 0;\n bottom: 0;\n left: 0;\n width: 100%;\n margin: 0;\n padding: 0;\n cursor: inherit;\n opacity: 0;\n border: none;\n background-color: transparent;\n font-family: inherit;\n font-size: inherit;\n line-height: inherit;\n}\n\n.rdp-dropdown[disabled] {\n opacity: unset;\n color: unset;\n}\n\n.rdp-dropdown:focus-visible:not([disabled]) + .rdp-caption_label {\n background-color: var(--rdp-background-color);\n border: var(--rdp-outline);\n border-radius: 6px;\n}\n\n.rdp-dropdown_icon {\n margin: 0 0 0 5px;\n}\n\n.rdp-head {\n border: 0;\n}\n\n.rdp-head_row,\n.rdp-row {\n height: 100%;\n}\n\n.rdp-head_cell {\n vertical-align: middle;\n font-size: 0.75em;\n font-weight: 700;\n text-align: center;\n height: 100%;\n height: var(--rdp-cell-size);\n padding: 0;\n text-transform: uppercase;\n}\n\n.rdp-tbody {\n border: 0;\n}\n\n.rdp-tfoot {\n margin: 0.5em;\n}\n\n.rdp-cell {\n width: var(--rdp-cell-size);\n height: 100%;\n height: var(--rdp-cell-size);\n padding: 0;\n text-align: center;\n}\n\n.rdp-weeknumber {\n font-size: 0.75em;\n}\n\n.rdp-weeknumber,\n.rdp-day {\n display: flex;\n overflow: hidden;\n align-items: center;\n justify-content: center;\n box-sizing: border-box;\n width: var(--rdp-cell-size);\n max-width: var(--rdp-cell-size);\n height: var(--rdp-cell-size);\n margin: 0;\n border: 2px solid transparent;\n border-radius: 100%;\n}\n\n.rdp-day_today:not(.rdp-day_outside) {\n font-weight: bold;\n}\n\n.rdp-day_selected,\n.rdp-day_selected:focus-visible,\n.rdp-day_selected:hover {\n color: white;\n opacity: 1;\n background-color: var(--rdp-accent-color);\n}\n\n.rdp-day_outside {\n opacity: 0.5;\n}\n\n.rdp-day_selected:focus-visible {\n /* Since the background is the same use again the outline */\n outline: var(--rdp-outline);\n outline-offset: 2px;\n z-index: 1;\n}\n\n.rdp:not([dir='rtl']) .rdp-day_range_start:not(.rdp-day_range_end) {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n\n.rdp:not([dir='rtl']) .rdp-day_range_end:not(.rdp-day_range_start) {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}\n\n.rdp[dir='rtl'] .rdp-day_range_start:not(.rdp-day_range_end) {\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n}\n\n.rdp[dir='rtl'] .rdp-day_range_end:not(.rdp-day_range_start) {\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n}\n\n.rdp-day_range_end.rdp-day_range_start {\n border-radius: 100%;\n}\n\n.rdp-day_range_middle {\n border-radius: 0;\n}";
|
|
@@ -11491,13 +11528,15 @@ var Calendar = React__default.forwardRef(function (_a, ref) {
|
|
|
11491
11528
|
var today = startOfDay(new Date());
|
|
11492
11529
|
var selectedStartDate = calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.from;
|
|
11493
11530
|
var rangeContextStartDate = rangeContext === null || rangeContext === void 0 ? void 0 : rangeContext.from;
|
|
11494
|
-
|
|
11531
|
+
console.log({ disableCalendarDates: disableCalendarDates });
|
|
11532
|
+
// Handle initial disable dates including overlapping availableDates.lastCheckOut and disabledDates.start
|
|
11495
11533
|
var _d = useUpdateDisabledDates({
|
|
11496
11534
|
disableCalendarDates: disableCalendarDates,
|
|
11497
11535
|
calendarRange: calendarRange,
|
|
11498
11536
|
updateCalendarMonthNavigation: updateCalendarMonthNavigation,
|
|
11499
11537
|
updateCalendarDefaultMonth: updateCalendarDefaultMonth,
|
|
11500
|
-
}), newDisableCalendarDates = _d.newDisableCalendarDates, overlappingDate = _d.overlappingDate;
|
|
11538
|
+
}), newDisableCalendarDates = _d.newDisableCalendarDates, overlappingDate = _d.overlappingDate, lastPossibleCheckout = _d.lastPossibleCheckout;
|
|
11539
|
+
console.log({ newDisableCalendarDates: newDisableCalendarDates });
|
|
11501
11540
|
// Handle disable dates by page
|
|
11502
11541
|
var disabledDatesByPage$1 = disabledDatesByPage({
|
|
11503
11542
|
today: today,
|
|
@@ -11527,6 +11566,7 @@ var Calendar = React__default.forwardRef(function (_a, ref) {
|
|
|
11527
11566
|
});
|
|
11528
11567
|
setUpdatedForSubmit && setUpdatedForSubmit(true);
|
|
11529
11568
|
};
|
|
11569
|
+
console.log({ disabledDates: disabledDates });
|
|
11530
11570
|
// Handle disabled dates for range context
|
|
11531
11571
|
var _e = handleRangeContextDisabledDates({
|
|
11532
11572
|
rangeContext: rangeContext,
|
|
@@ -11550,8 +11590,12 @@ var Calendar = React__default.forwardRef(function (_a, ref) {
|
|
|
11550
11590
|
: today), disabled: disabledDatesByPage$1.length
|
|
11551
11591
|
? disabledDatesByPage$1
|
|
11552
11592
|
: (disabledDates === null || disabledDates === void 0 ? void 0 : disabledDates.length)
|
|
11553
|
-
? __spreadArray$1(__spreadArray$1(__spreadArray$1([
|
|
11554
|
-
|
|
11593
|
+
? __spreadArray$1(__spreadArray$1(__spreadArray$1([
|
|
11594
|
+
lastPossibleCheckout && lastPossibleCheckout
|
|
11595
|
+
], __read(disabledDates), false), __read(firstPossibleRangeContextCheckIn), false), __read(lastPossibleRangeContextCheckOut), false) : ((_c = newDisableCalendarDates === null || newDisableCalendarDates === void 0 ? void 0 : newDisableCalendarDates.disabledDates) === null || _c === void 0 ? void 0 : _c.length)
|
|
11596
|
+
? __spreadArray$1(__spreadArray$1(__spreadArray$1([
|
|
11597
|
+
lastPossibleCheckout && lastPossibleCheckout
|
|
11598
|
+
], __read(newDisableCalendarDates.disabledDates), false), __read(firstPossibleRangeContextCheckIn), false), __read(lastPossibleRangeContextCheckOut), false) : [], fromMonth: today, onMonthChange: function (val) {
|
|
11555
11599
|
requestDates && setUpdateCalendarMonthNavigation
|
|
11556
11600
|
? (requestDates(val),
|
|
11557
11601
|
setUpdateCalendarMonthNavigation(function (prev) { return !prev; }))
|
|
@@ -11579,6 +11623,7 @@ var Calendar = React__default.forwardRef(function (_a, ref) {
|
|
|
11579
11623
|
disabledDates: disabledDates,
|
|
11580
11624
|
overlappingDate: overlappingDate,
|
|
11581
11625
|
rangeContext: rangeContext,
|
|
11626
|
+
lastPossibleCheckout: lastPossibleCheckout,
|
|
11582
11627
|
findFirstPossibleRangeContextCheckIn: findFirstPossibleRangeContextCheckIn,
|
|
11583
11628
|
findLastPossibleRangeContextCheckOut: findLastPossibleRangeContextCheckOut,
|
|
11584
11629
|
firstPossibleRangeContextCheckIn: firstPossibleRangeContextCheckIn,
|
|
@@ -11968,7 +12013,7 @@ var AGE_CATEGORIES_FALLBACK = [
|
|
|
11968
12013
|
var REDIRECT_URL_FALLBACK = 'http://localhost:3000/';
|
|
11969
12014
|
|
|
11970
12015
|
var useFilterCalendar = function (_a) {
|
|
11971
|
-
var onSubmit = _a.onSubmit, setToggleCalendar = _a.setToggleCalendar, noActiveSelection = _a.noActiveSelection, toggleCalendar = _a.toggleCalendar, outerRangeContext = _a.outerRangeContext;
|
|
12016
|
+
var onSubmit = _a.onSubmit, setToggleCalendar = _a.setToggleCalendar, noActiveSelection = _a.noActiveSelection, toggleCalendar = _a.toggleCalendar, outerRangeContext = _a.outerRangeContext, outerDisableCalendarDates = _a.outerDisableCalendarDates;
|
|
11972
12017
|
// State
|
|
11973
12018
|
var _b = __read(React__default.useState(), 2), calendarRange = _b[0], setCalendarRange = _b[1];
|
|
11974
12019
|
var _c = __read(React__default.useState(outerRangeContext), 2), rangeContext = _c[0], setRangeContext = _c[1];
|
|
@@ -11978,7 +12023,15 @@ var useFilterCalendar = function (_a) {
|
|
|
11978
12023
|
var _g = __read(React__default.useState(0), 2), updateCalendarDefaultMonth = _g[0], setUpdateCalendarDefaultMonth = _g[1];
|
|
11979
12024
|
var _h = __read(React__default.useState(false), 2), calendarHasError = _h[0], setCalendarHasError = _h[1];
|
|
11980
12025
|
var _j = __read(React__default.useState(false), 2), updatedForSubmit = _j[0], setUpdatedForSubmit = _j[1];
|
|
12026
|
+
var _k = __read(React__default.useState(), 2), disableCalendarDates = _k[0], setDisableCalendarDates = _k[1];
|
|
11981
12027
|
// Lifecycle
|
|
12028
|
+
// Handle update component with new data
|
|
12029
|
+
React__default.useEffect(function () {
|
|
12030
|
+
if (outerDisableCalendarDates) {
|
|
12031
|
+
setDisableCalendarDates(outerDisableCalendarDates);
|
|
12032
|
+
}
|
|
12033
|
+
}, [outerDisableCalendarDates]);
|
|
12034
|
+
// Handle Range Context initial selections
|
|
11982
12035
|
React__default.useEffect(function () {
|
|
11983
12036
|
if (typeof window === 'undefined')
|
|
11984
12037
|
return;
|
|
@@ -12008,6 +12061,7 @@ var useFilterCalendar = function (_a) {
|
|
|
12008
12061
|
}
|
|
12009
12062
|
}
|
|
12010
12063
|
}, [toggleCalendar]);
|
|
12064
|
+
// Handle submit dates
|
|
12011
12065
|
React__default.useEffect(function () {
|
|
12012
12066
|
var formatString = 'dd.MM.yyyy';
|
|
12013
12067
|
var initialRangeTo = (initialCalendarRange === null || initialCalendarRange === void 0 ? void 0 : initialCalendarRange.to)
|
|
@@ -12057,25 +12111,30 @@ var useFilterCalendar = function (_a) {
|
|
|
12057
12111
|
setCalendarHasError: setCalendarHasError,
|
|
12058
12112
|
setUpdatedForSubmit: setUpdatedForSubmit,
|
|
12059
12113
|
rangeContext: rangeContext,
|
|
12114
|
+
disableCalendarDates: disableCalendarDates,
|
|
12060
12115
|
};
|
|
12061
12116
|
};
|
|
12062
12117
|
|
|
12063
|
-
var css_248z = ".will-root .will-calendar-wrapper {\n box-shadow: var(--will-box-shadow-dark);\n border-radius: 20px;\n background-color: var(--will-white);\n position: absolute;\n top: 0;\n left: 0;\n}\n\n.will-root .will-calendar-wrapper .will-calendar-header,\n.will-root .will-calendar-wrapper .will-calendar-main,\n.will-root .will-calendar-wrapper .will-calendar-footer {\n padding: 20px;\n}\n\n/* Header */\n\n.will-root .will-calendar-wrapper .will-calendar-header {\n display: flex;\n justify-content: space-between;\n border-bottom: 1px solid var(--will-grey);\n align-items: center;\n}\n\n/* Footer */\n\n.will-root .will-calendar-wrapper .will-calendar-footer {\n border-top: 1px solid var(--will-grey);\n}\n\n/* Footer actions */\n\n.will-root .will-calendar-wrapper .will-calendar-footer-actions-wrapper {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 10px;\n}\n\n.will-root .will-calendar-wrapper .will-calendar-footer-dates > div {\n margin-bottom: 5px;\n}\n\n.will-root .will-calendar-wrapper .will-calendar-footer-dates-separator {\n margin: 0 15px;\n}\n\n.will-root .will-calendar-wrapper .will-calendar-footer-dates .will-calendar-footer-booked {\n display: flex;\n min-height: 20.5px;\n}\n\n.will-root .will-calendar-wrapper .will-calendar-footer-actions {\n display: flex;\n align-items: center;\n gap: 10px;\n}\n\n@media (max-width: 960px) {\n .will-root .will-calendar-wrapper {\n width: -webkit-fill-available;\n }\n\n .will-root .will-calendar-wrapper .will-calendar-header,\n .will-root .will-calendar-wrapper .will-calendar-main,\n .will-root .will-calendar-wrapper .will-calendar-footer {\n padding: 20px 10px;\n }\n\n .will-root .will-calendar-wrapper .will-calendar-footer {\n flex-direction: column;\n }\n\n .will-root .will-calendar-wrapper .will-calendar-footer-dates {\n margin-bottom: 12px;\n text-align: center;\n }\n\n .will-root .will-calendar-wrapper .will-calendar-footer-dates .will-calendar-footer-booked {\n justify-content: center;\n }\n\n .will-root .will-calendar-wrapper .will-calendar-footer-actions {\n flex-direction: column;\n width: 100%;\n }\n\n .will-root .will-calendar-wrapper .will-calendar-footer-actions button{\n width: 100%;\n }\n }\n\n.will-root .will-calendar-wrapper .will-calendar-header .will-filter-bar-close-button {\n position: initial;\n}";
|
|
12118
|
+
var css_248z = ".will-root .will-calendar-wrapper {\n box-shadow: var(--will-box-shadow-dark);\n border-radius: 20px;\n background-color: var(--will-white);\n position: absolute;\n top: 0;\n left: 0;\n}\n\n.will-root .will-calendar-wrapper .will-calendar-header,\n.will-root .will-calendar-wrapper .will-calendar-main,\n.will-root .will-calendar-wrapper .will-calendar-footer {\n padding: 20px;\n}\n\n/* Header */\n\n.will-root .will-calendar-wrapper .will-calendar-header {\n display: flex;\n justify-content: space-between;\n border-bottom: 1px solid var(--will-grey);\n align-items: center;\n}\n\n/* Footer */\n\n.will-root .will-calendar-wrapper .will-calendar-footer {\n border-top: 1px solid var(--will-grey);\n}\n\n/* Footer actions */\n\n.will-root .will-calendar-wrapper .will-calendar-footer-actions-wrapper {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 10px;\n}\n\n.will-root .will-calendar-wrapper .will-calendar-footer-dates > div {\n margin-bottom: 5px;\n}\n\n.will-root .will-calendar-wrapper .will-calendar-footer-dates-separator {\n margin: 0 15px;\n}\n\n.will-root .will-calendar-wrapper .will-calendar-footer-dates .will-calendar-footer-booked {\n display: flex;\n min-height: 20.5px;\n margin-top: 10px;\n}\n\n.will-root .will-calendar-wrapper .will-calendar-footer-actions {\n display: flex;\n align-items: center;\n gap: 10px;\n}\n\n.will-root .will-calendar-wrapper .will-calendar-footer-error {\n display: flex;\n align-items: center;\n}\n\n@media (max-width: 960px) {\n .will-root .will-calendar-wrapper {\n width: -webkit-fill-available;\n }\n\n .will-root .will-calendar-wrapper .will-calendar-header,\n .will-root .will-calendar-wrapper .will-calendar-main,\n .will-root .will-calendar-wrapper .will-calendar-footer {\n padding: 20px 10px;\n }\n\n .will-root .will-calendar-wrapper .will-calendar-footer-actions-wrapper {\n flex-direction: column;\n }\n\n .will-root .will-calendar-wrapper .will-calendar-footer-dates {\n margin-bottom: 12px;\n text-align: center;\n }\n\n .will-root .will-calendar-wrapper .will-calendar-footer-dates .will-calendar-footer-booked {\n justify-content: center;\n }\n\n .will-root .will-calendar-wrapper .will-calendar-footer-actions {\n flex-direction: column;\n width: 100%;\n }\n\n .will-root .will-calendar-wrapper .will-calendar-footer-actions button{\n width: 100%;\n }\n\n .will-root .will-calendar-wrapper .will-calendar-footer-error {\n min-width: 20px;\n margin-bottom: 10px; \n }\n }\n\n.will-root .will-calendar-wrapper .will-calendar-header .will-filter-bar-close-button {\n position: initial;\n}";
|
|
12064
12119
|
styleInject(css_248z);
|
|
12065
12120
|
|
|
12066
12121
|
function FilterCalendar(_a) {
|
|
12067
|
-
var calendarOffset = _a.calendarOffset, language = _a.language, palette = _a.palette, onSubmit = _a.onSubmit,
|
|
12122
|
+
var calendarOffset = _a.calendarOffset, language = _a.language, palette = _a.palette, onSubmit = _a.onSubmit, outerDisableCalendarDates = _a.disableCalendarDates, toggleCalendar = _a.toggleCalendar, loadingData = _a.loadingData, setToggleCalendar = _a.setToggleCalendar, requestDates = _a.requestDates, showFeedback = _a.showFeedback, noActiveSelection = _a.noActiveSelection, outerRangeContext = _a.rangeContext;
|
|
12068
12123
|
var themePalette = useTheme({ palette: palette });
|
|
12069
12124
|
// Translations
|
|
12070
12125
|
useUpdateTranslations({ language: language });
|
|
12071
12126
|
var t = useTranslation().t;
|
|
12127
|
+
var isMobile = reactResponsiveExports.useMediaQuery({ maxWidth: 690 });
|
|
12128
|
+
console.log('1', { outerDisableCalendarDates: outerDisableCalendarDates });
|
|
12072
12129
|
var _b = useFilterCalendar({
|
|
12073
12130
|
onSubmit: onSubmit,
|
|
12074
12131
|
setToggleCalendar: setToggleCalendar,
|
|
12075
12132
|
noActiveSelection: noActiveSelection,
|
|
12076
12133
|
toggleCalendar: toggleCalendar,
|
|
12077
12134
|
outerRangeContext: outerRangeContext,
|
|
12078
|
-
|
|
12135
|
+
outerDisableCalendarDates: outerDisableCalendarDates,
|
|
12136
|
+
}), 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, disableCalendarDates = _b.disableCalendarDates;
|
|
12137
|
+
console.log('1', { disableCalendarDates: disableCalendarDates });
|
|
12079
12138
|
// Display component after fully loaded
|
|
12080
12139
|
useAwaitRender();
|
|
12081
12140
|
// Handle close filter section
|
|
@@ -12094,7 +12153,7 @@ function FilterCalendar(_a) {
|
|
|
12094
12153
|
React__default.createElement("div", { className: "will-calendar-footer" },
|
|
12095
12154
|
React__default.createElement("div", { className: "will-calendar-footer-actions-wrapper" },
|
|
12096
12155
|
React__default.createElement("div", { className: "will-calendar-footer-dates" },
|
|
12097
|
-
calendarHasError ? (React__default.createElement("span", null, "
|
|
12156
|
+
calendarHasError ? (React__default.createElement("span", null, t("common:errors.calendarErrors.checkInAvailabilityGuide"))) : (React__default.createElement("div", null,
|
|
12098
12157
|
React__default.createElement("span", null, parseDate({
|
|
12099
12158
|
date: calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.from,
|
|
12100
12159
|
dateFormat: 'EEEEEE d.M.yyyy',
|
|
@@ -12107,16 +12166,32 @@ function FilterCalendar(_a) {
|
|
|
12107
12166
|
language: language,
|
|
12108
12167
|
}) || t('common:checkOut')))),
|
|
12109
12168
|
React__default.createElement("span", { className: "will-calendar-footer-booked" }, calendarHasError
|
|
12110
|
-
?
|
|
12169
|
+
? t("filterBar:calendar.minNights")
|
|
12111
12170
|
: nights
|
|
12112
12171
|
? "".concat(nights, " ").concat(t("common:".concat(nights === 1 ? 'night' : 'nights')))
|
|
12113
12172
|
: '')),
|
|
12173
|
+
calendarHasError &&
|
|
12174
|
+
isMobile &&
|
|
12175
|
+
renderCalendarErrorMessage({
|
|
12176
|
+
palette: palette,
|
|
12177
|
+
message: t("common:errors.calendarErrors.checkInAvailabilityError"),
|
|
12178
|
+
}),
|
|
12114
12179
|
React__default.createElement("div", { className: "will-calendar-footer-actions" },
|
|
12115
12180
|
React__default.createElement(SubmitButton, { onClick: handleClearDates, disabled: !(calendarRange === null || calendarRange === void 0 ? void 0 : calendarRange.from), label: t("common:clearDates") }))),
|
|
12116
|
-
calendarHasError &&
|
|
12117
|
-
|
|
12118
|
-
|
|
12181
|
+
calendarHasError &&
|
|
12182
|
+
!isMobile &&
|
|
12183
|
+
renderCalendarErrorMessage({
|
|
12184
|
+
palette: palette,
|
|
12185
|
+
message: t("common:errors.calendarErrors.checkInAvailabilityError"),
|
|
12186
|
+
}))))));
|
|
12119
12187
|
}
|
|
12188
|
+
/////////
|
|
12189
|
+
var renderCalendarErrorMessage = function (_a) {
|
|
12190
|
+
var message = _a.message, palette = _a.palette;
|
|
12191
|
+
return (React__default.createElement("div", { className: "will-calendar-footer-error" },
|
|
12192
|
+
React__default.createElement(IconsSvg, { fill: (palette === null || palette === void 0 ? void 0 : palette.error) || 'inherit', size: 25, icon: "warning" }),
|
|
12193
|
+
React__default.createElement("span", { style: { marginLeft: '10px' } }, message || '')));
|
|
12194
|
+
};
|
|
12120
12195
|
|
|
12121
12196
|
exports.Button = Button$1;
|
|
12122
12197
|
exports.FilterBar = FilterBar;
|